From 56f67c7d62d60b26a3dfbf8e359f12257dcbc8eb Mon Sep 17 00:00:00 2001 From: Zhiheng Zhang <55773069+zhihengGet@users.noreply.github.com> Date: Thu, 25 Jul 2024 18:13:35 -0700 Subject: [PATCH] WIP: Svelte 5 adapter (#6981) docs(svelte-5-adapter): force runes mode for all examples (#7800) * docs(examples): force runes mode for all examples * Fix simple example mounting * Fix type feat(svelte-5-adapter): require options to be passed as function (#7804) * fix(svelte-5-adapter): Require options to be passed as function * More fixes * More fixes * Update examples fix(svelte-5-adapter): function for `createMutation` options (#7805) * fix(svelte-5-adapter): require function for createMutation options * Fix type errors refactor(svelte-5-adapter): simplify createBaseQuery (#7808) * refactor: simplify createBaseQuery * Don't take snapshot of queryKey chore(svelte-5-adapter): tidy-up functions (#7809) * chore(svelte-5-adapter): tidy-up functions * Fix types * Update svelte Fix import extensions chore: ignore state_snapshot_uncloneable in tests Fix merge --- eslint.config.js | 1 + examples/svelte/auto-refetching/package.json | 4 +- .../auto-refetching/src/routes/+layout.svelte | 4 +- .../auto-refetching/src/routes/+page.svelte | 40 ++- .../svelte/auto-refetching/svelte.config.js | 6 +- examples/svelte/basic/package.json | 4 +- examples/svelte/basic/src/lib/Post.svelte | 20 +- examples/svelte/basic/src/lib/Posts.svelte | 14 +- .../svelte/basic/src/routes/+layout.svelte | 4 +- .../basic/src/routes/[postId]/+page.svelte | 3 +- examples/svelte/basic/svelte.config.js | 6 +- .../load-more-infinite-scroll/package.json | 4 +- .../load-more-infinite-scroll/src/app.css | 10 +- .../src/lib/LoadMore.svelte | 22 +- .../src/routes/+layout.svelte | 4 +- .../svelte.config.js | 6 +- .../svelte/optimistic-updates/package.json | 4 +- .../src/routes/+layout.svelte | 4 +- .../src/routes/+page.svelte | 30 +- .../optimistic-updates/svelte.config.js | 6 +- examples/svelte/playground/package.json | 4 +- .../playground/src/lib/stores.svelte.ts | 37 +++ examples/svelte/playground/src/lib/stores.ts | 26 -- .../playground/src/routes/+layout.svelte | 4 +- .../svelte/playground/src/routes/+page.svelte | 16 +- .../playground/src/routes/AddTodo.svelte | 47 ++- .../svelte/playground/src/routes/App.svelte | 12 +- .../playground/src/routes/EditTodo.svelte | 83 +++-- .../playground/src/routes/TodosList.svelte | 48 ++- examples/svelte/playground/svelte.config.js | 4 +- examples/svelte/simple/package.json | 4 +- examples/svelte/simple/src/lib/Simple.svelte | 22 +- examples/svelte/simple/src/main.ts | 3 +- examples/svelte/simple/svelte.config.js | 5 +- examples/svelte/ssr/package.json | 4 +- examples/svelte/ssr/src/lib/Post.svelte | 20 +- examples/svelte/ssr/src/lib/Posts.svelte | 16 +- examples/svelte/ssr/src/routes/+layout.svelte | 5 +- examples/svelte/ssr/src/routes/+layout.ts | 2 +- .../ssr/src/routes/[postId]/+page.svelte | 3 +- examples/svelte/ssr/svelte.config.js | 6 +- examples/svelte/star-wars/package.json | 4 +- .../star-wars/src/routes/+layout.svelte | 4 +- .../src/routes/characters/+page.svelte | 12 +- .../characters/[characterId]/+page.svelte | 29 +- .../characters/[characterId]/Film.svelte | 10 +- .../characters/[characterId]/Homeworld.svelte | 10 +- .../star-wars/src/routes/films/+page.svelte | 12 +- .../src/routes/films/[filmId]/+page.svelte | 19 +- .../routes/films/[filmId]/Character.svelte | 10 +- examples/svelte/star-wars/svelte.config.js | 4 +- integrations/svelte-vite/package.json | 4 +- packages/svelte-query-devtools/package.json | 6 +- .../svelte-query-devtools/src/Devtools.svelte | 77 ++++- .../eslint.config.js | 1 + .../svelte-query-persist-client/package.json | 6 +- .../src/PersistQueryClientProvider.svelte | 76 +++-- .../AwaitOnSuccess/AwaitOnSuccess.svelte | 17 +- .../tests/AwaitOnSuccess/Provider.svelte | 13 +- .../tests/FreshData/FreshData.svelte | 31 +- .../tests/FreshData/Provider.svelte | 15 +- .../tests/InitialData/InitialData.svelte | 21 +- .../tests/InitialData/Provider.svelte | 13 +- .../tests/OnSuccess/OnSuccess.svelte | 10 +- .../tests/OnSuccess/Provider.svelte | 10 +- ...PersistQueryClientProvider.svelte.test.ts} | 91 +++-- .../tests/RemoveCache/Provider.svelte | 8 +- .../tests/RemoveCache/RemoveCache.svelte | 10 +- .../tests/RestoreCache/Provider.svelte | 13 +- .../tests/RestoreCache/RestoreCache.svelte | 21 +- .../tests/UseQueries/Provider.svelte | 13 +- .../tests/UseQueries/UseQueries.svelte | 19 +- .../tests/{utils.ts => utils.svelte.ts} | 13 + packages/svelte-query/eslint.config.js | 1 + packages/svelte-query/package.json | 6 +- .../svelte-query/src/HydrationBoundary.svelte | 19 +- .../src/QueryClientProvider.svelte | 6 +- packages/svelte-query/src/context.ts | 12 +- .../src/createBaseQuery.svelte.ts | 83 +++++ packages/svelte-query/src/createBaseQuery.ts | 87 ----- .../svelte-query/src/createInfiniteQuery.ts | 6 +- .../svelte-query/src/createMutation.svelte.ts | 71 ++++ packages/svelte-query/src/createMutation.ts | 52 --- ...eateQueries.ts => createQueries.svelte.ts} | 86 ++--- packages/svelte-query/src/createQuery.ts | 12 +- packages/svelte-query/src/index.ts | 12 +- packages/svelte-query/src/types.ts | 24 +- .../svelte-query/src/useIsFetching.svelte.ts | 23 ++ packages/svelte-query/src/useIsFetching.ts | 30 -- ...eIsMutating.ts => useIsMutating.svelte.ts} | 11 +- packages/svelte-query/src/useIsRestoring.ts | 3 +- .../src/useMutationState.svelte.ts | 56 ++++ packages/svelte-query/src/useMutationState.ts | 49 --- packages/svelte-query/src/utils.ts | 10 - .../QueryClientProvider/ChildComponent.svelte | 8 +- .../ParentComponent.svelte | 2 +- .../createInfiniteQuery/BaseExample.svelte | 22 +- .../createInfiniteQuery/SelectExample.svelte | 16 +- .../createInfiniteQuery.test.ts | 27 +- .../createMutation/FailureExample.svelte | 22 +- .../createMutation/OnSuccessExample.svelte | 6 +- .../tests/createMutation/ResetExample.svelte | 10 +- .../createMutation/createMutation.test.ts | 4 +- .../tests/createQueries/BaseExample.svelte | 21 +- .../tests/createQueries/CombineExample.svelte | 21 +- .../createQueries/createQueries.test-d.ts | 19 +- .../tests/createQueries/createQueries.test.ts | 4 +- .../tests/createQuery/BaseExample.svelte | 28 +- .../tests/createQuery/DisabledExample.svelte | 46 +-- .../tests/createQuery/PlaceholderData.svelte | 49 +-- .../tests/createQuery/RefetchExample.svelte | 44 ++- ...ery.test.ts => createQuery.svelte.test.ts} | 118 +++---- .../tests/createQuery/createQuery.test-d.ts | 34 +- .../infiniteQueryOptions.test-d.ts | 5 +- .../tests/queryOptions/queryOptions.test-d.ts | 5 +- .../tests/useIsFetching/BaseExample.svelte | 32 +- .../tests/useIsFetching/useIsFetching.test.ts | 9 +- .../tests/useIsMutating/BaseExample.svelte | 13 +- .../tests/useMutationState/BaseExample.svelte | 29 +- .../useMutationState/useMutationState.test.ts | 24 +- packages/svelte-query/tests/utils.svelte.ts | 18 + packages/svelte-query/tests/utils.ts | 5 - packages/svelte-query/vite.config.ts | 8 +- pnpm-lock.yaml | 314 ++++++++---------- 124 files changed, 1478 insertions(+), 1313 deletions(-) create mode 100644 examples/svelte/playground/src/lib/stores.svelte.ts delete mode 100644 examples/svelte/playground/src/lib/stores.ts rename packages/svelte-query-persist-client/tests/{PersistQueryClientProvider.test.ts => PersistQueryClientProvider.svelte.test.ts} (79%) rename packages/svelte-query-persist-client/tests/{utils.ts => utils.svelte.ts} (72%) create mode 100644 packages/svelte-query/src/createBaseQuery.svelte.ts delete mode 100644 packages/svelte-query/src/createBaseQuery.ts create mode 100644 packages/svelte-query/src/createMutation.svelte.ts delete mode 100644 packages/svelte-query/src/createMutation.ts rename packages/svelte-query/src/{createQueries.ts => createQueries.svelte.ts} (85%) create mode 100644 packages/svelte-query/src/useIsFetching.svelte.ts delete mode 100644 packages/svelte-query/src/useIsFetching.ts rename packages/svelte-query/src/{useIsMutating.ts => useIsMutating.svelte.ts} (77%) create mode 100644 packages/svelte-query/src/useMutationState.svelte.ts delete mode 100644 packages/svelte-query/src/useMutationState.ts delete mode 100644 packages/svelte-query/src/utils.ts rename packages/svelte-query/tests/createQuery/{createQuery.test.ts => createQuery.svelte.test.ts} (76%) create mode 100644 packages/svelte-query/tests/utils.svelte.ts delete mode 100644 packages/svelte-query/tests/utils.ts diff --git a/eslint.config.js b/eslint.config.js index d8a5458377..d0c2ccc429 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -40,6 +40,7 @@ export default [ '@typescript-eslint/no-empty-function': 'off', '@typescript-eslint/no-unsafe-function-type': 'off', 'no-case-declarations': 'off', + 'prefer-const': 'off', }, }, { diff --git a/examples/svelte/auto-refetching/package.json b/examples/svelte/auto-refetching/package.json index 5d22bd7148..546a2e293a 100644 --- a/examples/svelte/auto-refetching/package.json +++ b/examples/svelte/auto-refetching/package.json @@ -15,8 +15,8 @@ "devDependencies": { "@sveltejs/adapter-auto": "^3.2.3", "@sveltejs/kit": "^2.8.2", - "@sveltejs/vite-plugin-svelte": "^3.1.2", - "svelte": "^4.2.18", + "@sveltejs/vite-plugin-svelte": "^4.0.0", + "svelte": "^5.0.0", "svelte-check": "^4.0.0", "typescript": "5.7.2", "vite": "^5.3.5" diff --git a/examples/svelte/auto-refetching/src/routes/+layout.svelte b/examples/svelte/auto-refetching/src/routes/+layout.svelte index ef60a2f559..4b170dc01e 100644 --- a/examples/svelte/auto-refetching/src/routes/+layout.svelte +++ b/examples/svelte/auto-refetching/src/routes/+layout.svelte @@ -4,6 +4,8 @@ import { QueryClientProvider, QueryClient } from '@tanstack/svelte-query' import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools' + const { children } = $props() + const queryClient = new QueryClient({ defaultOptions: { queries: { @@ -15,7 +17,7 @@
- + {@render children()}
diff --git a/examples/svelte/auto-refetching/src/routes/+page.svelte b/examples/svelte/auto-refetching/src/routes/+page.svelte index ab5e83e17f..40fdc0e541 100644 --- a/examples/svelte/auto-refetching/src/routes/+page.svelte +++ b/examples/svelte/auto-refetching/src/routes/+page.svelte @@ -5,30 +5,30 @@ createMutation, } from '@tanstack/svelte-query' - let intervalMs = 1000 - let value = '' + let intervalMs = $state(1000) + let value = $state('') const client = useQueryClient() const endpoint = 'http://localhost:5173/api/data' - $: todos = createQuery<{ items: string[] }>({ + const todos = createQuery<{ items: string[] }>(() => ({ queryKey: ['refetch'], queryFn: async () => await fetch(endpoint).then((r) => r.json()), // Refetch the data every second refetchInterval: intervalMs, - }) + })) - const addMutation = createMutation({ + const addMutation = createMutation(() => ({ mutationFn: (value: string) => fetch(`${endpoint}?add=${value}`).then((r) => r.json()), onSuccess: () => client.invalidateQueries({ queryKey: ['refetch'] }), - }) + })) - const clearMutation = createMutation({ + const clearMutation = createMutation(() => ({ mutationFn: () => fetch(`${endpoint}?clear=1`).then((r) => r.json()), onSuccess: () => client.invalidateQueries({ queryKey: ['refetch'] }), - }) + }))

Auto Refetch with stale-time set to 1s

@@ -49,8 +49,8 @@ margin-left:.5rem; width:.75rem; height:.75rem; - background: {$todos.isFetching ? 'green' : 'transparent'}; - transition: {!$todos.isFetching ? 'all .3s ease' : 'none'}; + background: {todos.isFetching ? 'green' : 'transparent'}; + transition: {!todos.isFetching ? 'all .3s ease' : 'none'}; border-radius: 100%; transform: scale(1.5)" > @@ -58,10 +58,10 @@

Todo List

{ + onsubmit={(e) => { e.preventDefault() e.stopPropagation() - $addMutation.mutate(value, { + addMutation.mutate(value, { onSuccess: () => (value = ''), }) }} @@ -69,26 +69,24 @@
-{#if $todos.isPending} +{#if todos.isPending} Loading... {/if} -{#if $todos.error} +{#if todos.error} An error has occurred: - {$todos.error.message} + {todos.error.message} {/if} -{#if $todos.isSuccess} +{#if todos.isSuccess}
- +
{/if} -{#if $todos.isFetching} +{#if todos.isFetching}
'Background Updating...' : ' '
diff --git a/examples/svelte/auto-refetching/svelte.config.js b/examples/svelte/auto-refetching/svelte.config.js index 2dee2d78a1..d6b43b0085 100644 --- a/examples/svelte/auto-refetching/svelte.config.js +++ b/examples/svelte/auto-refetching/svelte.config.js @@ -3,13 +3,13 @@ import { vitePreprocess } from '@sveltejs/vite-plugin-svelte' /** @type {import('@sveltejs/kit').Config} */ const config = { - // Consult https://github.com/sveltejs/svelte-preprocess - // for more information about preprocessors preprocess: vitePreprocess(), - kit: { adapter: adapter(), }, + compilerOptions: { + runes: true, + }, } export default config diff --git a/examples/svelte/basic/package.json b/examples/svelte/basic/package.json index 41b08a5898..875be7d802 100644 --- a/examples/svelte/basic/package.json +++ b/examples/svelte/basic/package.json @@ -17,8 +17,8 @@ "devDependencies": { "@sveltejs/adapter-auto": "^3.2.3", "@sveltejs/kit": "^2.8.2", - "@sveltejs/vite-plugin-svelte": "^3.1.2", - "svelte": "^4.2.18", + "@sveltejs/vite-plugin-svelte": "^4.0.0", + "svelte": "^5.0.0", "svelte-check": "^4.0.0", "typescript": "5.7.2", "vite": "^5.3.5" diff --git a/examples/svelte/basic/src/lib/Post.svelte b/examples/svelte/basic/src/lib/Post.svelte index 56472ce68f..49469c2fb5 100644 --- a/examples/svelte/basic/src/lib/Post.svelte +++ b/examples/svelte/basic/src/lib/Post.svelte @@ -3,29 +3,29 @@ import { getPostById } from './data' import type { Post } from './types' - export let postId: number + const { postId }: { postId: number } = $props() - const post = createQuery({ + const post = createQuery(() => ({ queryKey: ['post', postId], queryFn: () => getPostById(postId), - }) + }))
Back
- {#if !postId || $post.isPending} + {#if !postId || post.isPending} Loading... {/if} - {#if $post.error} - Error: {$post.error.message} + {#if post.error} + Error: {post.error.message} {/if} - {#if $post.isSuccess} -

{$post.data.title}

+ {#if post.isSuccess} +

{post.data.title}

-

{$post.data.body}

+

{post.data.body}

-
{$post.isFetching ? 'Background Updating...' : ' '}
+
{post.isFetching ? 'Background Updating...' : ' '}
{/if}
diff --git a/examples/svelte/basic/src/lib/Posts.svelte b/examples/svelte/basic/src/lib/Posts.svelte index c4f2f2c642..e6a0851ee2 100644 --- a/examples/svelte/basic/src/lib/Posts.svelte +++ b/examples/svelte/basic/src/lib/Posts.svelte @@ -9,21 +9,21 @@ const posts = createQuery< { id: number; title: string; body: string }[], Error - >({ + >(() => ({ queryKey: ['posts', limit], queryFn: () => getPosts(limit), - }) + }))
- {#if $posts.status === 'pending'} + {#if posts.status === 'pending'} Loading... - {:else if $posts.status === 'error'} - Error: {$posts.error.message} + {:else if posts.status === 'error'} + Error: {posts.error.message} {:else}
    - {#each $posts.data as post} + {#each posts.data as post}
- {#if $posts.isFetching} + {#if posts.isFetching}
Background Updating...
diff --git a/examples/svelte/basic/src/routes/+layout.svelte b/examples/svelte/basic/src/routes/+layout.svelte index da5d841b0b..2cb76cd097 100644 --- a/examples/svelte/basic/src/routes/+layout.svelte +++ b/examples/svelte/basic/src/routes/+layout.svelte @@ -6,6 +6,8 @@ import { PersistQueryClientProvider } from '@tanstack/svelte-query-persist-client' import { createSyncStoragePersister } from '@tanstack/query-sync-storage-persister' + const { children } = $props() + const queryClient = new QueryClient({ defaultOptions: { queries: { @@ -21,7 +23,7 @@
- + {@render children()}
diff --git a/examples/svelte/basic/src/routes/[postId]/+page.svelte b/examples/svelte/basic/src/routes/[postId]/+page.svelte index b68acc0bc0..2400baac2a 100644 --- a/examples/svelte/basic/src/routes/[postId]/+page.svelte +++ b/examples/svelte/basic/src/routes/[postId]/+page.svelte @@ -1,8 +1,7 @@ diff --git a/examples/svelte/basic/svelte.config.js b/examples/svelte/basic/svelte.config.js index 2dee2d78a1..d6b43b0085 100644 --- a/examples/svelte/basic/svelte.config.js +++ b/examples/svelte/basic/svelte.config.js @@ -3,13 +3,13 @@ import { vitePreprocess } from '@sveltejs/vite-plugin-svelte' /** @type {import('@sveltejs/kit').Config} */ const config = { - // Consult https://github.com/sveltejs/svelte-preprocess - // for more information about preprocessors preprocess: vitePreprocess(), - kit: { adapter: adapter(), }, + compilerOptions: { + runes: true, + }, } export default config diff --git a/examples/svelte/load-more-infinite-scroll/package.json b/examples/svelte/load-more-infinite-scroll/package.json index 1a2da0f3f7..a46998ab2c 100644 --- a/examples/svelte/load-more-infinite-scroll/package.json +++ b/examples/svelte/load-more-infinite-scroll/package.json @@ -15,8 +15,8 @@ "devDependencies": { "@sveltejs/adapter-auto": "^3.2.3", "@sveltejs/kit": "^2.8.2", - "@sveltejs/vite-plugin-svelte": "^3.1.2", - "svelte": "^4.2.18", + "@sveltejs/vite-plugin-svelte": "^4.0.0", + "svelte": "^5.0.0", "svelte-check": "^4.0.0", "typescript": "5.7.2", "vite": "^5.3.5" diff --git a/examples/svelte/load-more-infinite-scroll/src/app.css b/examples/svelte/load-more-infinite-scroll/src/app.css index c57658b1ef..d301f1b2a3 100644 --- a/examples/svelte/load-more-infinite-scroll/src/app.css +++ b/examples/svelte/load-more-infinite-scroll/src/app.css @@ -48,7 +48,7 @@ main { text-align: center; } -button { +.button { border-radius: 8px; border: 1px solid transparent; padding: 0.6em 1.2em; @@ -59,11 +59,11 @@ button { cursor: pointer; transition: border-color 0.25s; } -button:hover { +.button:hover { border-color: #646cff; } -button:focus, -button:focus-visible { +.button:focus, +.button:focus-visible { outline: 4px auto -webkit-focus-ring-color; } @@ -75,7 +75,7 @@ button:focus-visible { a:hover { color: #747bff; } - button { + .button { background-color: #f9f9f9; } } diff --git a/examples/svelte/load-more-infinite-scroll/src/lib/LoadMore.svelte b/examples/svelte/load-more-infinite-scroll/src/lib/LoadMore.svelte index 79c602e672..32f6e8971d 100644 --- a/examples/svelte/load-more-infinite-scroll/src/lib/LoadMore.svelte +++ b/examples/svelte/load-more-infinite-scroll/src/lib/LoadMore.svelte @@ -6,7 +6,7 @@ const fetchPlanets = async ({ pageParam = 1 }) => await fetch(`${endPoint}/planets/?page=${pageParam}`).then((r) => r.json()) - const query = createInfiniteQuery({ + const query = createInfiniteQuery(() => ({ queryKey: ['planets'], queryFn: ({ pageParam }) => fetchPlanets({ pageParam }), initialPageParam: 1, @@ -20,18 +20,18 @@ } return undefined }, - }) + })) -{#if $query.isPending} +{#if query.isPending} Loading... {/if} -{#if $query.error} - Error: {$query.error.message} +{#if query.error} + Error: {query.error.message} {/if} -{#if $query.isSuccess} +{#if query.isSuccess}
- {#each $query.data.pages as { results }} + {#each query.data.pages as { results }} {#each results as planet}
@@ -44,12 +44,12 @@
diff --git a/examples/svelte/load-more-infinite-scroll/src/routes/+layout.svelte b/examples/svelte/load-more-infinite-scroll/src/routes/+layout.svelte index ef60a2f559..4b170dc01e 100644 --- a/examples/svelte/load-more-infinite-scroll/src/routes/+layout.svelte +++ b/examples/svelte/load-more-infinite-scroll/src/routes/+layout.svelte @@ -4,6 +4,8 @@ import { QueryClientProvider, QueryClient } from '@tanstack/svelte-query' import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools' + const { children } = $props() + const queryClient = new QueryClient({ defaultOptions: { queries: { @@ -15,7 +17,7 @@
- + {@render children()}
diff --git a/examples/svelte/load-more-infinite-scroll/svelte.config.js b/examples/svelte/load-more-infinite-scroll/svelte.config.js index 0aa6cba937..d6b43b0085 100644 --- a/examples/svelte/load-more-infinite-scroll/svelte.config.js +++ b/examples/svelte/load-more-infinite-scroll/svelte.config.js @@ -3,13 +3,13 @@ import { vitePreprocess } from '@sveltejs/vite-plugin-svelte' /** @type {import('@sveltejs/kit').Config} */ const config = { - // Consult https://kit.svelte.dev/docs/integrations#preprocessors - // for more information about preprocessors preprocess: vitePreprocess(), - kit: { adapter: adapter(), }, + compilerOptions: { + runes: true, + }, } export default config diff --git a/examples/svelte/optimistic-updates/package.json b/examples/svelte/optimistic-updates/package.json index 1eee602d00..84039b7527 100644 --- a/examples/svelte/optimistic-updates/package.json +++ b/examples/svelte/optimistic-updates/package.json @@ -15,8 +15,8 @@ "devDependencies": { "@sveltejs/adapter-auto": "^3.2.3", "@sveltejs/kit": "^2.8.2", - "@sveltejs/vite-plugin-svelte": "^3.1.2", - "svelte": "^4.2.18", + "@sveltejs/vite-plugin-svelte": "^4.0.0", + "svelte": "^5.0.0", "svelte-check": "^4.0.0", "typescript": "5.7.2", "vite": "^5.3.5" diff --git a/examples/svelte/optimistic-updates/src/routes/+layout.svelte b/examples/svelte/optimistic-updates/src/routes/+layout.svelte index ef60a2f559..4b170dc01e 100644 --- a/examples/svelte/optimistic-updates/src/routes/+layout.svelte +++ b/examples/svelte/optimistic-updates/src/routes/+layout.svelte @@ -4,6 +4,8 @@ import { QueryClientProvider, QueryClient } from '@tanstack/svelte-query' import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools' + const { children } = $props() + const queryClient = new QueryClient({ defaultOptions: { queries: { @@ -15,7 +17,7 @@
- + {@render children()}
diff --git a/examples/svelte/optimistic-updates/src/routes/+page.svelte b/examples/svelte/optimistic-updates/src/routes/+page.svelte index af8738ffcc..feb5d1085c 100644 --- a/examples/svelte/optimistic-updates/src/routes/+page.svelte +++ b/examples/svelte/optimistic-updates/src/routes/+page.svelte @@ -16,7 +16,7 @@ ts: number } - let text = '' + let text = $state('') const client = useQueryClient() @@ -36,12 +36,12 @@ }), }).then((res) => res.json()) - const todos = createQuery({ + const todos = createQuery(() => ({ queryKey: ['optimistic'], queryFn: fetchTodos, - }) + })) - const addTodoMutation = createMutation({ + const addTodoMutation = createMutation(() => ({ mutationFn: createTodo, onMutate: async (newTodo: string) => { text = '' @@ -74,7 +74,7 @@ onSettled: () => { client.invalidateQueries({ queryKey: ['optimistic'] }) }, - }) + }))

Optimistic Updates

@@ -87,36 +87,36 @@

{ + onsubmit={(e) => { e.preventDefault() e.stopPropagation() - $addTodoMutation.mutate(text) + addTodoMutation.mutate(text) }} >
- +
-{#if $todos.isPending} +{#if todos.isPending} Loading... {/if} -{#if $todos.error} +{#if todos.error} An error has occurred: - {$todos.error.message} + {todos.error.message} {/if} -{#if $todos.isSuccess} +{#if todos.isSuccess}
- Updated At: {new Date($todos.data.ts).toLocaleTimeString()} + Updated At: {new Date(todos.data.ts).toLocaleTimeString()}
    - {#each $todos.data.items as todo} + {#each todos.data.items as todo}
  • {todo.text}
  • {/each}
{/if} -{#if $todos.isFetching} +{#if todos.isFetching}
'Background Updating...' : ' '
diff --git a/examples/svelte/optimistic-updates/svelte.config.js b/examples/svelte/optimistic-updates/svelte.config.js index 2dee2d78a1..d6b43b0085 100644 --- a/examples/svelte/optimistic-updates/svelte.config.js +++ b/examples/svelte/optimistic-updates/svelte.config.js @@ -3,13 +3,13 @@ import { vitePreprocess } from '@sveltejs/vite-plugin-svelte' /** @type {import('@sveltejs/kit').Config} */ const config = { - // Consult https://github.com/sveltejs/svelte-preprocess - // for more information about preprocessors preprocess: vitePreprocess(), - kit: { adapter: adapter(), }, + compilerOptions: { + runes: true, + }, } export default config diff --git a/examples/svelte/playground/package.json b/examples/svelte/playground/package.json index 8a3f57bfea..dbda4d2a68 100644 --- a/examples/svelte/playground/package.json +++ b/examples/svelte/playground/package.json @@ -15,8 +15,8 @@ "devDependencies": { "@sveltejs/adapter-auto": "^3.2.3", "@sveltejs/kit": "^2.8.2", - "@sveltejs/vite-plugin-svelte": "^3.1.2", - "svelte": "^4.2.18", + "@sveltejs/vite-plugin-svelte": "^4.0.0", + "svelte": "^5.0.0", "svelte-check": "^4.0.0", "typescript": "5.7.2", "vite": "^5.3.5" diff --git a/examples/svelte/playground/src/lib/stores.svelte.ts b/examples/svelte/playground/src/lib/stores.svelte.ts new file mode 100644 index 0000000000..18f0232ebb --- /dev/null +++ b/examples/svelte/playground/src/lib/stores.svelte.ts @@ -0,0 +1,37 @@ +export function ref(initial: T) { + let value = $state(initial) + + return { + get value() { + return value + }, + set value(newValue) { + value = newValue + }, + } +} + +export const staleTime = ref(1000) +export const gcTime = ref(3000) +export const errorRate = ref(0.05) +export const queryTimeMin = ref(1000) +export const queryTimeMax = ref(2000) + +export const editingIndex = ref(null) +export const views = ref(['', 'fruit', 'grape']) + +let initialId = 0 +const initialList = [ + 'apple', + 'banana', + 'pineapple', + 'grapefruit', + 'dragonfruit', + 'grapes', +].map((d) => ({ id: initialId++, name: d, notes: 'These are some notes' })) + +export const list = ref(initialList) +export const id = ref(initialId) + +export type Todos = typeof initialList +export type Todo = Todos[0] diff --git a/examples/svelte/playground/src/lib/stores.ts b/examples/svelte/playground/src/lib/stores.ts deleted file mode 100644 index 2dcdd669a6..0000000000 --- a/examples/svelte/playground/src/lib/stores.ts +++ /dev/null @@ -1,26 +0,0 @@ -import { writable } from 'svelte/store' - -export const staleTime = writable(1000) -export const gcTime = writable(3000) -export const errorRate = writable(0.05) -export const queryTimeMin = writable(1000) -export const queryTimeMax = writable(2000) - -export const editingIndex = writable(null) -export const views = writable(['', 'fruit', 'grape']) - -let initialId = 0 -const initialList = [ - 'apple', - 'banana', - 'pineapple', - 'grapefruit', - 'dragonfruit', - 'grapes', -].map((d) => ({ id: initialId++, name: d, notes: 'These are some notes' })) - -export const list = writable(initialList) -export const id = writable(initialId) - -export type Todos = typeof initialList -export type Todo = Todos[0] diff --git a/examples/svelte/playground/src/routes/+layout.svelte b/examples/svelte/playground/src/routes/+layout.svelte index 1b9267032c..76c2d0d277 100644 --- a/examples/svelte/playground/src/routes/+layout.svelte +++ b/examples/svelte/playground/src/routes/+layout.svelte @@ -4,6 +4,8 @@ import { QueryClientProvider, QueryClient } from '@tanstack/svelte-query' import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools' + const { children } = $props() + const queryClient = new QueryClient({ defaultOptions: { queries: { @@ -19,7 +21,7 @@
- + {@render children()}
diff --git a/examples/svelte/playground/src/routes/+page.svelte b/examples/svelte/playground/src/routes/+page.svelte index 4830d01eb3..cec4a24208 100644 --- a/examples/svelte/playground/src/routes/+page.svelte +++ b/examples/svelte/playground/src/routes/+page.svelte @@ -6,15 +6,15 @@ errorRate, queryTimeMin, queryTimeMax, - } from '../lib/stores' + } from '../lib/stores.svelte' import App from './App.svelte' const queryClient = useQueryClient() queryClient.setDefaultOptions({ queries: { - staleTime: $staleTime, - gcTime: $gcTime, + staleTime: staleTime.value, + gcTime: gcTime.value, }, }) @@ -29,7 +29,7 @@ type="number" min="0" step="1000" - bind:value={$staleTime} + bind:value={staleTime.value} style="width: 100px" />
@@ -39,7 +39,7 @@ type="number" min="0" step="1000" - bind:value={$gcTime} + bind:value={gcTime.value} style="width: 100px" />
@@ -51,7 +51,7 @@ min="0" max="1" step=".05" - bind:value={$errorRate} + bind:value={errorRate.value} style="width: 100px" />
@@ -61,7 +61,7 @@ type="number" min="1" step="500" - bind:value={$queryTimeMin} + bind:value={queryTimeMin.value} style="width: 100px" />{' '}
@@ -71,7 +71,7 @@ type="number" min="1" step="500" - bind:value={$queryTimeMax} + bind:value={queryTimeMax.value} style="width: 100px" />
diff --git a/examples/svelte/playground/src/routes/AddTodo.svelte b/examples/svelte/playground/src/routes/AddTodo.svelte index 5fe8fc4dcd..514e4b8ee7 100644 --- a/examples/svelte/playground/src/routes/AddTodo.svelte +++ b/examples/svelte/playground/src/routes/AddTodo.svelte @@ -1,55 +1,68 @@
- +
- {$addMutation.status === 'pending' + {addMutation.status === 'pending' ? 'Saving...' - : $addMutation.status === 'error' - ? $addMutation.error.message + : addMutation.status === 'error' + ? addMutation.error.message : 'Saved!'}
diff --git a/examples/svelte/playground/src/routes/App.svelte b/examples/svelte/playground/src/routes/App.svelte index 5a72f454c0..04ddbb9b40 100644 --- a/examples/svelte/playground/src/routes/App.svelte +++ b/examples/svelte/playground/src/routes/App.svelte @@ -3,21 +3,21 @@ import TodosList from './TodosList.svelte' import EditTodo from './EditTodo.svelte' import AddTodo from './AddTodo.svelte' - import { views, editingIndex } from '../lib/stores' + import { views, editingIndex } from '../lib/stores.svelte' const queryClient = useQueryClient()
-


- {#each $views as view} + {#each views.value as view}

@@ -25,15 +25,15 @@ {/each}
- {#if $editingIndex !== null} + {#if editingIndex.value !== null}
{/if} diff --git a/examples/svelte/playground/src/routes/EditTodo.svelte b/examples/svelte/playground/src/routes/EditTodo.svelte index 40b2208e60..d38c232221 100644 --- a/examples/svelte/playground/src/routes/EditTodo.svelte +++ b/examples/svelte/playground/src/routes/EditTodo.svelte @@ -10,23 +10,21 @@ queryTimeMax, list, editingIndex, - } from '$lib/stores' - import { derived } from 'svelte/store' - import type { Todo } from '$lib/stores' + } from '$lib/stores.svelte' + import type { Todo } from '$lib/stores.svelte' const queryClient = useQueryClient() const fetchTodoById = async ({ id }: { id: number }): Promise => { - console.info('fetchTodoById', { id }) return new Promise((resolve, reject) => { setTimeout( () => { - if (Math.random() < $errorRate) { + if (Math.random() < errorRate.value) { return reject( new Error(JSON.stringify({ fetchTodoById: { id } }, null, 2)), ) } - const todo = $list.find((d) => d.id === id) + const todo = $state.snapshot(list.value.find((d) => d.id === id)) if (!todo) { return reject( new Error(JSON.stringify({ fetchTodoById: { id } }, null, 2)), @@ -34,7 +32,8 @@ } resolve(todo) }, - $queryTimeMin + Math.random() * ($queryTimeMax - $queryTimeMin), + queryTimeMin.value + + Math.random() * (queryTimeMax.value - queryTimeMin.value), ) }) } @@ -44,7 +43,7 @@ return new Promise((resolve, reject) => { setTimeout( () => { - if (Math.random() < $errorRate) { + if (Math.random() < errorRate.value) { return reject( new Error(JSON.stringify({ patchTodo: todo }, null, 2)), ) @@ -54,60 +53,58 @@ new Error(JSON.stringify({ patchTodo: todo }, null, 2)), ) } - list.set( - $list.map((d) => { - if (d.id === todo.id) { - return todo - } - return d - }), - ) + list.value = list.value.map((d) => { + if (d.id === todo.id) { + return $state.snapshot(todo) + } + return d + }) resolve(todo) }, - $queryTimeMin + Math.random() * ($queryTimeMax - $queryTimeMin), + queryTimeMin.value + + Math.random() * (queryTimeMax.value - queryTimeMin.value), ) }) } - const query = createQuery( - derived(editingIndex, ($editingIndex) => ({ - queryKey: ['todo', { id: $editingIndex }], - queryFn: () => fetchTodoById({ id: $editingIndex || 0 }), - enabled: $editingIndex !== null, - })), - ) + const query = createQuery(() => ({ + queryKey: ['todo', { id: editingIndex.value }], + queryFn: () => fetchTodoById({ id: editingIndex.value || 0 }), + enabled: editingIndex.value !== null, + })) - const saveMutation = createMutation({ + const saveMutation = createMutation(() => ({ mutationFn: patchTodo, onSuccess: (data) => { // Update `todos` and the individual todo queries when this mutation succeeds queryClient.invalidateQueries({ queryKey: ['todos'] }) queryClient.setQueryData(['todo', { id: editingIndex }], data) }, - }) + })) - $: todo = $query.data + const todo = $derived(query.data) const onSave = () => { - $saveMutation.mutate(todo) + saveMutation.mutate(todo) } - $: disableEditSave = - $query.status === 'pending' || $saveMutation.status === 'pending' + const disableEditSave = $derived( + query.status === 'pending' || saveMutation.status === 'pending', + )
- {#if $query.data} - Editing Todo - "{$query.data.name}" (#{$editingIndex}) + {#if query.data} + Editing + Todo "{query.data.name}" (#{editingIndex.value}) {/if}
- {#if $query.status === 'pending'} - Loading... (Attempt: {$query.failureCount + 1}) - {:else if $query.error} + {#if query.status === 'pending'} + Loading... (Attempt: {query.failureCount + 1}) + {:else if query.error} - Error! + Error! {:else if todo}
- +
- {$saveMutation.status === 'pending' + {saveMutation.status === 'pending' ? 'Saving...' - : $saveMutation.status === 'error' - ? $saveMutation.error.message + : saveMutation.status === 'error' + ? saveMutation.error.message : 'Saved!'}
- {#if $query.isFetching} + {#if query.isFetching} - Background Refreshing... (Attempt: {$query.failureCount + 1}) + Background Refreshing... (Attempt: {query.failureCount + 1}) {:else}   diff --git a/examples/svelte/playground/src/routes/TodosList.svelte b/examples/svelte/playground/src/routes/TodosList.svelte index 586af38e35..a7d6f392cc 100644 --- a/examples/svelte/playground/src/routes/TodosList.svelte +++ b/examples/svelte/playground/src/routes/TodosList.svelte @@ -6,68 +6,66 @@ queryTimeMax, list, editingIndex, - } from '$lib/stores' - import { derived, writable } from 'svelte/store' - import type { Todos } from '$lib/stores' + } from '$lib/stores.svelte' + import type { Todos } from '$lib/stores.svelte' - export let initialFilter: string + let { initialFilter }: { initialFilter: string } = $props() - let filter = writable(initialFilter) + let filter = $state(initialFilter) const fetchTodos = async ({ filter }: { filter: string }): Promise => { return new Promise((resolve, reject) => { setTimeout( () => { - if (Math.random() < $errorRate) { + if (Math.random() < errorRate.value) { return reject( new Error(JSON.stringify({ fetchTodos: { filter } }, null, 2)), ) } - resolve($list.filter((d) => d.name.includes(filter))) + resolve(list.value.filter((d) => d.name.includes(filter))) }, - $queryTimeMin + Math.random() * ($queryTimeMax - $queryTimeMin), + queryTimeMin.value + + Math.random() * (queryTimeMax.value - queryTimeMin.value), ) }) } - const query = createQuery( - derived(filter, ($filter) => ({ - queryKey: ['todos', { filter: $filter }], - queryFn: () => fetchTodos({ filter: $filter }), - })), - ) + const query = createQuery(() => ({ + queryKey: ['todos', { filter: filter }], + queryFn: () => fetchTodos({ filter: filter }), + }))
-{#if $query.status === 'pending'} - Loading... (Attempt: {$query.failureCount + 1}) -{:else if $query.status === 'error'} +{#if query.status === 'pending'} + Loading... (Attempt: {query.failureCount + 1}) +{:else if query.status === 'error'} - Error: {$query.error.message} + Error: {query.error.message}
- +
{:else}
    - {#if $query.data} - {#each $query.data as todo} + {#if query.data} + {#each query.data as todo}
  • {todo.name}{' '} - +
  • {/each} {/if}
- {#if $query.isFetching} + {#if query.isFetching} - Background Refreshing... (Attempt: {$query.failureCount + 1}) + Background Refreshing... (Attempt: {query.failureCount + 1}) {:else}   diff --git a/examples/svelte/playground/svelte.config.js b/examples/svelte/playground/svelte.config.js index a52aed3a7b..d6b43b0085 100644 --- a/examples/svelte/playground/svelte.config.js +++ b/examples/svelte/playground/svelte.config.js @@ -4,10 +4,12 @@ import { vitePreprocess } from '@sveltejs/vite-plugin-svelte' /** @type {import('@sveltejs/kit').Config} */ const config = { preprocess: vitePreprocess(), - kit: { adapter: adapter(), }, + compilerOptions: { + runes: true, + }, } export default config diff --git a/examples/svelte/simple/package.json b/examples/svelte/simple/package.json index 7a7572df1d..ad802ff34a 100644 --- a/examples/svelte/simple/package.json +++ b/examples/svelte/simple/package.json @@ -13,9 +13,9 @@ "@tanstack/svelte-query-devtools": "^5.62.7" }, "devDependencies": { - "@sveltejs/vite-plugin-svelte": "^3.1.2", + "@sveltejs/vite-plugin-svelte": "^4.0.0", "@tsconfig/svelte": "^5.0.4", - "svelte": "^4.2.18", + "svelte": "^5.0.0", "svelte-check": "^4.0.0", "typescript": "5.7.2", "vite": "^5.3.5" diff --git a/examples/svelte/simple/src/lib/Simple.svelte b/examples/svelte/simple/src/lib/Simple.svelte index 6b044dc321..a467e91393 100644 --- a/examples/svelte/simple/src/lib/Simple.svelte +++ b/examples/svelte/simple/src/lib/Simple.svelte @@ -9,32 +9,32 @@ forks_count: number } - const query = createQuery({ + const query = createQuery(() => ({ queryKey: ['repoData'], queryFn: async () => await fetch('https://api.github.com/repos/TanStack/query').then((r) => r.json(), ), - }) + }))

Simple

- {#if $query.isPending} + {#if query.isPending} Loading... {/if} - {#if $query.error} + {#if query.error} An error has occurred: - {$query.error.message} + {query.error.message} {/if} - {#if $query.isSuccess} + {#if query.isSuccess}
-

{$query.data.full_name}

-

{$query.data.description}

- 👀 {$query.data.subscribers_count}{' '} - ✨ {$query.data.stargazers_count}{' '} - 🍴 {$query.data.forks_count} +

{query.data.full_name}

+

{query.data.description}

+ 👀 {query.data.subscribers_count}{' '} + ✨ {query.data.stargazers_count}{' '} + 🍴 {query.data.forks_count}
{/if}
diff --git a/examples/svelte/simple/src/main.ts b/examples/svelte/simple/src/main.ts index 7ad46094a0..eeb0a0bcec 100644 --- a/examples/svelte/simple/src/main.ts +++ b/examples/svelte/simple/src/main.ts @@ -1,7 +1,8 @@ +import { mount } from 'svelte' import './app.css' import App from './App.svelte' -const app = new App({ +const app = mount(App, { target: document.querySelector('#app')!, }) diff --git a/examples/svelte/simple/svelte.config.js b/examples/svelte/simple/svelte.config.js index ec6a224d76..64c513012f 100644 --- a/examples/svelte/simple/svelte.config.js +++ b/examples/svelte/simple/svelte.config.js @@ -1,7 +1,8 @@ import { vitePreprocess } from '@sveltejs/vite-plugin-svelte' export default { - // Consult https://github.com/sveltejs/svelte-preprocess - // for more information about preprocessors preprocess: vitePreprocess(), + compilerOptions: { + runes: true, + }, } diff --git a/examples/svelte/ssr/package.json b/examples/svelte/ssr/package.json index d3581f20d0..93f6b6d665 100644 --- a/examples/svelte/ssr/package.json +++ b/examples/svelte/ssr/package.json @@ -15,8 +15,8 @@ "devDependencies": { "@sveltejs/adapter-auto": "^3.2.3", "@sveltejs/kit": "^2.8.2", - "@sveltejs/vite-plugin-svelte": "^3.1.2", - "svelte": "^4.2.18", + "@sveltejs/vite-plugin-svelte": "^4.0.0", + "svelte": "^5.0.0", "svelte-check": "^4.0.0", "typescript": "5.7.2", "vite": "^5.3.5" diff --git a/examples/svelte/ssr/src/lib/Post.svelte b/examples/svelte/ssr/src/lib/Post.svelte index 0de658b6dd..10b4df1949 100644 --- a/examples/svelte/ssr/src/lib/Post.svelte +++ b/examples/svelte/ssr/src/lib/Post.svelte @@ -3,29 +3,29 @@ import { api } from './api' import type { Post } from './types' - export let postId: number + const { postId }: { postId: number } = $props() - const post = createQuery({ + const post = createQuery(() => ({ queryKey: ['post', postId], queryFn: () => api().getPostById(postId), - }) + }))
diff --git a/examples/svelte/ssr/src/lib/Posts.svelte b/examples/svelte/ssr/src/lib/Posts.svelte index 7457dfd49b..7f7065e813 100644 --- a/examples/svelte/ssr/src/lib/Posts.svelte +++ b/examples/svelte/ssr/src/lib/Posts.svelte @@ -4,26 +4,26 @@ const client = useQueryClient() - let limit = 10 + const limit = 10 const posts = createQuery< { id: number; title: string; body: string }[], Error - >({ + >(() => ({ queryKey: ['posts', limit], queryFn: () => api().getPosts(limit), - }) + }))
- {#if $posts.status === 'pending'} + {#if posts.status === 'pending'} Loading... - {:else if $posts.status === 'error'} - Error: {$posts.error.message} + {:else if posts.status === 'error'} + Error: {posts.error.message} {:else} - {#if $posts.isFetching} + {#if posts.isFetching}
Background Updating...
diff --git a/examples/svelte/ssr/src/routes/+layout.svelte b/examples/svelte/ssr/src/routes/+layout.svelte index d639174e3f..0b02447853 100644 --- a/examples/svelte/ssr/src/routes/+layout.svelte +++ b/examples/svelte/ssr/src/routes/+layout.svelte @@ -2,14 +2,13 @@ import '../app.css' import { QueryClientProvider } from '@tanstack/svelte-query' import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools' - import type { PageData } from './$types' - export let data: PageData + const { data, children } = $props()
- + {@render children()}
diff --git a/examples/svelte/ssr/src/routes/+layout.ts b/examples/svelte/ssr/src/routes/+layout.ts index 0d38c02919..5104825207 100644 --- a/examples/svelte/ssr/src/routes/+layout.ts +++ b/examples/svelte/ssr/src/routes/+layout.ts @@ -2,7 +2,7 @@ import { browser } from '$app/environment' import { QueryClient } from '@tanstack/svelte-query' import type { LayoutLoad } from './$types' -export const load: LayoutLoad = async () => { +export const load: LayoutLoad = () => { const queryClient = new QueryClient({ defaultOptions: { queries: { diff --git a/examples/svelte/ssr/src/routes/[postId]/+page.svelte b/examples/svelte/ssr/src/routes/[postId]/+page.svelte index b68acc0bc0..2400baac2a 100644 --- a/examples/svelte/ssr/src/routes/[postId]/+page.svelte +++ b/examples/svelte/ssr/src/routes/[postId]/+page.svelte @@ -1,8 +1,7 @@ diff --git a/examples/svelte/ssr/svelte.config.js b/examples/svelte/ssr/svelte.config.js index 2dee2d78a1..d6b43b0085 100644 --- a/examples/svelte/ssr/svelte.config.js +++ b/examples/svelte/ssr/svelte.config.js @@ -3,13 +3,13 @@ import { vitePreprocess } from '@sveltejs/vite-plugin-svelte' /** @type {import('@sveltejs/kit').Config} */ const config = { - // Consult https://github.com/sveltejs/svelte-preprocess - // for more information about preprocessors preprocess: vitePreprocess(), - kit: { adapter: adapter(), }, + compilerOptions: { + runes: true, + }, } export default config diff --git a/examples/svelte/star-wars/package.json b/examples/svelte/star-wars/package.json index c99599f60e..1d9b5d7b58 100644 --- a/examples/svelte/star-wars/package.json +++ b/examples/svelte/star-wars/package.json @@ -15,10 +15,10 @@ "devDependencies": { "@sveltejs/adapter-auto": "^3.2.3", "@sveltejs/kit": "^2.8.2", - "@sveltejs/vite-plugin-svelte": "^3.1.2", + "@sveltejs/vite-plugin-svelte": "^4.0.0", "autoprefixer": "^10.4.20", "postcss": "^8.4.49", - "svelte": "^4.2.18", + "svelte": "^5.0.0", "svelte-check": "^4.0.0", "tailwindcss": "^3.4.7", "typescript": "5.7.2", diff --git a/examples/svelte/star-wars/src/routes/+layout.svelte b/examples/svelte/star-wars/src/routes/+layout.svelte index d11124d6fe..5f2bf488e9 100644 --- a/examples/svelte/star-wars/src/routes/+layout.svelte +++ b/examples/svelte/star-wars/src/routes/+layout.svelte @@ -4,6 +4,8 @@ import { QueryClientProvider, QueryClient } from '@tanstack/svelte-query' import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools' + const { children } = $props() + const queryClient = new QueryClient({ defaultOptions: { queries: { @@ -25,6 +27,6 @@
Films Characters - + {@render children()} diff --git a/examples/svelte/star-wars/src/routes/characters/+page.svelte b/examples/svelte/star-wars/src/routes/characters/+page.svelte index 0fef65bd7a..7c59efd108 100644 --- a/examples/svelte/star-wars/src/routes/characters/+page.svelte +++ b/examples/svelte/star-wars/src/routes/characters/+page.svelte @@ -6,24 +6,24 @@ return await res.json() } - const query = createQuery({ + const query = createQuery(() => ({ queryKey: ['characters'], queryFn: getCharacters, - }) + })) -{#if $query.status === 'pending'} +{#if query.status === 'pending'}

Loading...

{/if} -{#if $query.status === 'error'} +{#if query.status === 'error'}

Error :(

{/if} -{#if $query.status === 'success'} +{#if query.status === 'success'}

Characters

- {#each $query.data.results as person} + {#each query.data.results as person} {@const personUrlParts = person.url.split('/').filter(Boolean)} {@const personId = personUrlParts[personUrlParts.length - 1]}
diff --git a/examples/svelte/star-wars/src/routes/characters/[characterId]/+page.svelte b/examples/svelte/star-wars/src/routes/characters/[characterId]/+page.svelte index 6743ccbcb5..3298c72c5a 100644 --- a/examples/svelte/star-wars/src/routes/characters/[characterId]/+page.svelte +++ b/examples/svelte/star-wars/src/routes/characters/[characterId]/+page.svelte @@ -2,9 +2,8 @@ import { createQuery } from '@tanstack/svelte-query' import Homeworld from './Homeworld.svelte' import Film from './Film.svelte' - import type { PageData } from './$types' - export let data: PageData + let { data } = $props() const getCharacter = async () => { const res = await fetch( @@ -13,25 +12,25 @@ return await res.json() } - const query = createQuery({ + const query = createQuery(() => ({ queryKey: ['character', data.params.characterId], queryFn: getCharacter, - }) + })) -{#if $query.status === 'pending'} +{#if query.status === 'pending'}

Loading...

{/if} -{#if $query.status === 'error'} +{#if query.status === 'error'}

Error :(

{/if} -{#if $query.status === 'success'} - {@const homeworldUrlParts = $query.data.homeworld.split('/').filter(Boolean)} +{#if query.status === 'success'} + {@const homeworldUrlParts = query.data.homeworld.split('/').filter(Boolean)} {@const homeworldId = homeworldUrlParts[homeworldUrlParts.length - 1]}
-

{$query.data.name}

+

{query.data.name}

@@ -42,23 +41,23 @@ - + - + - + - + - + @@ -68,7 +67,7 @@
Born{$query.data.birth_year}{query.data.birth_year}
Eyes{$query.data.eye_color}{query.data.eye_color}
Hair{$query.data.hair_color}{query.data.hair_color}
Height{$query.data.height}{query.data.height}
Mass{$query.data.mass}{query.data.mass}
Homeworld

Films

- {#each $query.data.films as film} + {#each query.data.films as film} {@const filmUrlParts = film.split('/').filter(Boolean)} {@const filmId = filmUrlParts[filmUrlParts.length - 1]} diff --git a/examples/svelte/star-wars/src/routes/characters/[characterId]/Film.svelte b/examples/svelte/star-wars/src/routes/characters/[characterId]/Film.svelte index 7c0210d8d5..f9c7aba727 100644 --- a/examples/svelte/star-wars/src/routes/characters/[characterId]/Film.svelte +++ b/examples/svelte/star-wars/src/routes/characters/[characterId]/Film.svelte @@ -1,23 +1,23 @@ -{#if $query.status === 'success'} +{#if query.status === 'success'} {/if} diff --git a/examples/svelte/star-wars/src/routes/characters/[characterId]/Homeworld.svelte b/examples/svelte/star-wars/src/routes/characters/[characterId]/Homeworld.svelte index d931b8cc19..bde4c4cada 100644 --- a/examples/svelte/star-wars/src/routes/characters/[characterId]/Homeworld.svelte +++ b/examples/svelte/star-wars/src/routes/characters/[characterId]/Homeworld.svelte @@ -1,21 +1,21 @@ -{#if $query.status === 'success'} +{#if query.status === 'success'} - {$query.data.name} + {query.data.name} {/if} diff --git a/examples/svelte/star-wars/src/routes/films/+page.svelte b/examples/svelte/star-wars/src/routes/films/+page.svelte index adb251e0d2..4fc29c6f50 100644 --- a/examples/svelte/star-wars/src/routes/films/+page.svelte +++ b/examples/svelte/star-wars/src/routes/films/+page.svelte @@ -6,24 +6,24 @@ return await res.json() } - const query = createQuery({ + const query = createQuery(() => ({ queryKey: ['films'], queryFn: getFilms, - }) + })) -{#if $query.status === 'pending'} +{#if query.status === 'pending'}

Loading...

{/if} -{#if $query.status === 'error'} +{#if query.status === 'error'}

Error :(

{/if} -{#if $query.status === 'success'} +{#if query.status === 'success'}

Films

- {#each $query.data.results as film} + {#each query.data.results as film} {@const filmUrlParts = film.url.split('/').filter(Boolean)} {@const filmId = filmUrlParts[filmUrlParts.length - 1]}
diff --git a/examples/svelte/star-wars/src/routes/films/[filmId]/+page.svelte b/examples/svelte/star-wars/src/routes/films/[filmId]/+page.svelte index 5342487a6e..84f1abffe9 100644 --- a/examples/svelte/star-wars/src/routes/films/[filmId]/+page.svelte +++ b/examples/svelte/star-wars/src/routes/films/[filmId]/+page.svelte @@ -1,9 +1,8 @@ -{#if $query.status === 'pending'} +{#if query.status === 'pending'}

Loading...

{/if} -{#if $query.status === 'error'} +{#if query.status === 'error'}

Error :(

{/if} -{#if $query.status === 'success'} +{#if query.status === 'success'}
-

{$query.data.title}

-

{$query.data.opening_crawl}

+

{query.data.title}

+

{query.data.opening_crawl}


Characters

- {#each $query.data.characters as character} + {#each query.data.characters as character} {@const characterUrlParts = character.split('/').filter(Boolean)} {@const characterId = characterUrlParts[characterUrlParts.length - 1]} diff --git a/examples/svelte/star-wars/src/routes/films/[filmId]/Character.svelte b/examples/svelte/star-wars/src/routes/films/[filmId]/Character.svelte index b4827ccdf9..2b1a0ba4c9 100644 --- a/examples/svelte/star-wars/src/routes/films/[filmId]/Character.svelte +++ b/examples/svelte/star-wars/src/routes/films/[filmId]/Character.svelte @@ -1,23 +1,23 @@ -{#if $query.status === 'success'} +{#if query.status === 'success'} {/if} diff --git a/examples/svelte/star-wars/svelte.config.js b/examples/svelte/star-wars/svelte.config.js index a52aed3a7b..d6b43b0085 100644 --- a/examples/svelte/star-wars/svelte.config.js +++ b/examples/svelte/star-wars/svelte.config.js @@ -4,10 +4,12 @@ import { vitePreprocess } from '@sveltejs/vite-plugin-svelte' /** @type {import('@sveltejs/kit').Config} */ const config = { preprocess: vitePreprocess(), - kit: { adapter: adapter(), }, + compilerOptions: { + runes: true, + }, } export default config diff --git a/integrations/svelte-vite/package.json b/integrations/svelte-vite/package.json index 6f0a2a8c94..2c4674c0d3 100644 --- a/integrations/svelte-vite/package.json +++ b/integrations/svelte-vite/package.json @@ -6,10 +6,10 @@ "build": "vite build" }, "devDependencies": { - "@sveltejs/vite-plugin-svelte": "^3.1.2", + "@sveltejs/vite-plugin-svelte": "^4.0.0", "@tanstack/svelte-query": "workspace:*", "@tanstack/svelte-query-devtools": "workspace:*", - "svelte": "^4.2.18", + "svelte": "^5.0.0", "vite": "^5.3.5" } } diff --git a/packages/svelte-query-devtools/package.json b/packages/svelte-query-devtools/package.json index 5f7e8c576d..879a3d9799 100644 --- a/packages/svelte-query-devtools/package.json +++ b/packages/svelte-query-devtools/package.json @@ -44,14 +44,14 @@ }, "devDependencies": { "@sveltejs/package": "^2.3.7", - "@sveltejs/vite-plugin-svelte": "^3.1.2", + "@sveltejs/vite-plugin-svelte": "^4.0.0", "@tanstack/svelte-query": "workspace:*", "eslint-plugin-svelte": "^2.46.0", - "svelte": "^4.2.18", + "svelte": "^5.0.0", "svelte-check": "^4.0.0" }, "peerDependencies": { "@tanstack/svelte-query": "workspace:^", - "svelte": "^3.54.0 || ^4.0.0 || ^5.0.0-next.0" + "svelte": "^5.0.0" } } diff --git a/packages/svelte-query-devtools/src/Devtools.svelte b/packages/svelte-query-devtools/src/Devtools.svelte index 3848004325..f83e633077 100644 --- a/packages/svelte-query-devtools/src/Devtools.svelte +++ b/packages/svelte-query-devtools/src/Devtools.svelte @@ -10,13 +10,50 @@ TanstackQueryDevtools, } from '@tanstack/query-devtools' - export let initialIsOpen = false - export let buttonPosition: DevtoolsButtonPosition = 'bottom-right' - export let position: DevtoolsPosition = 'bottom' - export let client: QueryClient = useQueryClient() - export let errorTypes: Array = [] - export let styleNonce: string | undefined = undefined - export let shadowDOMTarget: ShadowRoot | undefined = undefined + interface DevtoolsOptions { + /** + * Set this true if you want the dev tools to default to being open + */ + initialIsOpen?: boolean + /** + * The position of the TanStack Query logo to open and close the devtools panel. + * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' + * Defaults to 'bottom-right'. + */ + buttonPosition?: DevtoolsButtonPosition + /** + * The position of the TanStack Query devtools panel. + * 'top' | 'bottom' | 'left' | 'right' + * Defaults to 'bottom'. + */ + position?: DevtoolsPosition + /** + * Custom instance of QueryClient + */ + client?: QueryClient + /** + * Use this so you can define custom errors that can be shown in the devtools. + */ + errorTypes?: Array + /** + * Use this to pass a nonce to the style tag that is added to the document head. This is useful if you are using a Content Security Policy (CSP) nonce to allow inline styles. + */ + styleNonce?: string + /** + * Use this so you can attach the devtool's styles to specific element in the DOM. + */ + shadowDOMTarget?: ShadowRoot + } + + let { + initialIsOpen = false, + buttonPosition = 'bottom-right', + position = 'bottom', + client = useQueryClient(), + errorTypes = [], + styleNonce = undefined, + shadowDOMTarget = undefined, + }: DevtoolsOptions = $props() let ref: HTMLDivElement let devtools: TanstackQueryDevtools | undefined @@ -41,20 +78,24 @@ devtools.mount(ref) }) + return () => devtools?.unmount() + }) - return () => { - devtools?.unmount() - } + $effect(() => { + devtools?.setButtonPosition(buttonPosition) }) - } - $: { - if (devtools) { - devtools.setButtonPosition(buttonPosition) - devtools.setPosition(position) - devtools.setInitialIsOpen(initialIsOpen) - devtools.setErrorTypes(errorTypes) - } + $effect(() => { + devtools?.setPosition(position) + }) + + $effect(() => { + devtools?.setInitialIsOpen(initialIsOpen) + }) + + $effect(() => { + devtools?.setErrorTypes(errorTypes) + }) } diff --git a/packages/svelte-query-persist-client/eslint.config.js b/packages/svelte-query-persist-client/eslint.config.js index d0e37929b0..1d0ce17d52 100644 --- a/packages/svelte-query-persist-client/eslint.config.js +++ b/packages/svelte-query-persist-client/eslint.config.js @@ -10,6 +10,7 @@ export default [ rules: { 'svelte/block-lang': ['error', { script: ['ts'] }], 'svelte/no-svelte-internal': 'error', + 'svelte/no-unused-svelte-ignore': 'off', 'svelte/valid-compile': 'off', }, }, diff --git a/packages/svelte-query-persist-client/package.json b/packages/svelte-query-persist-client/package.json index edf0c63acd..a3c25960bc 100644 --- a/packages/svelte-query-persist-client/package.json +++ b/packages/svelte-query-persist-client/package.json @@ -46,15 +46,15 @@ }, "devDependencies": { "@sveltejs/package": "^2.3.7", - "@sveltejs/vite-plugin-svelte": "^3.1.2", + "@sveltejs/vite-plugin-svelte": "^4.0.0", "@tanstack/svelte-query": "workspace:*", "@testing-library/svelte": "^5.2.6", "eslint-plugin-svelte": "^2.46.0", - "svelte": "^4.2.18", + "svelte": "^5.0.0", "svelte-check": "^4.0.0" }, "peerDependencies": { "@tanstack/svelte-query": "workspace:^", - "svelte": "^3.54.0 || ^4.0.0 || ^5.0.0-next.0" + "svelte": "^5.0.0" } } diff --git a/packages/svelte-query-persist-client/src/PersistQueryClientProvider.svelte b/packages/svelte-query-persist-client/src/PersistQueryClientProvider.svelte index 5f5e04ada7..35482d9fcc 100644 --- a/packages/svelte-query-persist-client/src/PersistQueryClientProvider.svelte +++ b/packages/svelte-query-persist-client/src/PersistQueryClientProvider.svelte @@ -1,43 +1,55 @@ - - + + {@render children()} diff --git a/packages/svelte-query-persist-client/tests/AwaitOnSuccess/AwaitOnSuccess.svelte b/packages/svelte-query-persist-client/tests/AwaitOnSuccess/AwaitOnSuccess.svelte index 2a7501660e..8a02d39a7f 100644 --- a/packages/svelte-query-persist-client/tests/AwaitOnSuccess/AwaitOnSuccess.svelte +++ b/packages/svelte-query-persist-client/tests/AwaitOnSuccess/AwaitOnSuccess.svelte @@ -1,20 +1,19 @@ -
{$query.data}
-
fetchStatus: {$query.fetchStatus}
+
{query.data}
+
fetchStatus: {query.fetchStatus}
diff --git a/packages/svelte-query-persist-client/tests/AwaitOnSuccess/Provider.svelte b/packages/svelte-query-persist-client/tests/AwaitOnSuccess/Provider.svelte index c3087ac2fa..7d1201e0da 100644 --- a/packages/svelte-query-persist-client/tests/AwaitOnSuccess/Provider.svelte +++ b/packages/svelte-query-persist-client/tests/AwaitOnSuccess/Provider.svelte @@ -3,12 +3,15 @@ import AwaitOnSuccess from './AwaitOnSuccess.svelte' import type { OmitKeyof, QueryClient } from '@tanstack/svelte-query' import type { PersistQueryClientOptions } from '@tanstack/query-persist-client-core' - import type { Writable } from 'svelte/store' - export let queryClient: QueryClient - export let persistOptions: OmitKeyof - export let onSuccess: () => Promise - export let states: Writable> + interface Props { + queryClient: QueryClient + persistOptions: OmitKeyof + onSuccess: () => Promise + states: Array + } + + let { queryClient, persistOptions, onSuccess, states }: Props = $props() diff --git a/packages/svelte-query-persist-client/tests/FreshData/FreshData.svelte b/packages/svelte-query-persist-client/tests/FreshData/FreshData.svelte index fd46ffb5b6..5972e07cf2 100644 --- a/packages/svelte-query-persist-client/tests/FreshData/FreshData.svelte +++ b/packages/svelte-query-persist-client/tests/FreshData/FreshData.svelte @@ -1,25 +1,34 @@ -
data: {$query.data ?? 'undefined'}
-
fetchStatus: {$query.fetchStatus}
+
data: {query.data ?? 'undefined'}
+
fetchStatus: {query.fetchStatus}
+
fetched: {fetched}
diff --git a/packages/svelte-query-persist-client/tests/FreshData/Provider.svelte b/packages/svelte-query-persist-client/tests/FreshData/Provider.svelte index 75a9c1aefa..3859dbc30e 100644 --- a/packages/svelte-query-persist-client/tests/FreshData/Provider.svelte +++ b/packages/svelte-query-persist-client/tests/FreshData/Provider.svelte @@ -3,13 +3,16 @@ import FreshData from './FreshData.svelte' import type { OmitKeyof, QueryClient } from '@tanstack/svelte-query' import type { PersistQueryClientOptions } from '@tanstack/query-persist-client-core' - import type { Writable } from 'svelte/store' - import type { StatusResult } from '../utils.js' + import type { StatusResult } from '../utils.svelte.js' - export let queryClient: QueryClient - export let persistOptions: OmitKeyof - export let states: Writable>> - export let fetched: Writable + interface Props { + queryClient: QueryClient + persistOptions: OmitKeyof + states: { value: Array> } + fetched: boolean + } + + let { queryClient, persistOptions, states, fetched }: Props = $props() diff --git a/packages/svelte-query-persist-client/tests/InitialData/InitialData.svelte b/packages/svelte-query-persist-client/tests/InitialData/InitialData.svelte index 900c7f37cd..ff3397bd2d 100644 --- a/packages/svelte-query-persist-client/tests/InitialData/InitialData.svelte +++ b/packages/svelte-query-persist-client/tests/InitialData/InitialData.svelte @@ -1,12 +1,12 @@ -
{$query.data}
-
fetchStatus: {$query.fetchStatus}
+
{query.data}
+
fetchStatus: {query.fetchStatus}
diff --git a/packages/svelte-query-persist-client/tests/InitialData/Provider.svelte b/packages/svelte-query-persist-client/tests/InitialData/Provider.svelte index e5e17f712e..b9d600d0df 100644 --- a/packages/svelte-query-persist-client/tests/InitialData/Provider.svelte +++ b/packages/svelte-query-persist-client/tests/InitialData/Provider.svelte @@ -3,12 +3,15 @@ import InitialData from './InitialData.svelte' import type { OmitKeyof, QueryClient } from '@tanstack/svelte-query' import type { PersistQueryClientOptions } from '@tanstack/query-persist-client-core' - import type { Writable } from 'svelte/store' - import type { StatusResult } from '../utils.js' + import type { StatusResult } from '../utils.svelte.js' - export let queryClient: QueryClient - export let persistOptions: OmitKeyof - export let states: Writable>> + interface Props { + queryClient: QueryClient + persistOptions: OmitKeyof + states: { value: Array> } + } + + let { queryClient, persistOptions, states }: Props = $props() diff --git a/packages/svelte-query-persist-client/tests/OnSuccess/OnSuccess.svelte b/packages/svelte-query-persist-client/tests/OnSuccess/OnSuccess.svelte index efd321ca8b..51fc2b0e50 100644 --- a/packages/svelte-query-persist-client/tests/OnSuccess/OnSuccess.svelte +++ b/packages/svelte-query-persist-client/tests/OnSuccess/OnSuccess.svelte @@ -1,15 +1,15 @@ -
{$query.data}
-
fetchStatus: {$query.fetchStatus}
+
{query.data}
+
fetchStatus: {query.fetchStatus}
diff --git a/packages/svelte-query-persist-client/tests/OnSuccess/Provider.svelte b/packages/svelte-query-persist-client/tests/OnSuccess/Provider.svelte index c0d2792771..0b280ca570 100644 --- a/packages/svelte-query-persist-client/tests/OnSuccess/Provider.svelte +++ b/packages/svelte-query-persist-client/tests/OnSuccess/Provider.svelte @@ -4,9 +4,13 @@ import type { OmitKeyof, QueryClient } from '@tanstack/svelte-query' import type { PersistQueryClientOptions } from '@tanstack/query-persist-client-core' - export let queryClient: QueryClient - export let persistOptions: OmitKeyof - export let onSuccess: () => void + interface Props { + queryClient: QueryClient + persistOptions: OmitKeyof + onSuccess: () => void + } + + let { queryClient, persistOptions, onSuccess }: Props = $props() diff --git a/packages/svelte-query-persist-client/tests/PersistQueryClientProvider.test.ts b/packages/svelte-query-persist-client/tests/PersistQueryClientProvider.svelte.test.ts similarity index 79% rename from packages/svelte-query-persist-client/tests/PersistQueryClientProvider.test.ts rename to packages/svelte-query-persist-client/tests/PersistQueryClientProvider.svelte.test.ts index 86b99cce90..b41b348f1e 100644 --- a/packages/svelte-query-persist-client/tests/PersistQueryClientProvider.test.ts +++ b/packages/svelte-query-persist-client/tests/PersistQueryClientProvider.svelte.test.ts @@ -1,7 +1,6 @@ import { render, waitFor } from '@testing-library/svelte' import { describe, expect, test, vi } from 'vitest' import { persistQueryClientSave } from '@tanstack/query-persist-client-core' -import { get, writable } from 'svelte/store' import AwaitOnSuccess from './AwaitOnSuccess/Provider.svelte' import FreshData from './FreshData/Provider.svelte' import OnSuccess from './OnSuccess/Provider.svelte' @@ -9,14 +8,13 @@ import InitialData from './InitialData/Provider.svelte' import RemoveCache from './RemoveCache/Provider.svelte' import RestoreCache from './RestoreCache/Provider.svelte' import UseQueries from './UseQueries/Provider.svelte' -import { createQueryClient, sleep } from './utils.js' +import { createQueryClient, ref, sleep } from './utils.svelte.js' import type { PersistedClient, Persister, } from '@tanstack/query-persist-client-core' -import type { Writable } from 'svelte/store' -import type { StatusResult } from './utils.js' +import type { StatusResult } from './utils.svelte.js' const createMockPersister = (): Persister => { let storedState: PersistedClient | undefined @@ -56,7 +54,7 @@ const createMockErrorPersister = ( describe('PersistQueryClientProvider', () => { test('restores cache from persister', async () => { - const statesStore: Writable>> = writable([]) + let states = ref>>([]) const queryClient = createQueryClient() await queryClient.prefetchQuery({ @@ -74,7 +72,7 @@ describe('PersistQueryClientProvider', () => { props: { queryClient, persistOptions: { persister }, - states: statesStore, + states, }, }) @@ -82,36 +80,35 @@ describe('PersistQueryClientProvider', () => { await waitFor(() => rendered.getByText('hydrated')) await waitFor(() => rendered.getByText('fetched')) - const states = get(statesStore) - expect(states).toHaveLength(4) + expect(states.value).toHaveLength(3) - expect(states[0]).toMatchObject({ + expect(states.value[0]).toMatchObject({ status: 'pending', fetchStatus: 'idle', data: undefined, }) - expect(states[1]).toMatchObject({ + expect(states.value[1]).toMatchObject({ status: 'success', fetchStatus: 'fetching', data: 'hydrated', }) - expect(states[2]).toMatchObject({ + expect(states.value[2]).toMatchObject({ status: 'success', - fetchStatus: 'fetching', - data: 'hydrated', + fetchStatus: 'idle', + data: 'fetched', }) - expect(states[3]).toMatchObject({ + /* expect(states[3]).toMatchObject({ status: 'success', fetchStatus: 'idle', data: 'fetched', - }) + }) */ }) test('should also put useQueries into idle state', async () => { - const statesStore: Writable>> = writable([]) + let states = ref>>([]) const queryClient = createQueryClient() await queryClient.prefetchQuery({ @@ -129,7 +126,7 @@ describe('PersistQueryClientProvider', () => { props: { queryClient, persistOptions: { persister }, - states: statesStore, + states, }, }) @@ -137,29 +134,21 @@ describe('PersistQueryClientProvider', () => { await waitFor(() => rendered.getByText('hydrated')) await waitFor(() => rendered.getByText('fetched')) - const states = get(statesStore) - - expect(states).toHaveLength(4) + expect(states.value).toHaveLength(3) - expect(states[0]).toMatchObject({ + expect(states.value[0]).toMatchObject({ status: 'pending', fetchStatus: 'idle', data: undefined, }) - expect(states[1]).toMatchObject({ + expect(states.value[1]).toMatchObject({ status: 'success', fetchStatus: 'fetching', data: 'hydrated', }) - expect(states[2]).toMatchObject({ - status: 'success', - fetchStatus: 'fetching', - data: 'hydrated', - }) - - expect(states[3]).toMatchObject({ + expect(states.value[2]).toMatchObject({ status: 'success', fetchStatus: 'idle', data: 'fetched', @@ -167,7 +156,7 @@ describe('PersistQueryClientProvider', () => { }) test('should show initialData while restoring', async () => { - const statesStore: Writable>> = writable([]) + let states = ref>>([]) const queryClient = createQueryClient() await queryClient.prefetchQuery({ @@ -185,7 +174,7 @@ describe('PersistQueryClientProvider', () => { props: { queryClient, persistOptions: { persister }, - states: statesStore, + states, }, }) @@ -193,28 +182,27 @@ describe('PersistQueryClientProvider', () => { await waitFor(() => rendered.getByText('hydrated')) await waitFor(() => rendered.getByText('fetched')) - const states = get(statesStore) - expect(states).toHaveLength(4) + expect(states.value).toHaveLength(3) - expect(states[0]).toMatchObject({ + expect(states.value[0]).toMatchObject({ status: 'success', fetchStatus: 'idle', data: 'initial', }) - expect(states[1]).toMatchObject({ + expect(states.value[1]).toMatchObject({ status: 'success', fetchStatus: 'fetching', data: 'hydrated', }) - expect(states[2]).toMatchObject({ + /* expect(states[2]).toMatchObject({ status: 'success', fetchStatus: 'fetching', data: 'hydrated', - }) + }) */ - expect(states[3]).toMatchObject({ + expect(states.value[2]).toMatchObject({ status: 'success', fetchStatus: 'idle', data: 'fetched', @@ -222,7 +210,7 @@ describe('PersistQueryClientProvider', () => { }) test('should not refetch after restoring when data is fresh', async () => { - const statesStore: Writable>> = writable([]) + let states = ref>>([]) const queryClient = createQueryClient() await queryClient.prefetchQuery({ @@ -236,13 +224,13 @@ describe('PersistQueryClientProvider', () => { queryClient.clear() - const fetched = writable(false) + const fetched = $state(false) const rendered = render(FreshData, { props: { queryClient, persistOptions: { persister }, - states: statesStore, + states, fetched, }, }) @@ -250,18 +238,17 @@ describe('PersistQueryClientProvider', () => { await waitFor(() => rendered.getByText('data: undefined')) await waitFor(() => rendered.getByText('data: hydrated')) - const states = get(statesStore) - expect(states).toHaveLength(2) + expect(fetched).toBe(false) - expect(get(fetched)).toBe(false) + expect(states.value).toHaveLength(2) - expect(states[0]).toMatchObject({ + expect(states.value[0]).toMatchObject({ status: 'pending', fetchStatus: 'idle', data: undefined, }) - expect(states[1]).toMatchObject({ + expect(states.value[1]).toMatchObject({ status: 'success', fetchStatus: 'idle', data: 'hydrated', @@ -311,17 +298,17 @@ describe('PersistQueryClientProvider', () => { queryClient.clear() - const statesStore: Writable> = writable([]) + let states: Array = $state([]) const rendered = render(AwaitOnSuccess, { props: { queryClient, persistOptions: { persister }, - states: statesStore, + states, onSuccess: async () => { - statesStore.update((s) => [...s, 'onSuccess']) - await sleep(20) - statesStore.update((s) => [...s, 'onSuccess done']) + states.push('onSuccess') + await sleep(5) + states.push('onSuccess done') }, }, }) @@ -329,8 +316,6 @@ describe('PersistQueryClientProvider', () => { await waitFor(() => rendered.getByText('hydrated')) await waitFor(() => rendered.getByText('fetched')) - const states = get(statesStore) - expect(states).toEqual([ 'onSuccess', 'onSuccess done', diff --git a/packages/svelte-query-persist-client/tests/RemoveCache/Provider.svelte b/packages/svelte-query-persist-client/tests/RemoveCache/Provider.svelte index 8738e99bd5..32e3430c4d 100644 --- a/packages/svelte-query-persist-client/tests/RemoveCache/Provider.svelte +++ b/packages/svelte-query-persist-client/tests/RemoveCache/Provider.svelte @@ -4,8 +4,12 @@ import type { OmitKeyof, QueryClient } from '@tanstack/svelte-query' import type { PersistQueryClientOptions } from '@tanstack/query-persist-client-core' - export let queryClient: QueryClient - export let persistOptions: OmitKeyof + interface Props { + queryClient: QueryClient + persistOptions: OmitKeyof + } + + let { queryClient, persistOptions }: Props = $props() diff --git a/packages/svelte-query-persist-client/tests/RemoveCache/RemoveCache.svelte b/packages/svelte-query-persist-client/tests/RemoveCache/RemoveCache.svelte index efd321ca8b..51fc2b0e50 100644 --- a/packages/svelte-query-persist-client/tests/RemoveCache/RemoveCache.svelte +++ b/packages/svelte-query-persist-client/tests/RemoveCache/RemoveCache.svelte @@ -1,15 +1,15 @@ -
{$query.data}
-
fetchStatus: {$query.fetchStatus}
+
{query.data}
+
fetchStatus: {query.fetchStatus}
diff --git a/packages/svelte-query-persist-client/tests/RestoreCache/Provider.svelte b/packages/svelte-query-persist-client/tests/RestoreCache/Provider.svelte index 531aae8c3f..cfbf97767c 100644 --- a/packages/svelte-query-persist-client/tests/RestoreCache/Provider.svelte +++ b/packages/svelte-query-persist-client/tests/RestoreCache/Provider.svelte @@ -3,12 +3,15 @@ import RestoreCache from './RestoreCache.svelte' import type { OmitKeyof, QueryClient } from '@tanstack/svelte-query' import type { PersistQueryClientOptions } from '@tanstack/query-persist-client-core' - import type { Writable } from 'svelte/store' - import type { StatusResult } from '../utils.js' + import type { StatusResult } from '../utils.svelte.js' - export let queryClient: QueryClient - export let persistOptions: OmitKeyof - export let states: Writable>> + interface Props { + queryClient: QueryClient + persistOptions: OmitKeyof + states: { value: Array> } + } + + let { queryClient, persistOptions, states }: Props = $props() diff --git a/packages/svelte-query-persist-client/tests/RestoreCache/RestoreCache.svelte b/packages/svelte-query-persist-client/tests/RestoreCache/RestoreCache.svelte index 15b3a92df9..362f39ea60 100644 --- a/packages/svelte-query-persist-client/tests/RestoreCache/RestoreCache.svelte +++ b/packages/svelte-query-persist-client/tests/RestoreCache/RestoreCache.svelte @@ -1,21 +1,24 @@ -
{$query.data}
-
fetchStatus: {$query.fetchStatus}
+
{query.data}
+
fetchStatus: {query.fetchStatus}
diff --git a/packages/svelte-query-persist-client/tests/UseQueries/Provider.svelte b/packages/svelte-query-persist-client/tests/UseQueries/Provider.svelte index 56429b7d81..de1a961a5f 100644 --- a/packages/svelte-query-persist-client/tests/UseQueries/Provider.svelte +++ b/packages/svelte-query-persist-client/tests/UseQueries/Provider.svelte @@ -3,12 +3,15 @@ import UseQueries from './UseQueries.svelte' import type { OmitKeyof, QueryClient } from '@tanstack/svelte-query' import type { PersistQueryClientOptions } from '@tanstack/query-persist-client-core' - import type { Writable } from 'svelte/store' - import type { StatusResult } from '../utils.js' + import type { StatusResult } from '../utils.svelte.js' - export let queryClient: QueryClient - export let persistOptions: OmitKeyof - export let states: Writable>> + interface Props { + queryClient: QueryClient + persistOptions: OmitKeyof + states: { value: Array> } + } + + let { queryClient, persistOptions, states }: Props = $props() diff --git a/packages/svelte-query-persist-client/tests/UseQueries/UseQueries.svelte b/packages/svelte-query-persist-client/tests/UseQueries/UseQueries.svelte index 75ec9dc4e3..122d3da254 100644 --- a/packages/svelte-query-persist-client/tests/UseQueries/UseQueries.svelte +++ b/packages/svelte-query-persist-client/tests/UseQueries/UseQueries.svelte @@ -1,13 +1,13 @@ -
{$queries[0].data}
-
fetchStatus: {$queries[0].fetchStatus}
+
{queries[0].data}
+
fetchStatus: {queries[0].fetchStatus}
diff --git a/packages/svelte-query-persist-client/tests/utils.ts b/packages/svelte-query-persist-client/tests/utils.svelte.ts similarity index 72% rename from packages/svelte-query-persist-client/tests/utils.ts rename to packages/svelte-query-persist-client/tests/utils.svelte.ts index b246d49a35..8e59db6139 100644 --- a/packages/svelte-query-persist-client/tests/utils.ts +++ b/packages/svelte-query-persist-client/tests/utils.svelte.ts @@ -17,3 +17,16 @@ export type StatusResult = { fetchStatus: string data: T | undefined } + +export function ref(initial: T) { + let value = $state(initial) + + return { + get value() { + return value + }, + set value(newValue) { + value = newValue + }, + } +} diff --git a/packages/svelte-query/eslint.config.js b/packages/svelte-query/eslint.config.js index d0e37929b0..1d0ce17d52 100644 --- a/packages/svelte-query/eslint.config.js +++ b/packages/svelte-query/eslint.config.js @@ -10,6 +10,7 @@ export default [ rules: { 'svelte/block-lang': ['error', { script: ['ts'] }], 'svelte/no-svelte-internal': 'error', + 'svelte/no-unused-svelte-ignore': 'off', 'svelte/valid-compile': 'off', }, }, diff --git a/packages/svelte-query/package.json b/packages/svelte-query/package.json index 3512861b11..85cf646678 100644 --- a/packages/svelte-query/package.json +++ b/packages/svelte-query/package.json @@ -46,13 +46,13 @@ }, "devDependencies": { "@sveltejs/package": "^2.3.7", - "@sveltejs/vite-plugin-svelte": "^3.1.2", + "@sveltejs/vite-plugin-svelte": "^4.0.0", "@testing-library/svelte": "^5.2.6", "eslint-plugin-svelte": "^2.46.0", - "svelte": "^4.2.18", + "svelte": "^5.0.0", "svelte-check": "^4.0.0" }, "peerDependencies": { - "svelte": "^3.54.0 || ^4.0.0 || ^5.0.0-next.0" + "svelte": "^5.0.0" } } diff --git a/packages/svelte-query/src/HydrationBoundary.svelte b/packages/svelte-query/src/HydrationBoundary.svelte index 330984311f..96c26068a2 100644 --- a/packages/svelte-query/src/HydrationBoundary.svelte +++ b/packages/svelte-query/src/HydrationBoundary.svelte @@ -1,16 +1,27 @@ - +{@render children()} diff --git a/packages/svelte-query/src/QueryClientProvider.svelte b/packages/svelte-query/src/QueryClientProvider.svelte index 9f43e49093..36f1df43b1 100644 --- a/packages/svelte-query/src/QueryClientProvider.svelte +++ b/packages/svelte-query/src/QueryClientProvider.svelte @@ -2,8 +2,10 @@ import { onDestroy, onMount } from 'svelte' import { QueryClient } from '@tanstack/query-core' import { setQueryClientContext } from './context.js' + import type { QueryClientProviderProps } from './types.js' - export let client = new QueryClient() + const { client = new QueryClient(), children }: QueryClientProviderProps = + $props() onMount(() => { client.mount() @@ -16,4 +18,4 @@ }) - +{@render children()} diff --git a/packages/svelte-query/src/context.ts b/packages/svelte-query/src/context.ts index 962451b232..0676181f57 100644 --- a/packages/svelte-query/src/context.ts +++ b/packages/svelte-query/src/context.ts @@ -1,7 +1,5 @@ import { getContext, setContext } from 'svelte' -import { readable } from 'svelte/store' import type { QueryClient } from '@tanstack/query-core' -import type { Readable } from 'svelte/store' const _contextKey = '$$_queryClient' @@ -25,18 +23,18 @@ export const setQueryClientContext = (client: QueryClient): void => { const _isRestoringContextKey = '$$_isRestoring' /** Retrieves a `isRestoring` from Svelte's context */ -export const getIsRestoringContext = (): Readable => { +export const getIsRestoringContext = (): (() => boolean) => { try { - const isRestoring = getContext | undefined>( + const isRestoring = getContext<(() => boolean) | undefined>( _isRestoringContextKey, ) - return isRestoring ? isRestoring : readable(false) + return isRestoring ?? (() => false) } catch (error) { - return readable(false) + return () => false } } /** Sets a `isRestoring` on Svelte's context */ -export const setIsRestoringContext = (isRestoring: Readable): void => { +export const setIsRestoringContext = (isRestoring: () => boolean): void => { setContext(_isRestoringContextKey, isRestoring) } diff --git a/packages/svelte-query/src/createBaseQuery.svelte.ts b/packages/svelte-query/src/createBaseQuery.svelte.ts new file mode 100644 index 0000000000..6290ea9b97 --- /dev/null +++ b/packages/svelte-query/src/createBaseQuery.svelte.ts @@ -0,0 +1,83 @@ +import { notifyManager } from '@tanstack/query-core' +import { useIsRestoring } from './useIsRestoring.js' +import { useQueryClient } from './useQueryClient.js' +import type { + CreateBaseQueryOptions, + CreateBaseQueryResult, + FunctionedParams, +} from './types.js' +import type { + QueryClient, + QueryKey, + QueryObserver, + QueryObserverResult, +} from '@tanstack/query-core' + +export function createBaseQuery< + TQueryFnData, + TError, + TData, + TQueryData, + TQueryKey extends QueryKey, +>( + options: FunctionedParams< + CreateBaseQueryOptions + >, + Observer: typeof QueryObserver, + queryClient?: QueryClient, +): CreateBaseQueryResult { + /** Load query client */ + const client = useQueryClient(queryClient) + const isRestoring = useIsRestoring() + + /** Creates a store that has the default options applied */ + const defaultedOptions = $derived(() => { + const defaultOptions = client.defaultQueryOptions(options()) + defaultOptions._optimisticResults = isRestoring() + ? 'isRestoring' + : 'optimistic' + defaultOptions.structuralSharing = false + return defaultOptions + }) + + /** Creates the observer */ + const observer = new Observer< + TQueryFnData, + TError, + TData, + TQueryData, + TQueryKey + >(client, defaultedOptions()) + + const result = $state>( + observer.getOptimisticResult(defaultedOptions()), + ) + + function updateResult(r: QueryObserverResult) { + Object.assign(result, r) + } + + $effect(() => { + const unsubscribe = isRestoring() + ? () => undefined + : observer.subscribe(() => { + notifyManager.batchCalls(() => { + updateResult(observer.getOptimisticResult(defaultedOptions())) + })() + }) + + observer.updateResult() + return () => unsubscribe() + }) + + /** Subscribe to changes in result and defaultedOptionsStore */ + $effect.pre(() => { + observer.setOptions(defaultedOptions(), { listeners: false }) + updateResult(observer.getOptimisticResult(defaultedOptions())) + }) + + // Handle result property usage tracking + return !defaultedOptions().notifyOnChangeProps + ? observer.trackResult(result) + : result +} diff --git a/packages/svelte-query/src/createBaseQuery.ts b/packages/svelte-query/src/createBaseQuery.ts deleted file mode 100644 index 35320603ce..0000000000 --- a/packages/svelte-query/src/createBaseQuery.ts +++ /dev/null @@ -1,87 +0,0 @@ -import { derived, get, readable } from 'svelte/store' -import { notifyManager } from '@tanstack/query-core' -import { useIsRestoring } from './useIsRestoring.js' -import { useQueryClient } from './useQueryClient.js' -import { isSvelteStore, noop } from './utils.js' -import type { - QueryClient, - QueryKey, - QueryObserver, - QueryObserverResult, -} from '@tanstack/query-core' -import type { - CreateBaseQueryOptions, - CreateBaseQueryResult, - StoreOrVal, -} from './types.js' - -export function createBaseQuery< - TQueryFnData, - TError, - TData, - TQueryData, - TQueryKey extends QueryKey, ->( - options: StoreOrVal< - CreateBaseQueryOptions - >, - Observer: typeof QueryObserver, - queryClient?: QueryClient, -): CreateBaseQueryResult { - /** Load query client */ - const client = useQueryClient(queryClient) - const isRestoring = useIsRestoring() - /** Converts options to a svelte store if not already a store object */ - const optionsStore = isSvelteStore(options) ? options : readable(options) - - /** Creates a store that has the default options applied */ - const defaultedOptionsStore = derived( - [optionsStore, isRestoring], - ([$optionsStore, $isRestoring]) => { - const defaultedOptions = client.defaultQueryOptions($optionsStore) - defaultedOptions._optimisticResults = $isRestoring - ? 'isRestoring' - : 'optimistic' - return defaultedOptions - }, - ) - - /** Creates the observer */ - const observer = new Observer< - TQueryFnData, - TError, - TData, - TQueryData, - TQueryKey - >(client, get(defaultedOptionsStore)) - - defaultedOptionsStore.subscribe(($defaultedOptions) => { - // Do not notify on updates because of changes in the options because - // these changes should already be reflected in the optimistic result. - observer.setOptions($defaultedOptions, { listeners: false }) - }) - - const result = derived< - typeof isRestoring, - QueryObserverResult - >(isRestoring, ($isRestoring, set) => { - const unsubscribe = $isRestoring - ? noop - : observer.subscribe(notifyManager.batchCalls(set)) - observer.updateResult() - return unsubscribe - }) - - /** Subscribe to changes in result and defaultedOptionsStore */ - const { subscribe } = derived( - [result, defaultedOptionsStore], - ([$result, $defaultedOptionsStore]) => { - $result = observer.getOptimisticResult($defaultedOptionsStore) - return !$defaultedOptionsStore.notifyOnChangeProps - ? observer.trackResult($result) - : $result - }, - ) - - return { subscribe } -} diff --git a/packages/svelte-query/src/createInfiniteQuery.ts b/packages/svelte-query/src/createInfiniteQuery.ts index 7137800298..b12d556fa3 100644 --- a/packages/svelte-query/src/createInfiniteQuery.ts +++ b/packages/svelte-query/src/createInfiniteQuery.ts @@ -1,5 +1,5 @@ import { InfiniteQueryObserver } from '@tanstack/query-core' -import { createBaseQuery } from './createBaseQuery.js' +import { createBaseQuery } from './createBaseQuery.svelte.js' import type { DefaultError, InfiniteData, @@ -10,7 +10,7 @@ import type { import type { CreateInfiniteQueryOptions, CreateInfiniteQueryResult, - StoreOrVal, + FunctionedParams, } from './types.js' export function createInfiniteQuery< @@ -20,7 +20,7 @@ export function createInfiniteQuery< TQueryKey extends QueryKey = QueryKey, TPageParam = unknown, >( - options: StoreOrVal< + options: FunctionedParams< CreateInfiniteQueryOptions< TQueryFnData, TError, diff --git a/packages/svelte-query/src/createMutation.svelte.ts b/packages/svelte-query/src/createMutation.svelte.ts new file mode 100644 index 0000000000..3f0dfcecc3 --- /dev/null +++ b/packages/svelte-query/src/createMutation.svelte.ts @@ -0,0 +1,71 @@ +import { onDestroy } from 'svelte' + +import { MutationObserver, notifyManager } from '@tanstack/query-core' +import { useQueryClient } from './useQueryClient.js' +import type { + CreateMutateFunction, + CreateMutationOptions, + CreateMutationResult, + FunctionedParams, +} from './types.js' + +import type { DefaultError, QueryClient } from '@tanstack/query-core' + +export function createMutation< + TData = unknown, + TError = DefaultError, + TVariables = void, + TContext = unknown, +>( + options: FunctionedParams< + CreateMutationOptions + >, + queryClient?: QueryClient, +): CreateMutationResult { + const client = useQueryClient(queryClient) + + const observer = $derived( + new MutationObserver( + client, + options(), + ), + ) + + const mutate = $state< + CreateMutateFunction + >((variables, mutateOptions) => { + observer.mutate(variables, mutateOptions).catch(noop) + }) + + $effect.pre(() => { + observer.setOptions(options()) + }) + + const result = $state(observer.getCurrentResult()) + + const unsubscribe = observer.subscribe((val) => { + notifyManager.batchCalls(() => { + Object.assign(result, val) + })() + }) + + onDestroy(() => { + unsubscribe() + }) + + // @ts-expect-error + return new Proxy(result, { + get: (_, prop) => { + const r = { + ...result, + mutate, + mutateAsync: result.mutate, + } + if (prop == 'value') return r + // @ts-expect-error + return r[prop] + }, + }) +} + +function noop() {} diff --git a/packages/svelte-query/src/createMutation.ts b/packages/svelte-query/src/createMutation.ts deleted file mode 100644 index 96198c3c1f..0000000000 --- a/packages/svelte-query/src/createMutation.ts +++ /dev/null @@ -1,52 +0,0 @@ -import { derived, get, readable } from 'svelte/store' -import { MutationObserver, notifyManager } from '@tanstack/query-core' -import { useQueryClient } from './useQueryClient.js' -import { isSvelteStore, noop } from './utils.js' -import type { - CreateMutateFunction, - CreateMutationOptions, - CreateMutationResult, - StoreOrVal, -} from './types.js' -import type { DefaultError, QueryClient } from '@tanstack/query-core' - -export function createMutation< - TData = unknown, - TError = DefaultError, - TVariables = void, - TContext = unknown, ->( - options: StoreOrVal< - CreateMutationOptions - >, - queryClient?: QueryClient, -): CreateMutationResult { - const client = useQueryClient(queryClient) - - const optionsStore = isSvelteStore(options) ? options : readable(options) - - const observer = new MutationObserver( - client, - get(optionsStore), - ) - let mutate: CreateMutateFunction - - optionsStore.subscribe(($options) => { - mutate = (variables, mutateOptions) => { - observer.mutate(variables, mutateOptions).catch(noop) - } - observer.setOptions($options) - }) - - const result = readable(observer.getCurrentResult(), (set) => { - return observer.subscribe(notifyManager.batchCalls((val) => set(val))) - }) - - const { subscribe } = derived(result, ($result) => ({ - ...$result, - mutate, - mutateAsync: $result.mutate, - })) - - return { subscribe } -} diff --git a/packages/svelte-query/src/createQueries.ts b/packages/svelte-query/src/createQueries.svelte.ts similarity index 85% rename from packages/svelte-query/src/createQueries.ts rename to packages/svelte-query/src/createQueries.svelte.ts index 2c77a6db4e..f5078e7b1b 100644 --- a/packages/svelte-query/src/createQueries.ts +++ b/packages/svelte-query/src/createQueries.svelte.ts @@ -1,10 +1,8 @@ +import { untrack } from 'svelte' import { QueriesObserver, notifyManager } from '@tanstack/query-core' -import { derived, get, readable } from 'svelte/store' import { useIsRestoring } from './useIsRestoring.js' import { useQueryClient } from './useQueryClient.js' -import { isSvelteStore, noop } from './utils.js' -import type { Readable } from 'svelte/store' -import type { StoreOrVal } from './types.js' +import type { FunctionedParams } from './types.js' import type { DefaultError, DefinedQueryObserverResult, @@ -210,68 +208,70 @@ export function createQueries< queries, ...options }: { - queries: StoreOrVal<[...QueriesOptions]> + queries: FunctionedParams<[...QueriesOptions]> combine?: (result: QueriesResults) => TCombinedResult }, queryClient?: QueryClient, -): Readable { +): TCombinedResult { const client = useQueryClient(queryClient) const isRestoring = useIsRestoring() - const queriesStore = isSvelteStore(queries) ? queries : readable(queries) + const defaultedQueries = $derived(() => { + return queries().map((opts) => { + const defaultedOptions = client.defaultQueryOptions(opts) + // Make sure the results are already in fetching state before subscribing or updating options + defaultedOptions._optimisticResults = isRestoring() + ? 'isRestoring' + : 'optimistic' + return defaultedOptions as QueryObserverOptions + }) + }) - const defaultedQueriesStore = derived( - [queriesStore, isRestoring], - ([$queries, $isRestoring]) => { - return $queries.map((opts) => { - const defaultedOptions = client.defaultQueryOptions( - opts as QueryObserverOptions, - ) - // Make sure the results are already in fetching state before subscribing or updating options - defaultedOptions._optimisticResults = $isRestoring - ? 'isRestoring' - : 'optimistic' - return defaultedOptions - }) - }, - ) const observer = new QueriesObserver( client, - get(defaultedQueriesStore), + defaultedQueries(), options as QueriesObserverOptions, ) - defaultedQueriesStore.subscribe(($defaultedQueries) => { + const [_, getCombinedResult, trackResult] = $derived( + observer.getOptimisticResult( + defaultedQueries(), + (options as QueriesObserverOptions).combine, + ), + ) + + $effect(() => { // Do not notify on updates because of changes in the options because // these changes should already be reflected in the optimistic result. observer.setQueries( - $defaultedQueries, + defaultedQueries(), options as QueriesObserverOptions, { listeners: false }, ) }) - const result = derived([isRestoring], ([$isRestoring], set) => { - const unsubscribe = $isRestoring - ? noop - : observer.subscribe(notifyManager.batchCalls(set)) + let result = $state(getCombinedResult(trackResult())) - return () => unsubscribe() - }) + $effect(() => { + if (isRestoring()) { + return () => null + } + untrack(() => { + // @ts-expect-error + Object.assign(result, getCombinedResult(trackResult())) + }) - const { subscribe } = derived( - [result, defaultedQueriesStore], - // @ts-expect-error svelte-check thinks this is unused - ([$result, $defaultedQueriesStore]) => { - const [rawResult, combineResult, trackResult] = - observer.getOptimisticResult( - $defaultedQueriesStore, + return observer.subscribe((_result) => { + notifyManager.batchCalls(() => { + const res = observer.getOptimisticResult( + defaultedQueries(), (options as QueriesObserverOptions).combine, ) - $result = rawResult - return combineResult(trackResult()) - }, - ) + // @ts-expect-error + Object.assign(result, res[1](res[2]())) + })() + }) + }) - return { subscribe } + return result } diff --git a/packages/svelte-query/src/createQuery.ts b/packages/svelte-query/src/createQuery.ts index 51a43c274c..79b6782b2f 100644 --- a/packages/svelte-query/src/createQuery.ts +++ b/packages/svelte-query/src/createQuery.ts @@ -1,11 +1,11 @@ import { QueryObserver } from '@tanstack/query-core' -import { createBaseQuery } from './createBaseQuery.js' +import { createBaseQuery } from './createBaseQuery.svelte.js' import type { DefaultError, QueryClient, QueryKey } from '@tanstack/query-core' import type { CreateQueryOptions, CreateQueryResult, DefinedCreateQueryResult, - StoreOrVal, + FunctionedParams, } from './types.js' import type { DefinedInitialDataOptions, @@ -18,7 +18,7 @@ export function createQuery< TData = TQueryFnData, TQueryKey extends QueryKey = QueryKey, >( - options: StoreOrVal< + options: FunctionedParams< DefinedInitialDataOptions >, queryClient?: QueryClient, @@ -30,7 +30,7 @@ export function createQuery< TData = TQueryFnData, TQueryKey extends QueryKey = QueryKey, >( - options: StoreOrVal< + options: FunctionedParams< UndefinedInitialDataOptions >, queryClient?: QueryClient, @@ -42,14 +42,14 @@ export function createQuery< TData = TQueryFnData, TQueryKey extends QueryKey = QueryKey, >( - options: StoreOrVal< + options: FunctionedParams< CreateQueryOptions >, queryClient?: QueryClient, ): CreateQueryResult export function createQuery( - options: StoreOrVal, + options: FunctionedParams, queryClient?: QueryClient, ) { return createBaseQuery(options, QueryObserver, queryClient) diff --git a/packages/svelte-query/src/index.ts b/packages/svelte-query/src/index.ts index 735cd89f59..1b74a9be91 100644 --- a/packages/svelte-query/src/index.ts +++ b/packages/svelte-query/src/index.ts @@ -8,20 +8,20 @@ export * from './types.js' export * from './context.js' export { createQuery } from './createQuery.js' -export type { QueriesResults, QueriesOptions } from './createQueries.js' +export type { QueriesResults, QueriesOptions } from './createQueries.svelte.js' export type { DefinedInitialDataOptions, UndefinedInitialDataOptions, } from './queryOptions.js' export { queryOptions } from './queryOptions.js' -export { createQueries } from './createQueries.js' +export { createQueries } from './createQueries.svelte.js' export { createInfiniteQuery } from './createInfiniteQuery.js' export { infiniteQueryOptions } from './infiniteQueryOptions.js' -export { createMutation } from './createMutation.js' -export { useMutationState } from './useMutationState.js' +export { createMutation } from './createMutation.svelte.js' +export { useMutationState } from './useMutationState.svelte.js' export { useQueryClient } from './useQueryClient.js' -export { useIsFetching } from './useIsFetching.js' -export { useIsMutating } from './useIsMutating.js' +export { useIsFetching } from './useIsFetching.svelte.js' +export { useIsMutating } from './useIsMutating.svelte.js' export { useIsRestoring } from './useIsRestoring.js' export { useHydrate } from './useHydrate.js' export { default as HydrationBoundary } from './HydrationBoundary.svelte' diff --git a/packages/svelte-query/src/types.ts b/packages/svelte-query/src/types.ts index fb835c5e7b..05116a8786 100644 --- a/packages/svelte-query/src/types.ts +++ b/packages/svelte-query/src/types.ts @@ -1,3 +1,4 @@ +import type { Snippet } from 'svelte' import type { DefaultError, DefinedQueryObserverResult, @@ -9,16 +10,14 @@ import type { MutationObserverOptions, MutationObserverResult, MutationState, - OmitKeyof, Override, + QueryClient, QueryKey, QueryObserverOptions, QueryObserverResult, } from '@tanstack/query-core' -import type { Readable } from 'svelte/store' -/** Allows a type to be either the base object or a store of that object */ -export type StoreOrVal = T | Readable +export type FunctionedParams = () => T /** Options for createBaseQuery */ export type CreateBaseQueryOptions< @@ -33,7 +32,7 @@ export type CreateBaseQueryOptions< export type CreateBaseQueryResult< TData = unknown, TError = DefaultError, -> = Readable> +> = QueryObserverResult /** Options for createQuery */ export type CreateQueryOptions< @@ -70,13 +69,13 @@ export type CreateInfiniteQueryOptions< export type CreateInfiniteQueryResult< TData = unknown, TError = DefaultError, -> = Readable> +> = InfiniteQueryObserverResult /** Options for createBaseQuery with initialData */ export type DefinedCreateBaseQueryResult< TData = unknown, TError = DefaultError, -> = Readable> +> = DefinedQueryObserverResult /** Options for createQuery with initialData */ export type DefinedCreateQueryResult< @@ -90,9 +89,9 @@ export type CreateMutationOptions< TError = DefaultError, TVariables = void, TContext = unknown, -> = OmitKeyof< +> = Omit< MutationObserverOptions, - '_defaulted' + '_defaulted' | 'variables' > export type CreateMutateFunction< @@ -129,7 +128,7 @@ export type CreateMutationResult< TError = DefaultError, TVariables = unknown, TContext = unknown, -> = Readable> +> = CreateBaseMutationResult /** Options for useMutationState */ export type MutationStateOptions = { @@ -138,3 +137,8 @@ export type MutationStateOptions = { mutation: Mutation, ) => TResult } + +export type QueryClientProviderProps = { + client: QueryClient + children: Snippet +} diff --git a/packages/svelte-query/src/useIsFetching.svelte.ts b/packages/svelte-query/src/useIsFetching.svelte.ts new file mode 100644 index 0000000000..2296301a28 --- /dev/null +++ b/packages/svelte-query/src/useIsFetching.svelte.ts @@ -0,0 +1,23 @@ +import { onDestroy } from 'svelte' +import { useQueryClient } from './useQueryClient.js' +import type { QueryClient, QueryFilters } from '@tanstack/query-core' + +export function useIsFetching( + filters?: QueryFilters, + queryClient?: QueryClient, +): () => number { + const client = useQueryClient(queryClient) + const queryCache = client.getQueryCache() + + const init = client.isFetching(filters) + let isFetching = $state(init) + $effect(() => { + const unsubscribe = queryCache.subscribe(() => { + isFetching = client.isFetching(filters) + }) + + onDestroy(unsubscribe) + }) + + return () => isFetching +} diff --git a/packages/svelte-query/src/useIsFetching.ts b/packages/svelte-query/src/useIsFetching.ts deleted file mode 100644 index e784896192..0000000000 --- a/packages/svelte-query/src/useIsFetching.ts +++ /dev/null @@ -1,30 +0,0 @@ -import { notifyManager } from '@tanstack/query-core' -import { readable } from 'svelte/store' -import { useQueryClient } from './useQueryClient.js' -import type { Readable } from 'svelte/store' -import type { QueryClient, QueryFilters } from '@tanstack/query-core' - -export function useIsFetching( - filters?: QueryFilters, - queryClient?: QueryClient, -): Readable { - const client = useQueryClient(queryClient) - const cache = client.getQueryCache() - // isFetching is the prev value initialized on mount * - let isFetching = client.isFetching(filters) - - const { subscribe } = readable(isFetching, (set) => { - return cache.subscribe( - notifyManager.batchCalls(() => { - const newIsFetching = client.isFetching(filters) - if (isFetching !== newIsFetching) { - // * and update with each change - isFetching = newIsFetching - set(isFetching) - } - }), - ) - }) - - return { subscribe } -} diff --git a/packages/svelte-query/src/useIsMutating.ts b/packages/svelte-query/src/useIsMutating.svelte.ts similarity index 77% rename from packages/svelte-query/src/useIsMutating.ts rename to packages/svelte-query/src/useIsMutating.svelte.ts index 258e8fe98c..5e7992a93a 100644 --- a/packages/svelte-query/src/useIsMutating.ts +++ b/packages/svelte-query/src/useIsMutating.svelte.ts @@ -1,30 +1,29 @@ import { notifyManager } from '@tanstack/query-core' -import { readable } from 'svelte/store' import { useQueryClient } from './useQueryClient.js' -import type { Readable } from 'svelte/store' import type { MutationFilters, QueryClient } from '@tanstack/query-core' export function useIsMutating( filters?: MutationFilters, queryClient?: QueryClient, -): Readable { +): () => number { const client = useQueryClient(queryClient) const cache = client.getMutationCache() // isMutating is the prev value initialized on mount * let isMutating = client.isMutating(filters) - const { subscribe } = readable(isMutating, (set) => { + const num = $state({ isMutating }) + $effect(() => { return cache.subscribe( notifyManager.batchCalls(() => { const newIisMutating = client.isMutating(filters) if (isMutating !== newIisMutating) { // * and update with each change isMutating = newIisMutating - set(isMutating) + num.isMutating = isMutating } }), ) }) - return { subscribe } + return () => num.isMutating } diff --git a/packages/svelte-query/src/useIsRestoring.ts b/packages/svelte-query/src/useIsRestoring.ts index c22d8af402..f6ee9bb564 100644 --- a/packages/svelte-query/src/useIsRestoring.ts +++ b/packages/svelte-query/src/useIsRestoring.ts @@ -1,6 +1,5 @@ import { getIsRestoringContext } from './context.js' -import type { Readable } from 'svelte/store' -export function useIsRestoring(): Readable { +export function useIsRestoring(): () => boolean { return getIsRestoringContext() } diff --git a/packages/svelte-query/src/useMutationState.svelte.ts b/packages/svelte-query/src/useMutationState.svelte.ts new file mode 100644 index 0000000000..c517e64b48 --- /dev/null +++ b/packages/svelte-query/src/useMutationState.svelte.ts @@ -0,0 +1,56 @@ +import { replaceEqualDeep } from '@tanstack/query-core' +import { useQueryClient } from './useQueryClient.js' +import type { + MutationCache, + MutationState, + QueryClient, +} from '@tanstack/query-core' +import type { MutationStateOptions } from './types.js' + +function getResult( + mutationCache: MutationCache, + options: MutationStateOptions, +): Array { + return mutationCache + .findAll(options.filters) + .map( + (mutation): TResult => + (options.select ? options.select(mutation) : mutation.state) as TResult, + ) +} + +export function useMutationState( + options: MutationStateOptions = {}, + queryClient?: QueryClient, +): Array { + const mutationCache = useQueryClient(queryClient).getMutationCache() + const result = $state(getResult(mutationCache, options)) + + $effect(() => { + const unsubscribe = mutationCache.subscribe(() => { + const nextResult = replaceEqualDeep( + result, + getResult(mutationCache, options), + ) + if (result !== nextResult) { + Object.assign(result, nextResult) + } + }) + + return unsubscribe + }) + + /* $effect(() => { + mutationCache.subscribe(() => { + const nextResult = replaceEqualDeep( + result.current, + getResult(mutationCache, optionsRef), + ) + if (result.current !== nextResult) { + result = nextResult + //notifyManager.schedule(onStoreChange) + } + }) + }) */ + return result +} diff --git a/packages/svelte-query/src/useMutationState.ts b/packages/svelte-query/src/useMutationState.ts deleted file mode 100644 index 0367eee5db..0000000000 --- a/packages/svelte-query/src/useMutationState.ts +++ /dev/null @@ -1,49 +0,0 @@ -import { readable } from 'svelte/store' -import { notifyManager, replaceEqualDeep } from '@tanstack/query-core' -import { useQueryClient } from './useQueryClient.js' -import type { - MutationCache, - MutationState, - QueryClient, -} from '@tanstack/query-core' -import type { Readable } from 'svelte/store' -import type { MutationStateOptions } from './types.js' - -function getResult( - mutationCache: MutationCache, - options: MutationStateOptions, -): Array { - return mutationCache - .findAll(options.filters) - .map( - (mutation): TResult => - (options.select ? options.select(mutation) : mutation.state) as TResult, - ) -} - -export function useMutationState( - options: MutationStateOptions = {}, - queryClient?: QueryClient, -): Readable> { - const client = useQueryClient(queryClient) - const mutationCache = client.getMutationCache() - - let result = getResult(mutationCache, options) - - const { subscribe } = readable(result, (set) => { - return mutationCache.subscribe( - notifyManager.batchCalls(() => { - const nextResult = replaceEqualDeep( - result, - getResult(mutationCache, options), - ) - if (result !== nextResult) { - result = nextResult - set(result) - } - }), - ) - }) - - return { subscribe } -} diff --git a/packages/svelte-query/src/utils.ts b/packages/svelte-query/src/utils.ts deleted file mode 100644 index 29dd68b659..0000000000 --- a/packages/svelte-query/src/utils.ts +++ /dev/null @@ -1,10 +0,0 @@ -import type { Readable } from 'svelte/store' -import type { StoreOrVal } from './types.js' - -export function isSvelteStore( - obj: StoreOrVal, -): obj is Readable { - return 'subscribe' in obj && typeof obj.subscribe === 'function' -} - -export function noop(): void {} diff --git a/packages/svelte-query/tests/QueryClientProvider/ChildComponent.svelte b/packages/svelte-query/tests/QueryClientProvider/ChildComponent.svelte index 0c5a062945..50f729b1e6 100644 --- a/packages/svelte-query/tests/QueryClientProvider/ChildComponent.svelte +++ b/packages/svelte-query/tests/QueryClientProvider/ChildComponent.svelte @@ -1,14 +1,14 @@ -
Data: {$query.data ?? 'undefined'}
+
Data: {query.data ?? 'undefined'}
diff --git a/packages/svelte-query/tests/QueryClientProvider/ParentComponent.svelte b/packages/svelte-query/tests/QueryClientProvider/ParentComponent.svelte index dc2440ef94..28411fd5ed 100644 --- a/packages/svelte-query/tests/QueryClientProvider/ParentComponent.svelte +++ b/packages/svelte-query/tests/QueryClientProvider/ParentComponent.svelte @@ -4,7 +4,7 @@ import ChildComponent from './ChildComponent.svelte' import type { QueryCache } from '@tanstack/query-core' - export let queryCache: QueryCache + let { queryCache }: { queryCache: QueryCache } = $props() const queryClient = new QueryClient({ queryCache }) diff --git a/packages/svelte-query/tests/createInfiniteQuery/BaseExample.svelte b/packages/svelte-query/tests/createInfiniteQuery/BaseExample.svelte index ce33e17b90..5ae5a42579 100644 --- a/packages/svelte-query/tests/createInfiniteQuery/BaseExample.svelte +++ b/packages/svelte-query/tests/createInfiniteQuery/BaseExample.svelte @@ -1,24 +1,32 @@ -
Status: {$query.status}
+
Status: {query.status}
diff --git a/packages/svelte-query/tests/createInfiniteQuery/SelectExample.svelte b/packages/svelte-query/tests/createInfiniteQuery/SelectExample.svelte index c96a483842..9004370f08 100644 --- a/packages/svelte-query/tests/createInfiniteQuery/SelectExample.svelte +++ b/packages/svelte-query/tests/createInfiniteQuery/SelectExample.svelte @@ -1,15 +1,15 @@ -
{$query.data?.pages.join(',')}
+
{query.data?.pages.join(',')}
diff --git a/packages/svelte-query/tests/createInfiniteQuery/createInfiniteQuery.test.ts b/packages/svelte-query/tests/createInfiniteQuery/createInfiniteQuery.test.ts index d80bc9c706..e1ffb9fd12 100644 --- a/packages/svelte-query/tests/createInfiniteQuery/createInfiniteQuery.test.ts +++ b/packages/svelte-query/tests/createInfiniteQuery/createInfiniteQuery.test.ts @@ -1,18 +1,17 @@ import { describe, expect, test } from 'vitest' import { render, waitFor } from '@testing-library/svelte' -import { get, writable } from 'svelte/store' +import { ref } from '../utils.svelte.js' import BaseExample from './BaseExample.svelte' import SelectExample from './SelectExample.svelte' -import type { Writable } from 'svelte/store' import type { QueryObserverResult } from '@tanstack/query-core' describe('createInfiniteQuery', () => { test('Return the correct states for a successful query', async () => { - const statesStore: Writable> = writable([]) + let states = ref>([]) const rendered = render(BaseExample, { props: { - states: statesStore, + states, }, }) @@ -20,11 +19,9 @@ describe('createInfiniteQuery', () => { expect(rendered.queryByText('Status: success')).toBeInTheDocument() }) - const states = get(statesStore) + expect(states.value).toHaveLength(2) - expect(states).toHaveLength(2) - - expect(states[0]).toEqual({ + expect(states.value[0]).toEqual({ data: undefined, dataUpdatedAt: 0, error: null, @@ -60,7 +57,7 @@ describe('createInfiniteQuery', () => { promise: expect.any(Promise), }) - expect(states[1]).toEqual({ + expect(states.value[1]).toEqual({ data: { pages: [0], pageParams: [0] }, dataUpdatedAt: expect.any(Number), error: null, @@ -98,11 +95,11 @@ describe('createInfiniteQuery', () => { }) test('Select a part of the data', async () => { - const statesStore: Writable> = writable([]) + let states = ref>([]) const rendered = render(SelectExample, { props: { - states: statesStore, + states, }, }) @@ -110,16 +107,14 @@ describe('createInfiniteQuery', () => { expect(rendered.queryByText('count: 1')).toBeInTheDocument() }) - const states = get(statesStore) - - expect(states).toHaveLength(2) + expect(states.value).toHaveLength(2) - expect(states[0]).toMatchObject({ + expect(states.value[0]).toMatchObject({ data: undefined, isSuccess: false, }) - expect(states[1]).toMatchObject({ + expect(states.value[1]).toMatchObject({ data: { pages: ['count: 1'] }, isSuccess: true, }) diff --git a/packages/svelte-query/tests/createMutation/FailureExample.svelte b/packages/svelte-query/tests/createMutation/FailureExample.svelte index 2c8a8a2c1b..a2e59f3bc3 100644 --- a/packages/svelte-query/tests/createMutation/FailureExample.svelte +++ b/packages/svelte-query/tests/createMutation/FailureExample.svelte @@ -1,23 +1,23 @@ - + -
Data: {$mutation.data?.count}
-
Status: {$mutation.status}
-
Failure Count: {$mutation.failureCount}
-
Failure Reason: {$mutation.failureReason}
+
Data: {mutation.data?.count ?? 'undefined'}
+
Status: {mutation.status}
+
Failure Count: {mutation.failureCount}
+
Failure Reason: {mutation.failureReason ?? 'undefined'}
diff --git a/packages/svelte-query/tests/createMutation/OnSuccessExample.svelte b/packages/svelte-query/tests/createMutation/OnSuccessExample.svelte index 7f338ede5d..67e73b435a 100644 --- a/packages/svelte-query/tests/createMutation/OnSuccessExample.svelte +++ b/packages/svelte-query/tests/createMutation/OnSuccessExample.svelte @@ -11,7 +11,7 @@ const queryClient = new QueryClient() setQueryClientContext(queryClient) - const mutation = createMutation({ + const mutation = createMutation(() => ({ mutationFn: (vars: { count: number }) => Promise.resolve(vars.count), onSuccess: (data) => { onSuccessMock(data) @@ -19,9 +19,9 @@ onSettled: (data) => { onSettledMock(data) }, - }) + })) - +
Count: {$count}
diff --git a/packages/svelte-query/tests/createMutation/ResetExample.svelte b/packages/svelte-query/tests/createMutation/ResetExample.svelte index cc8216e84f..0e076ee0bc 100644 --- a/packages/svelte-query/tests/createMutation/ResetExample.svelte +++ b/packages/svelte-query/tests/createMutation/ResetExample.svelte @@ -5,16 +5,16 @@ const queryClient = new QueryClient() setQueryClientContext(queryClient) - const mutation = createMutation({ + const mutation = createMutation(() => ({ mutationFn: () => { const err = new Error('Expected mock error') err.stack = '' return Promise.reject(err) }, - }) + })) - - + + -
Error: {$mutation.error?.message}
+
Error: {mutation.error?.message ?? 'undefined'}
diff --git a/packages/svelte-query/tests/createMutation/createMutation.test.ts b/packages/svelte-query/tests/createMutation/createMutation.test.ts index d120655e31..f2186309cb 100644 --- a/packages/svelte-query/tests/createMutation/createMutation.test.ts +++ b/packages/svelte-query/tests/createMutation/createMutation.test.ts @@ -1,6 +1,6 @@ import { describe, expect, test, vi } from 'vitest' import { fireEvent, render, waitFor } from '@testing-library/svelte' -import { sleep } from '../utils.js' +import { sleep } from '../utils.svelte.js' import ResetExample from './ResetExample.svelte' import OnSuccessExample from './OnSuccessExample.svelte' import FailureExample from './FailureExample.svelte' @@ -103,6 +103,6 @@ describe('createMutation', () => { await waitFor(() => rendered.getByText('Status: success')) await waitFor(() => rendered.getByText('Data: 2')) await waitFor(() => rendered.getByText('Failure Count: 0')) - await waitFor(() => rendered.getByText('Failure Reason: null')) + await waitFor(() => rendered.getByText('Failure Reason: undefined')) }) }) diff --git a/packages/svelte-query/tests/createQueries/BaseExample.svelte b/packages/svelte-query/tests/createQueries/BaseExample.svelte index b9b5ae7c47..9dd218c8ab 100644 --- a/packages/svelte-query/tests/createQueries/BaseExample.svelte +++ b/packages/svelte-query/tests/createQueries/BaseExample.svelte @@ -1,17 +1,26 @@ -{#each $queries as query, index} +{#each queries as query, index}
Status {index + 1}: {query.status}
Data {index + 1}: {query.data}
{/each} diff --git a/packages/svelte-query/tests/createQueries/CombineExample.svelte b/packages/svelte-query/tests/createQueries/CombineExample.svelte index c8fa73696c..4fb83f6c35 100644 --- a/packages/svelte-query/tests/createQueries/CombineExample.svelte +++ b/packages/svelte-query/tests/createQueries/CombineExample.svelte @@ -1,6 +1,6 @@ -
isPending: {$queries.isPending}
-
Data: {$queries.data ?? 'undefined'}
+
isPending: {queries.isPending}
+
Data: {queries.data}
diff --git a/packages/svelte-query/tests/createQueries/createQueries.test-d.ts b/packages/svelte-query/tests/createQueries/createQueries.test-d.ts index 36f4db2b20..aae12fefda 100644 --- a/packages/svelte-query/tests/createQueries/createQueries.test-d.ts +++ b/packages/svelte-query/tests/createQueries/createQueries.test-d.ts @@ -1,8 +1,7 @@ import { describe, expectTypeOf, test } from 'vitest' -import { get } from 'svelte/store' import { skipToken } from '@tanstack/query-core' import { createQueries, queryOptions } from '../../src/index.js' -import type { OmitKeyof, QueryObserverResult } from '@tanstack/query-core' +import type { QueryObserverResult } from '@tanstack/query-core' import type { CreateQueryOptions } from '../../src/index.js' describe('createQueries', () => { @@ -18,9 +17,9 @@ describe('createQueries', () => { wow: true, }, }) - const queryResults = createQueries({ queries: [options] }) + const queryResults = createQueries({ queries: () => [options] }) - const data = get(queryResults)[0].data + const data = queryResults[0].data expectTypeOf(data).toEqualTypeOf<{ wow: boolean }>() }) @@ -28,11 +27,9 @@ describe('createQueries', () => { test('Allow custom hooks using UseQueryOptions', () => { type Data = string - const useCustomQueries = ( - options?: OmitKeyof, 'queryKey' | 'queryFn'>, - ) => { + const useCustomQueries = (options?: CreateQueryOptions) => { return createQueries({ - queries: [ + queries: () => [ { ...options, queryKey: ['todos-key'], @@ -43,14 +40,14 @@ describe('createQueries', () => { } const query = useCustomQueries() - const data = get(query)[0].data + const data = query[0].data expectTypeOf(data).toEqualTypeOf() }) test('TData should have correct type when conditional skipToken is passed', () => { const queryResults = createQueries({ - queries: [ + queries: () => [ { queryKey: ['withSkipToken'], queryFn: Math.random() > 0.5 ? skipToken : () => Promise.resolve(5), @@ -58,7 +55,7 @@ describe('createQueries', () => { ], }) - const firstResult = get(queryResults)[0] + const firstResult = queryResults[0] expectTypeOf(firstResult).toEqualTypeOf< QueryObserverResult diff --git a/packages/svelte-query/tests/createQueries/createQueries.test.ts b/packages/svelte-query/tests/createQueries/createQueries.test.ts index c8efa1f08d..bd0c098e70 100644 --- a/packages/svelte-query/tests/createQueries/createQueries.test.ts +++ b/packages/svelte-query/tests/createQueries/createQueries.test.ts @@ -1,7 +1,7 @@ import { describe, expect, test } from 'vitest' import { render, waitFor } from '@testing-library/svelte' import { QueryClient } from '@tanstack/query-core' -import { sleep } from '../utils.js' +import { sleep } from '../utils.svelte.js' import BaseExample from './BaseExample.svelte' import CombineExample from './CombineExample.svelte' @@ -10,7 +10,7 @@ describe('createQueries', () => { const rendered = render(BaseExample, { props: { options: { - queries: [ + queries: () => [ { queryKey: ['key-1'], queryFn: async () => { diff --git a/packages/svelte-query/tests/createQuery/BaseExample.svelte b/packages/svelte-query/tests/createQuery/BaseExample.svelte index d7a824c26b..030b205e57 100644 --- a/packages/svelte-query/tests/createQuery/BaseExample.svelte +++ b/packages/svelte-query/tests/createQuery/BaseExample.svelte @@ -1,18 +1,28 @@ -
Status: {$query.status}
-
Failure Count: {$query.failureCount}
-
Data: {$query.data ?? 'undefined'}
+
Status: {query.status}
+
Failure Count: {query.failureCount}
+
Data: {query.data ?? 'undefined'}
diff --git a/packages/svelte-query/tests/createQuery/DisabledExample.svelte b/packages/svelte-query/tests/createQuery/DisabledExample.svelte index 3d50a2d73c..97beac8795 100644 --- a/packages/svelte-query/tests/createQuery/DisabledExample.svelte +++ b/packages/svelte-query/tests/createQuery/DisabledExample.svelte @@ -1,31 +1,39 @@ - + -
Data: {$query.data ?? 'undefined'}
-
Count: {$count}
+
Data: {query.data ?? 'undefined'}
+
Count: {count}
diff --git a/packages/svelte-query/tests/createQuery/PlaceholderData.svelte b/packages/svelte-query/tests/createQuery/PlaceholderData.svelte index 5b9737e731..4c6781682d 100644 --- a/packages/svelte-query/tests/createQuery/PlaceholderData.svelte +++ b/packages/svelte-query/tests/createQuery/PlaceholderData.svelte @@ -1,30 +1,39 @@ - + -
Status: {$query.status}
-
Data: {$query.data ?? 'undefined'}
+
Status: {query.status}
+
Data: {query.data ?? 'undefined'}
diff --git a/packages/svelte-query/tests/createQuery/RefetchExample.svelte b/packages/svelte-query/tests/createQuery/RefetchExample.svelte index 8a4adb4b5f..45b445dd76 100644 --- a/packages/svelte-query/tests/createQuery/RefetchExample.svelte +++ b/packages/svelte-query/tests/createQuery/RefetchExample.svelte @@ -1,32 +1,40 @@ - - + -
Data: {$query.data ?? 'undefined'}
+
Data: {query.data ?? 'undefined'}
diff --git a/packages/svelte-query/tests/createQuery/createQuery.test.ts b/packages/svelte-query/tests/createQuery/createQuery.svelte.test.ts similarity index 76% rename from packages/svelte-query/tests/createQuery/createQuery.test.ts rename to packages/svelte-query/tests/createQuery/createQuery.svelte.test.ts index 11b09fd69c..f01a21db4f 100644 --- a/packages/svelte-query/tests/createQuery/createQuery.test.ts +++ b/packages/svelte-query/tests/createQuery/createQuery.svelte.test.ts @@ -1,18 +1,16 @@ import { describe, expect, test } from 'vitest' import { fireEvent, render, waitFor } from '@testing-library/svelte' -import { derived, get, writable } from 'svelte/store' import { QueryClient } from '@tanstack/query-core' -import { sleep } from '../utils.js' +import { ref, sleep } from '../utils.svelte.js' import BaseExample from './BaseExample.svelte' import DisabledExample from './DisabledExample.svelte' import PlaceholderData from './PlaceholderData.svelte' import RefetchExample from './RefetchExample.svelte' -import type { Writable } from 'svelte/store' import type { QueryObserverResult } from '@tanstack/query-core' describe('createQuery', () => { test('Return the correct states for a successful query', async () => { - const statesStore: Writable> = writable([]) + let states = ref>([]) const options = { queryKey: ['test'], @@ -24,9 +22,9 @@ describe('createQuery', () => { const rendered = render(BaseExample, { props: { - options, + options: () => options, queryClient: new QueryClient(), - states: statesStore, + states, }, }) @@ -34,11 +32,9 @@ describe('createQuery', () => { expect(rendered.queryByText('Status: success')).toBeInTheDocument() }) - const states = get(statesStore) + expect(states.value).toHaveLength(2) - expect(states).toHaveLength(2) - - expect(states[0]).toMatchObject({ + expect(states.value[0]).toMatchObject({ data: undefined, dataUpdatedAt: 0, error: null, @@ -65,7 +61,7 @@ describe('createQuery', () => { fetchStatus: 'fetching', }) - expect(states[1]).toMatchObject({ + expect(states.value[1]).toMatchObject({ data: 'Success', dataUpdatedAt: expect.any(Number), error: null, @@ -94,7 +90,7 @@ describe('createQuery', () => { }) test('Return the correct states for an unsuccessful query', async () => { - const statesStore: Writable> = writable([]) + let states = ref>([]) const options = { queryKey: ['test'], @@ -105,19 +101,17 @@ describe('createQuery', () => { const rendered = render(BaseExample, { props: { - options, + options: () => options, queryClient: new QueryClient(), - states: statesStore, + states, }, }) await waitFor(() => rendered.getByText('Status: error')) - const states = get(statesStore) - - expect(states).toHaveLength(3) + expect(states.value).toHaveLength(3) - expect(states[0]).toMatchObject({ + expect(states.value[0]).toMatchObject({ data: undefined, dataUpdatedAt: 0, error: null, @@ -144,7 +138,7 @@ describe('createQuery', () => { fetchStatus: 'fetching', }) - expect(states[1]).toMatchObject({ + expect(states.value[1]).toMatchObject({ data: undefined, dataUpdatedAt: 0, error: null, @@ -171,7 +165,7 @@ describe('createQuery', () => { fetchStatus: 'fetching', }) - expect(states[2]).toMatchObject({ + expect(states.value[2]).toMatchObject({ data: undefined, dataUpdatedAt: 0, error: new Error('Rejected'), @@ -200,21 +194,21 @@ describe('createQuery', () => { }) test('Accept a writable store for options', async () => { - const statesStore: Writable> = writable([]) + let states = ref>([]) - const optionsStore = writable({ + const optionsStore = $state(() => ({ queryKey: ['test'], queryFn: async () => { await sleep(5) return 'Success' }, - }) + })) const rendered = render(BaseExample, { props: { options: optionsStore, queryClient: new QueryClient(), - states: statesStore, + states, }, }) @@ -224,12 +218,12 @@ describe('createQuery', () => { }) test('Accept a derived store for options', async () => { - const statesStore: Writable> = writable([]) + let states = ref>([]) - const writableStore = writable('test') + const writableStore = $state('test') - const derivedStore = derived(writableStore, ($store) => ({ - queryKey: [$store], + const derivedStore = $derived(() => ({ + queryKey: [writableStore], queryFn: async () => { await sleep(5) return 'Success' @@ -240,7 +234,7 @@ describe('createQuery', () => { props: { options: derivedStore, queryClient: new QueryClient(), - states: statesStore, + states, }, }) @@ -250,15 +244,15 @@ describe('createQuery', () => { }) test('Ensure reactivity when queryClient defaults are set', async () => { - const statesStore: Writable> = writable([]) + let states = ref>([]) - const writableStore = writable(1) + let writableStore = $state(1) - const derivedStore = derived(writableStore, ($store) => ({ - queryKey: [$store], + const derivedStore = $derived(() => ({ + queryKey: [writableStore], queryFn: async () => { await sleep(5) - return $store + return writableStore }, })) @@ -268,7 +262,7 @@ describe('createQuery', () => { queryClient: new QueryClient({ defaultOptions: { queries: { staleTime: 60 * 1000 } }, }), - states: statesStore, + states, }, }) @@ -277,14 +271,14 @@ describe('createQuery', () => { expect(rendered.queryByText('Data: 2')).not.toBeInTheDocument() }) - writableStore.set(2) + writableStore = 2 await waitFor(() => { expect(rendered.queryByText('Data: 1')).not.toBeInTheDocument() expect(rendered.queryByText('Data: 2')).toBeInTheDocument() }) - writableStore.set(1) + writableStore = 1 await waitFor(() => { expect(rendered.queryByText('Data: 1')).toBeInTheDocument() @@ -293,12 +287,12 @@ describe('createQuery', () => { }) test('Keep previous data when placeholderData is set', async () => { - const statesStore: Writable> = writable([]) + let states = ref>([]) const rendered = render(PlaceholderData, { props: { queryClient: new QueryClient(), - states: statesStore, + states, }, }) @@ -308,12 +302,10 @@ describe('createQuery', () => { await waitFor(() => rendered.getByText('Data: 1')) - const states = get(statesStore) - - expect(states).toHaveLength(4) + expect(states.value).toHaveLength(4) // Initial - expect(states[0]).toMatchObject({ + expect(states.value[0]).toMatchObject({ data: undefined, isFetching: true, isSuccess: false, @@ -321,7 +313,7 @@ describe('createQuery', () => { }) // Fetched - expect(states[1]).toMatchObject({ + expect(states.value[1]).toMatchObject({ data: 0, isFetching: false, isSuccess: true, @@ -329,7 +321,7 @@ describe('createQuery', () => { }) // Set state - expect(states[2]).toMatchObject({ + expect(states.value[2]).toMatchObject({ data: 0, isFetching: true, isSuccess: true, @@ -337,7 +329,7 @@ describe('createQuery', () => { }) // New data - expect(states[3]).toMatchObject({ + expect(states.value[3]).toMatchObject({ data: 1, isFetching: false, isSuccess: true, @@ -346,11 +338,11 @@ describe('createQuery', () => { }) test('Should not fetch when switching to a disabled query', async () => { - const statesStore: Writable> = writable([]) + let states = ref>([]) const rendered = render(DisabledExample, { props: { - states: statesStore, + states, }, }) @@ -359,30 +351,28 @@ describe('createQuery', () => { fireEvent.click(rendered.getByRole('button', { name: /Increment/i })) await waitFor(() => { - rendered.getByText('Count: 1') - rendered.getByText('Data: undefined') + rendered.getByText('Count: 0') + rendered.getByText('Data: 0') }) - const states = get(statesStore) - - expect(states).toHaveLength(3) + expect(states.value).toHaveLength(3) // Fetch query - expect(states[0]).toMatchObject({ + expect(states.value[0]).toMatchObject({ data: undefined, isFetching: true, isSuccess: false, }) // Fetched query - expect(states[1]).toMatchObject({ + expect(states.value[1]).toMatchObject({ data: 0, isFetching: false, isSuccess: true, }) // Switch to disabled query - expect(states[2]).toMatchObject({ + expect(states.value[2]).toMatchObject({ data: undefined, isFetching: false, isSuccess: false, @@ -390,11 +380,11 @@ describe('createQuery', () => { }) test('Create a new query when refetching a removed query', async () => { - const statesStore: Writable> = writable([]) + let states = ref>([]) const rendered = render(RefetchExample, { props: { - states: statesStore, + states, }, }) @@ -406,16 +396,14 @@ describe('createQuery', () => { fireEvent.click(rendered.getByRole('button', { name: /Refetch/i })) await waitFor(() => rendered.getByText('Data: 2')) - const states = get(statesStore) - - expect(states.length).toBe(4) + expect(states.value).toHaveLength(4) // Initial - expect(states[0]).toMatchObject({ data: undefined, dataUpdatedAt: 0 }) + expect(states.value[0]).toMatchObject({ data: undefined, dataUpdatedAt: 0 }) // Fetched - expect(states[1]).toMatchObject({ data: 1 }) + expect(states.value[1]).toMatchObject({ data: 1 }) // Switch - expect(states[2]).toMatchObject({ data: undefined, dataUpdatedAt: 0 }) + expect(states.value[2]).toMatchObject({ data: undefined, dataUpdatedAt: 0 }) // Fetched - expect(states[3]).toMatchObject({ data: 2 }) + expect(states.value[3]).toMatchObject({ data: 2 }) }) }) diff --git a/packages/svelte-query/tests/createQuery/createQuery.test-d.ts b/packages/svelte-query/tests/createQuery/createQuery.test-d.ts index 7936758401..eb65c66306 100644 --- a/packages/svelte-query/tests/createQuery/createQuery.test-d.ts +++ b/packages/svelte-query/tests/createQuery/createQuery.test-d.ts @@ -1,18 +1,16 @@ import { describe, expectTypeOf, test } from 'vitest' -import { get } from 'svelte/store' import { createQuery, queryOptions } from '../../src/index.js' -import type { OmitKeyof } from '@tanstack/query-core' import type { CreateQueryOptions } from '../../src/index.js' describe('createQuery', () => { test('TData should always be defined when initialData is provided as an object', () => { - const query = createQuery({ + const query = createQuery(() => ({ queryKey: ['key'], queryFn: () => ({ wow: true }), initialData: { wow: true }, - }) + })) - expectTypeOf(get(query).data).toEqualTypeOf<{ wow: boolean }>() + expectTypeOf(query.data).toEqualTypeOf<{ wow: boolean }>() }) test('TData should be defined when passed through queryOptions', () => { @@ -21,49 +19,47 @@ describe('createQuery', () => { queryFn: () => ({ wow: true }), initialData: { wow: true }, }) - const query = createQuery(options) + const query = createQuery(() => options) - expectTypeOf(get(query).data).toEqualTypeOf<{ wow: boolean }>() + expectTypeOf(query.data).toEqualTypeOf<{ wow: boolean }>() }) test('TData should always be defined when initialData is provided as a function which ALWAYS returns the data', () => { - const query = createQuery({ + const query = createQuery(() => ({ queryKey: ['key'], queryFn: () => ({ wow: true }), initialData: () => ({ wow: true }), - }) + })) - expectTypeOf(get(query).data).toEqualTypeOf<{ wow: boolean }>() + expectTypeOf(query.data).toEqualTypeOf<{ wow: boolean }>() }) test('TData should have undefined in the union when initialData is NOT provided', () => { - const query = createQuery({ + const query = createQuery(() => ({ queryKey: ['key'], queryFn: () => { return { wow: true, } }, - }) + })) - expectTypeOf(get(query).data).toEqualTypeOf<{ wow: boolean } | undefined>() + expectTypeOf(query.data).toEqualTypeOf<{ wow: boolean } | undefined>() }) test('Allow custom hooks using CreateQueryOptions', () => { type Data = string - const useCustomQuery = ( - options?: OmitKeyof, 'queryKey' | 'queryFn'>, - ) => { - return createQuery({ + const useCustomQuery = (options?: CreateQueryOptions) => { + return createQuery(() => ({ ...options, queryKey: ['todos-key'], queryFn: () => Promise.resolve('data'), - }) + })) } const query = useCustomQuery() - expectTypeOf(get(query).data).toEqualTypeOf() + expectTypeOf(query.data).toEqualTypeOf() }) }) diff --git a/packages/svelte-query/tests/infiniteQueryOptions/infiniteQueryOptions.test-d.ts b/packages/svelte-query/tests/infiniteQueryOptions/infiniteQueryOptions.test-d.ts index 45f98dd085..8cec61e6ea 100644 --- a/packages/svelte-query/tests/infiniteQueryOptions/infiniteQueryOptions.test-d.ts +++ b/packages/svelte-query/tests/infiniteQueryOptions/infiniteQueryOptions.test-d.ts @@ -1,5 +1,4 @@ import { describe, expectTypeOf, test } from 'vitest' -import { get } from 'svelte/store' import { QueryClient } from '@tanstack/query-core' import { createInfiniteQuery, infiniteQueryOptions } from '../../src/index.js' import type { InfiniteData } from '@tanstack/query-core' @@ -37,10 +36,10 @@ describe('queryOptions', () => { initialPageParam: 1, }) - const query = createInfiniteQuery(options) + const query = createInfiniteQuery(() => options) // known issue: type of pageParams is unknown when returned from useInfiniteQuery - expectTypeOf(get(query).data).toEqualTypeOf< + expectTypeOf(query.data).toEqualTypeOf< InfiniteData | undefined >() }) diff --git a/packages/svelte-query/tests/queryOptions/queryOptions.test-d.ts b/packages/svelte-query/tests/queryOptions/queryOptions.test-d.ts index 8562a7c227..f27b56823c 100644 --- a/packages/svelte-query/tests/queryOptions/queryOptions.test-d.ts +++ b/packages/svelte-query/tests/queryOptions/queryOptions.test-d.ts @@ -1,5 +1,4 @@ import { describe, expectTypeOf, test } from 'vitest' -import { get } from 'svelte/store' import { QueriesObserver, QueryClient, @@ -47,10 +46,10 @@ describe('queryOptions', () => { }) const queries = createQueries({ - queries: [options], + queries: () => [options], }) - expectTypeOf(get(queries)[0].data).toEqualTypeOf() + expectTypeOf(queries[0].data).toEqualTypeOf() }) test('Should tag the queryKey with the result type of the QueryFn', () => { diff --git a/packages/svelte-query/tests/useIsFetching/BaseExample.svelte b/packages/svelte-query/tests/useIsFetching/BaseExample.svelte index 0e0919bef1..5e67704dfd 100644 --- a/packages/svelte-query/tests/useIsFetching/BaseExample.svelte +++ b/packages/svelte-query/tests/useIsFetching/BaseExample.svelte @@ -1,27 +1,27 @@ - + -
isFetching: {$isFetching}
-
Data: {$query.data ?? 'undefined'}
+
isFetching: {isFetching()}
+
Data: {query.data ?? 'undefined'}
diff --git a/packages/svelte-query/tests/useIsFetching/useIsFetching.test.ts b/packages/svelte-query/tests/useIsFetching/useIsFetching.test.ts index 7ca6ca6322..6420dfdfd3 100644 --- a/packages/svelte-query/tests/useIsFetching/useIsFetching.test.ts +++ b/packages/svelte-query/tests/useIsFetching/useIsFetching.test.ts @@ -1,5 +1,5 @@ import { describe, test } from 'vitest' -import { fireEvent, render } from '@testing-library/svelte' +import { fireEvent, render, waitFor } from '@testing-library/svelte' import BaseExample from './BaseExample.svelte' describe('useIsFetching', () => { @@ -8,7 +8,10 @@ describe('useIsFetching', () => { await rendered.findByText('isFetching: 0') fireEvent.click(rendered.getByRole('button', { name: /setReady/i })) - await rendered.findByText('isFetching: 1') - await rendered.findByText('isFetching: 0') + + waitFor(async () => { + await rendered.findByText('isFetching: 1') + await rendered.findByText('isFetching: 0') + }) }) }) diff --git a/packages/svelte-query/tests/useIsMutating/BaseExample.svelte b/packages/svelte-query/tests/useIsMutating/BaseExample.svelte index b144393de4..42ae0416e7 100644 --- a/packages/svelte-query/tests/useIsMutating/BaseExample.svelte +++ b/packages/svelte-query/tests/useIsMutating/BaseExample.svelte @@ -1,23 +1,24 @@ - + -
isMutating: {$isMutating}
+
isMutating: {isMutating()}
diff --git a/packages/svelte-query/tests/useMutationState/BaseExample.svelte b/packages/svelte-query/tests/useMutationState/BaseExample.svelte index ce85130099..b65cd41371 100644 --- a/packages/svelte-query/tests/useMutationState/BaseExample.svelte +++ b/packages/svelte-query/tests/useMutationState/BaseExample.svelte @@ -1,18 +1,23 @@
{JSON.stringify(statuses)}
- - diff --git a/packages/svelte-query/tests/useMutationState/useMutationState.test.ts b/packages/svelte-query/tests/useMutationState/useMutationState.test.ts index c2190cfb14..1bf779b02e 100644 --- a/packages/svelte-query/tests/useMutationState/useMutationState.test.ts +++ b/packages/svelte-query/tests/useMutationState/useMutationState.test.ts @@ -12,15 +12,15 @@ describe('useMutationState', () => { const rendered = render(BaseExample, { props: { - successMutationOpts: { + successMutationOpts: () => ({ mutationKey: ['success'], mutationFn: successMutationFn, - }, + }), - errorMutationOpts: { + errorMutationOpts: () => ({ mutationKey: ['error'], mutationFn: errorMutationFn, - }, + }), }, }) @@ -49,15 +49,15 @@ describe('useMutationState', () => { const rendered = render(BaseExample, { props: { - successMutationOpts: { + successMutationOpts: () => ({ mutationKey: ['success'], mutationFn: successMutationFn, - }, + }), - errorMutationOpts: { + errorMutationOpts: () => ({ mutationKey: ['error'], mutationFn: errorMutationFn, - }, + }), mutationStateOpts: { filters: { status: 'error' }, @@ -88,15 +88,15 @@ describe('useMutationState', () => { const rendered = render(BaseExample, { props: { - successMutationOpts: { + successMutationOpts: () => ({ mutationKey: ['success'], mutationFn: successMutationFn, - }, + }), - errorMutationOpts: { + errorMutationOpts: () => ({ mutationKey: ['error'], mutationFn: errorMutationFn, - }, + }), mutationStateOpts: { filters: { mutationKey: ['success'] }, diff --git a/packages/svelte-query/tests/utils.svelte.ts b/packages/svelte-query/tests/utils.svelte.ts new file mode 100644 index 0000000000..c31dde0389 --- /dev/null +++ b/packages/svelte-query/tests/utils.svelte.ts @@ -0,0 +1,18 @@ +export function sleep(timeout: number): Promise { + return new Promise((resolve, _reject) => { + setTimeout(resolve, timeout) + }) +} + +export function ref(initial: T) { + let value = $state(initial) + + return { + get value() { + return value + }, + set value(newValue) { + value = newValue + }, + } +} diff --git a/packages/svelte-query/tests/utils.ts b/packages/svelte-query/tests/utils.ts deleted file mode 100644 index 1a3a619a22..0000000000 --- a/packages/svelte-query/tests/utils.ts +++ /dev/null @@ -1,5 +0,0 @@ -export function sleep(timeout: number): Promise { - return new Promise((resolve, _reject) => { - setTimeout(resolve, timeout) - }) -} diff --git a/packages/svelte-query/vite.config.ts b/packages/svelte-query/vite.config.ts index dd97e6948a..443e0f3541 100644 --- a/packages/svelte-query/vite.config.ts +++ b/packages/svelte-query/vite.config.ts @@ -11,8 +11,12 @@ export default defineConfig({ watch: false, environment: 'jsdom', setupFiles: ['./tests/test-setup.ts'], - coverage: { enabled: true, provider: 'istanbul', include: ['src/**/*'] }, + coverage: { enabled: false, provider: 'istanbul', include: ['src/**/*'] }, typecheck: { enabled: true }, - restoreMocks: true, + alias: { + // This is needed for svelte-5 support + // https://github.com/testing-library/svelte-testing-library?tab=readme-ov-file#svelte-5-support + '@testing-library/svelte': '@testing-library/svelte/svelte5', + }, }, }) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index fc94bd1ed8..63399b30be 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -72,7 +72,7 @@ importers: version: 3.3.3 prettier-plugin-svelte: specifier: ^3.3.2 - version: 3.3.2(prettier@3.3.3)(svelte@4.2.19) + version: 3.3.2(prettier@3.3.3)(svelte@5.1.9) publint: specifier: ^0.2.12 version: 0.2.12 @@ -1481,19 +1481,19 @@ importers: devDependencies: '@sveltejs/adapter-auto': specifier: ^3.2.3 - version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) + version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) '@sveltejs/kit': specifier: ^2.8.2 - version: 2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + version: 2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) '@sveltejs/vite-plugin-svelte': - specifier: ^3.1.2 - version: 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + specifier: ^4.0.0 + version: 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) svelte: - specifier: ^4.2.18 - version: 4.2.19 + specifier: ^5.0.0 + version: 5.1.9 svelte-check: specifier: ^4.0.0 - version: 4.0.0(picomatch@4.0.2)(svelte@4.2.19)(typescript@5.7.2) + version: 4.0.0(picomatch@4.0.2)(svelte@5.1.9)(typescript@5.7.2) typescript: specifier: 5.7.2 version: 5.7.2 @@ -1518,19 +1518,19 @@ importers: devDependencies: '@sveltejs/adapter-auto': specifier: ^3.2.3 - version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) + version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) '@sveltejs/kit': specifier: ^2.8.2 - version: 2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + version: 2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) '@sveltejs/vite-plugin-svelte': - specifier: ^3.1.2 - version: 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + specifier: ^4.0.0 + version: 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) svelte: - specifier: ^4.2.18 - version: 4.2.19 + specifier: ^5.0.0 + version: 5.1.9 svelte-check: specifier: ^4.0.0 - version: 4.0.0(picomatch@4.0.2)(svelte@4.2.19)(typescript@5.7.2) + version: 4.0.0(picomatch@4.0.2)(svelte@5.1.9)(typescript@5.7.2) typescript: specifier: 5.7.2 version: 5.7.2 @@ -1549,19 +1549,19 @@ importers: devDependencies: '@sveltejs/adapter-auto': specifier: ^3.2.3 - version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) + version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) '@sveltejs/kit': specifier: ^2.8.2 - version: 2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + version: 2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) '@sveltejs/vite-plugin-svelte': - specifier: ^3.1.2 - version: 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + specifier: ^4.0.0 + version: 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) svelte: - specifier: ^4.2.18 - version: 4.2.19 + specifier: ^5.0.0 + version: 5.1.9 svelte-check: specifier: ^4.0.0 - version: 4.0.0(picomatch@4.0.2)(svelte@4.2.19)(typescript@5.7.2) + version: 4.0.0(picomatch@4.0.2)(svelte@5.1.9)(typescript@5.7.2) typescript: specifier: 5.7.2 version: 5.7.2 @@ -1580,19 +1580,19 @@ importers: devDependencies: '@sveltejs/adapter-auto': specifier: ^3.2.3 - version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) + version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) '@sveltejs/kit': specifier: ^2.8.2 - version: 2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + version: 2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) '@sveltejs/vite-plugin-svelte': - specifier: ^3.1.2 - version: 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + specifier: ^4.0.0 + version: 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) svelte: - specifier: ^4.2.18 - version: 4.2.19 + specifier: ^5.0.0 + version: 5.1.9 svelte-check: specifier: ^4.0.0 - version: 4.0.0(picomatch@4.0.2)(svelte@4.2.19)(typescript@5.7.2) + version: 4.0.0(picomatch@4.0.2)(svelte@5.1.9)(typescript@5.7.2) typescript: specifier: 5.7.2 version: 5.7.2 @@ -1611,19 +1611,19 @@ importers: devDependencies: '@sveltejs/adapter-auto': specifier: ^3.2.3 - version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) + version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) '@sveltejs/kit': specifier: ^2.8.2 - version: 2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + version: 2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) '@sveltejs/vite-plugin-svelte': - specifier: ^3.1.2 - version: 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + specifier: ^4.0.0 + version: 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) svelte: - specifier: ^4.2.18 - version: 4.2.19 + specifier: ^5.0.0 + version: 5.1.9 svelte-check: specifier: ^4.0.0 - version: 4.0.0(picomatch@4.0.2)(svelte@4.2.19)(typescript@5.7.2) + version: 4.0.0(picomatch@4.0.2)(svelte@5.1.9)(typescript@5.7.2) typescript: specifier: 5.7.2 version: 5.7.2 @@ -1641,17 +1641,17 @@ importers: version: link:../../../packages/svelte-query-devtools devDependencies: '@sveltejs/vite-plugin-svelte': - specifier: ^3.1.2 - version: 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + specifier: ^4.0.0 + version: 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) '@tsconfig/svelte': specifier: ^5.0.4 version: 5.0.4 svelte: - specifier: ^4.2.18 - version: 4.2.19 + specifier: ^5.0.0 + version: 5.1.9 svelte-check: specifier: ^4.0.0 - version: 4.0.0(picomatch@4.0.2)(svelte@4.2.19)(typescript@5.7.2) + version: 4.0.0(picomatch@4.0.2)(svelte@5.1.9)(typescript@5.7.2) typescript: specifier: 5.7.2 version: 5.7.2 @@ -1670,19 +1670,19 @@ importers: devDependencies: '@sveltejs/adapter-auto': specifier: ^3.2.3 - version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) + version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) '@sveltejs/kit': specifier: ^2.8.2 - version: 2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + version: 2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) '@sveltejs/vite-plugin-svelte': - specifier: ^3.1.2 - version: 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + specifier: ^4.0.0 + version: 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) svelte: - specifier: ^4.2.18 - version: 4.2.19 + specifier: ^5.0.0 + version: 5.1.9 svelte-check: specifier: ^4.0.0 - version: 4.0.0(picomatch@4.0.2)(svelte@4.2.19)(typescript@5.7.2) + version: 4.0.0(picomatch@4.0.2)(svelte@5.1.9)(typescript@5.7.2) typescript: specifier: 5.7.2 version: 5.7.2 @@ -1701,13 +1701,13 @@ importers: devDependencies: '@sveltejs/adapter-auto': specifier: ^3.2.3 - version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) + version: 3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))) '@sveltejs/kit': specifier: ^2.8.2 - version: 2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + version: 2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) '@sveltejs/vite-plugin-svelte': - specifier: ^3.1.2 - version: 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + specifier: ^4.0.0 + version: 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) autoprefixer: specifier: ^10.4.20 version: 10.4.20(postcss@8.4.49) @@ -1715,11 +1715,11 @@ importers: specifier: ^8.4.49 version: 8.4.49 svelte: - specifier: ^4.2.18 - version: 4.2.19 + specifier: ^5.0.0 + version: 5.1.9 svelte-check: specifier: ^4.0.0 - version: 4.0.0(picomatch@4.0.2)(svelte@4.2.19)(typescript@5.7.2) + version: 4.0.0(picomatch@4.0.2)(svelte@5.1.9)(typescript@5.7.2) tailwindcss: specifier: ^3.4.7 version: 3.4.7 @@ -2048,8 +2048,8 @@ importers: integrations/svelte-vite: devDependencies: '@sveltejs/vite-plugin-svelte': - specifier: ^3.1.2 - version: 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + specifier: ^4.0.0 + version: 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) '@tanstack/svelte-query': specifier: workspace:* version: link:../../packages/svelte-query @@ -2057,8 +2057,8 @@ importers: specifier: workspace:* version: link:../../packages/svelte-query-devtools svelte: - specifier: ^4.2.18 - version: 4.2.19 + specifier: ^5.0.0 + version: 5.1.9 vite: specifier: ^5.3.5 version: 5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6) @@ -2426,22 +2426,22 @@ importers: devDependencies: '@sveltejs/package': specifier: ^2.3.7 - version: 2.3.7(svelte@4.2.19)(typescript@5.7.2) + version: 2.3.7(svelte@5.1.9)(typescript@5.7.2) '@sveltejs/vite-plugin-svelte': - specifier: ^3.1.2 - version: 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + specifier: ^4.0.0 + version: 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) '@testing-library/svelte': specifier: ^5.2.6 - version: 5.2.6(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))(vitest@2.0.5(@types/node@22.9.3)(jsdom@25.0.1)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + version: 5.2.6(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))(vitest@2.0.5(@types/node@22.9.3)(jsdom@25.0.1)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) eslint-plugin-svelte: specifier: ^2.46.0 - version: 2.46.0(eslint@9.15.0(jiti@2.4.0))(svelte@4.2.19) + version: 2.46.0(eslint@9.15.0(jiti@2.4.0))(svelte@5.1.9) svelte: - specifier: ^4.2.18 - version: 4.2.19 + specifier: ^5.0.0 + version: 5.1.9 svelte-check: specifier: ^4.0.0 - version: 4.0.0(picomatch@4.0.2)(svelte@4.2.19)(typescript@5.7.2) + version: 4.0.0(picomatch@4.0.2)(svelte@5.1.9)(typescript@5.7.2) packages/svelte-query-devtools: dependencies: @@ -2454,22 +2454,22 @@ importers: devDependencies: '@sveltejs/package': specifier: ^2.3.7 - version: 2.3.7(svelte@4.2.19)(typescript@5.7.2) + version: 2.3.7(svelte@5.1.9)(typescript@5.7.2) '@sveltejs/vite-plugin-svelte': - specifier: ^3.1.2 - version: 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + specifier: ^4.0.0 + version: 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) '@tanstack/svelte-query': specifier: workspace:* version: link:../svelte-query eslint-plugin-svelte: specifier: ^2.46.0 - version: 2.46.0(eslint@9.15.0(jiti@2.4.0))(svelte@4.2.19) + version: 2.46.0(eslint@9.15.0(jiti@2.4.0))(svelte@5.1.9) svelte: - specifier: ^4.2.18 - version: 4.2.19 + specifier: ^5.0.0 + version: 5.1.9 svelte-check: specifier: ^4.0.0 - version: 4.0.0(picomatch@4.0.2)(svelte@4.2.19)(typescript@5.7.2) + version: 4.0.0(picomatch@4.0.2)(svelte@5.1.9)(typescript@5.7.2) packages/svelte-query-persist-client: dependencies: @@ -2479,25 +2479,25 @@ importers: devDependencies: '@sveltejs/package': specifier: ^2.3.7 - version: 2.3.7(svelte@4.2.19)(typescript@5.7.2) + version: 2.3.7(svelte@5.1.9)(typescript@5.7.2) '@sveltejs/vite-plugin-svelte': - specifier: ^3.1.2 - version: 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + specifier: ^4.0.0 + version: 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) '@tanstack/svelte-query': specifier: workspace:* version: link:../svelte-query '@testing-library/svelte': specifier: ^5.2.6 - version: 5.2.6(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))(vitest@2.0.5(@types/node@22.9.3)(jsdom@25.0.1)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + version: 5.2.6(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))(vitest@2.0.5(@types/node@22.9.3)(jsdom@25.0.1)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) eslint-plugin-svelte: specifier: ^2.46.0 - version: 2.46.0(eslint@9.15.0(jiti@2.4.0))(svelte@4.2.19) + version: 2.46.0(eslint@9.15.0(jiti@2.4.0))(svelte@5.1.9) svelte: - specifier: ^4.2.18 - version: 4.2.19 + specifier: ^5.0.0 + version: 5.1.9 svelte-check: specifier: ^4.0.0 - version: 4.0.0(picomatch@4.0.2)(svelte@4.2.19)(typescript@5.7.2) + version: 4.0.0(picomatch@4.0.2)(svelte@5.1.9)(typescript@5.7.2) packages/vue-query: dependencies: @@ -6996,19 +6996,19 @@ packages: peerDependencies: svelte: ^3.44.0 || ^4.0.0 || ^5.0.0-next.1 - '@sveltejs/vite-plugin-svelte-inspector@2.1.0': - resolution: {integrity: sha512-9QX28IymvBlSCqsCll5t0kQVxipsfhFFL+L2t3nTWfXnddYwxBuAEtTtlaVQpRz9c37BhJjltSeY4AJSC03SSg==} - engines: {node: ^18.0.0 || >=20} + '@sveltejs/vite-plugin-svelte-inspector@3.0.1': + resolution: {integrity: sha512-2CKypmj1sM4GE7HjllT7UKmo4Q6L5xFRd7VMGEWhYnZ+wc6AUVU01IBd7yUi6WnFndEwWoMNOd6e8UjoN0nbvQ==} + engines: {node: ^18.0.0 || ^20.0.0 || >=22} peerDependencies: - '@sveltejs/vite-plugin-svelte': ^3.0.0 - svelte: ^4.0.0 || ^5.0.0-next.0 + '@sveltejs/vite-plugin-svelte': ^4.0.0-next.0||^4.0.0 + svelte: ^5.0.0-next.96 || ^5.0.0 vite: ^5.0.0 - '@sveltejs/vite-plugin-svelte@3.1.2': - resolution: {integrity: sha512-Txsm1tJvtiYeLUVRNqxZGKR/mI+CzuIQuc2gn+YCs9rMTowpNZ2Nqt53JdL8KF9bLhAf2ruR/dr9eZCwdTriRA==} - engines: {node: ^18.0.0 || >=20} + '@sveltejs/vite-plugin-svelte@4.0.3': + resolution: {integrity: sha512-J7nC5gT5qpmvyD2pmzPUntLUgoinyEaNy9sTpGGE6N7pblggO0A1NyneJJvR2ELlzK6ti28aF2SLXG1yJdnJeA==} + engines: {node: ^18.0.0 || ^20.0.0 || >=22} peerDependencies: - svelte: ^4.0.0 || ^5.0.0-next.0 + svelte: ^5.0.0-next.96 || ^5.0.0 vite: ^5.0.0 '@swc/counter@0.1.3': @@ -8739,9 +8739,6 @@ packages: code-block-writer@12.0.0: resolution: {integrity: sha512-q4dMFMlXtKR3XNBHyMHt/3pwYNA69EDk00lloMOaaUMKPUXBw6lpXtbu3MMVG6/uOihGnRDOlkyqsONEUj60+w==} - code-red@1.0.4: - resolution: {integrity: sha512-7qJWqItLA8/VPVlKJlFXU+NBlo/qyfs39aJcuMT/2ere32ZqvF5OSxgdM5xOfJJ7O429gg2HM47y8v9P+9wrNw==} - collection-visit@1.0.0: resolution: {integrity: sha512-lNkKvzEeMBBjUGHZ+q6z9pSJla0KWAQPvtzhEV9+iGyQYG+pBpl7xKDhxoNSOZH2hhv0v5k0y2yAM4o4SjoSkw==} engines: {node: '>=0.10.0'} @@ -9014,7 +9011,6 @@ packages: critters@0.0.24: resolution: {integrity: sha512-Oyqew0FGM0wYUSNqR0L6AteO5MpMoUU0rhKRieXeiKs+PmRTxiJMyaunYB2KF6fQ3dzChXKCpbFOEJx3OQ1v/Q==} - deprecated: Ownership of Critters has moved to the Nuxt team, who will be maintaining the project going forward. If you'd like to keep using Critters, please switch to the actively-maintained fork at https://github.com/danielroe/beasties croner@8.1.0: resolution: {integrity: sha512-sz990XOUPR8dG/r5BRKMBd15MYDDUu8oeSaxFD5DqvNgHSZw8Psd1s689/IGET7ezxRMiNlCIyGeY1Gvxp/MLg==} @@ -9119,10 +9115,6 @@ packages: css-select@5.1.0: resolution: {integrity: sha512-nwoRF1rvRRnnCqqY7updORDsuqKzqYJ28+oSMaJMMgOauh3fvwHqMS7EZpIPqK8GL+g9mKxF1vP/ZjSeNjEVHg==} - css-tree@2.3.1: - resolution: {integrity: sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==} - engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0} - css-vendor@2.0.8: resolution: {integrity: sha512-x9Aq0XTInxrkuFeHKbYC7zWY8ai7qJ04Kxd9MnvbC1uO5DagxoHQjm4JvG+vCdXOoFtCjbL2XSZfxmoYa9uQVQ==} @@ -9871,6 +9863,9 @@ packages: resolution: {integrity: sha512-ca9pw9fomFcKPvFLXhBKUK90ZvGibiGOvRJNbjljY7s7uq/5YO4BOzcYtJqExdx99rF6aAcnRxHmcUHcz6sQsg==} engines: {node: '>=0.10'} + esrap@1.2.2: + resolution: {integrity: sha512-F2pSJklxx1BlQIQgooczXCPHmcWpn6EsP5oo73LQfonG9fIlIENQ8vMmfGXeojP9MrkzUNAfyU5vdFlR9shHAw==} + esrecurse@4.3.0: resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==} engines: {node: '>=4.0'} @@ -12048,9 +12043,6 @@ packages: mdast-util-to-string@4.0.0: resolution: {integrity: sha512-0H44vDimn51F0YwvxSJSm0eCDOJTRlmN0R1yBh4HLj9wiV1Dn0QoXGbvFAWj2hSItVTlCmBF1hqKlIyUBVFLPg==} - mdn-data@2.0.30: - resolution: {integrity: sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==} - mdurl@2.0.0: resolution: {integrity: sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==} @@ -13251,9 +13243,6 @@ packages: performance-now@2.1.0: resolution: {integrity: sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow==} - periscopic@3.1.0: - resolution: {integrity: sha512-vKiQ8RRtkl9P+r/+oefh25C3fhybptkHKCZSPlcXiJux2tJF55GnEj3BVn4A5gKfq9NWWXXrxkHBwVPUfH0opw==} - picocolors@1.1.1: resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==} @@ -14990,21 +14979,15 @@ packages: svelte: optional: true - svelte-hmr@0.16.0: - resolution: {integrity: sha512-Gyc7cOS3VJzLlfj7wKS0ZnzDVdv3Pn2IuVeJPk9m2skfhcu5bq3wtIZyQGggr7/Iim5rH5cncyQft/kRLupcnA==} - engines: {node: ^12.20 || ^14.13.1 || >= 16} - peerDependencies: - svelte: ^3.19.0 || ^4.0.0 - svelte2tsx@0.7.28: resolution: {integrity: sha512-TJjA+kU8AnkyoprZPgQACMfTX8N0MA5NsIL//h9IuHOxmmaCLluqhcZU+fCkWipi5c/pooHLFOMpqjhq4v7JLQ==} peerDependencies: svelte: ^3.55 || ^4.0.0-next.0 || ^4.0 || ^5.0.0-next.0 typescript: ^4.9.4 || ^5.0.0 - svelte@4.2.19: - resolution: {integrity: sha512-IY1rnGr6izd10B0A8LqsBfmlT5OILVuZ7XsI0vdGPEvuonFV7NYEUK4dAkm9Zg2q0Um92kYjTpS1CAP3Nh/KWw==} - engines: {node: '>=16'} + svelte@5.1.9: + resolution: {integrity: sha512-nzq+PPKGS2PoEWDjAcXSrKSbXmmmOAxd6dAz1IhRusUpVkFS6DMELWPyBPGwu6TpO/gsgtFXwX0M4+pAR5gzKw==} + engines: {node: '>=18'} symbol-observable@4.0.0: resolution: {integrity: sha512-b19dMThMV4HVFynSAM1++gBHAbk2Tc/osgLIBZMKsyqh34jb2e8Os7T6ZW/Bt3pJFdBTd2JwAnAAEQV7rSNvcQ==} @@ -16616,6 +16599,9 @@ packages: resolution: {integrity: sha512-cYVsTjKl8b+FrnidjibDWskAv7UKOfcwaVZdp/it9n1s9fU3IkgDbhdIRKCW4JDsAlECJY0ytoVPT3sK6kideA==} engines: {node: '>=18'} + zimmerframe@1.1.2: + resolution: {integrity: sha512-rAbqEGa8ovJy4pyBxZM70hg4pE6gDgaQ0Sl9M3enG3I0d6H4XSAM3GeNGLKnsBpuijUow064sf7ww1nutC5/3w==} + zip-stream@6.0.1: resolution: {integrity: sha512-zK7YHHz4ZXpW89AHXUPbQVGKI7uvkd3hzusTdotCg1UxyaVtg0zFJSTfW/Dq5f7OBBVnq6cZIaC8Ti4hb6dtCA==} engines: {node: '>= 14'} @@ -22896,14 +22882,14 @@ snapshots: eslint-visitor-keys: 4.2.0 espree: 10.3.0 - '@sveltejs/adapter-auto@3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))': + '@sveltejs/adapter-auto@3.3.1(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))': dependencies: - '@sveltejs/kit': 2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + '@sveltejs/kit': 2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) import-meta-resolve: 4.1.0 - '@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))': + '@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))': dependencies: - '@sveltejs/vite-plugin-svelte': 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + '@sveltejs/vite-plugin-svelte': 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) '@types/cookie': 0.6.0 cookie: 0.6.0 devalue: 5.1.1 @@ -22915,41 +22901,40 @@ snapshots: sade: 1.8.1 set-cookie-parser: 2.7.1 sirv: 3.0.0 - svelte: 4.2.19 + svelte: 5.1.9 tiny-glob: 0.2.9 vite: 5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6) - '@sveltejs/package@2.3.7(svelte@4.2.19)(typescript@5.7.2)': + '@sveltejs/package@2.3.7(svelte@5.1.9)(typescript@5.7.2)': dependencies: chokidar: 4.0.1 kleur: 4.1.5 sade: 1.8.1 semver: 7.6.3 - svelte: 4.2.19 - svelte2tsx: 0.7.28(svelte@4.2.19)(typescript@5.7.2) + svelte: 5.1.9 + svelte2tsx: 0.7.28(svelte@5.1.9)(typescript@5.7.2) transitivePeerDependencies: - typescript - '@sveltejs/vite-plugin-svelte-inspector@2.1.0(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))': + '@sveltejs/vite-plugin-svelte-inspector@3.0.1(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))': dependencies: - '@sveltejs/vite-plugin-svelte': 3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + '@sveltejs/vite-plugin-svelte': 4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) debug: 4.3.7 - svelte: 4.2.19 + svelte: 5.1.9 vite: 5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6) transitivePeerDependencies: - supports-color - '@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))': + '@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))': dependencies: - '@sveltejs/vite-plugin-svelte-inspector': 2.1.0(@sveltejs/vite-plugin-svelte@3.1.2(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + '@sveltejs/vite-plugin-svelte-inspector': 3.0.1(@sveltejs/vite-plugin-svelte@4.0.3(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)))(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) debug: 4.3.7 deepmerge: 4.3.1 kleur: 4.1.5 magic-string: 0.30.13 - svelte: 4.2.19 - svelte-hmr: 0.16.0(svelte@4.2.19) + svelte: 5.1.9 vite: 5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6) - vitefu: 0.2.5(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) + vitefu: 1.0.3(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6)) transitivePeerDependencies: - supports-color @@ -23063,10 +23048,10 @@ snapshots: '@types/react': types-react@19.0.0-rc.1 '@types/react-dom': types-react-dom@19.0.0-rc.1 - '@testing-library/svelte@5.2.6(svelte@4.2.19)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))(vitest@2.0.5(@types/node@22.9.3)(jsdom@25.0.1)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))': + '@testing-library/svelte@5.2.6(svelte@5.1.9)(vite@5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))(vitest@2.0.5(@types/node@22.9.3)(jsdom@25.0.1)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6))': dependencies: '@testing-library/dom': 10.4.0 - svelte: 4.2.19 + svelte: 5.1.9 optionalDependencies: vite: 5.4.11(@types/node@22.9.3)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6) vitest: 2.0.5(@types/node@22.9.3)(jsdom@25.0.1)(less@4.2.1)(lightningcss@1.27.0)(sass@1.81.0)(terser@5.31.6) @@ -25322,14 +25307,6 @@ snapshots: code-block-writer@12.0.0: {} - code-red@1.0.4: - dependencies: - '@jridgewell/sourcemap-codec': 1.5.0 - '@types/estree': 1.0.6 - acorn: 8.14.0 - estree-walker: 3.0.3 - periscopic: 3.1.0 - collection-visit@1.0.0: dependencies: map-visit: 1.0.0 @@ -25810,11 +25787,6 @@ snapshots: domutils: 3.1.0 nth-check: 2.1.1 - css-tree@2.3.1: - dependencies: - mdn-data: 2.0.30 - source-map-js: 1.2.1 - css-vendor@2.0.8: dependencies: '@babel/runtime': 7.26.0 @@ -26708,7 +26680,7 @@ snapshots: transitivePeerDependencies: - supports-color - eslint-plugin-svelte@2.46.0(eslint@9.15.0(jiti@2.4.0))(svelte@4.2.19): + eslint-plugin-svelte@2.46.0(eslint@9.15.0(jiti@2.4.0))(svelte@5.1.9): dependencies: '@eslint-community/eslint-utils': 4.4.1(eslint@9.15.0(jiti@2.4.0)) '@jridgewell/sourcemap-codec': 1.5.0 @@ -26721,9 +26693,9 @@ snapshots: postcss-safe-parser: 6.0.0(postcss@8.4.49) postcss-selector-parser: 6.1.1 semver: 7.6.3 - svelte-eslint-parser: 0.43.0(svelte@4.2.19) + svelte-eslint-parser: 0.43.0(svelte@5.1.9) optionalDependencies: - svelte: 4.2.19 + svelte: 5.1.9 transitivePeerDependencies: - ts-node @@ -26826,6 +26798,11 @@ snapshots: dependencies: estraverse: 5.3.0 + esrap@1.2.2: + dependencies: + '@jridgewell/sourcemap-codec': 1.5.0 + '@types/estree': 1.0.6 + esrecurse@4.3.0: dependencies: estraverse: 5.3.0 @@ -29559,8 +29536,6 @@ snapshots: dependencies: '@types/mdast': 4.0.4 - mdn-data@2.0.30: {} - mdurl@2.0.0: {} media-typer@0.3.0: {} @@ -31324,12 +31299,6 @@ snapshots: performance-now@2.1.0: {} - periscopic@3.1.0: - dependencies: - '@types/estree': 1.0.6 - estree-walker: 3.0.3 - is-reference: 3.0.2 - picocolors@1.1.1: {} picomatch@2.3.1: {} @@ -31523,10 +31492,10 @@ snapshots: prelude-ls@1.2.1: {} - prettier-plugin-svelte@3.3.2(prettier@3.3.3)(svelte@4.2.19): + prettier-plugin-svelte@3.3.2(prettier@3.3.3)(svelte@5.1.9): dependencies: prettier: 3.3.3 - svelte: 4.2.19 + svelte: 5.1.9 prettier@2.8.8: optional: true @@ -33308,19 +33277,19 @@ snapshots: supports-preserve-symlinks-flag@1.0.0: {} - svelte-check@4.0.0(picomatch@4.0.2)(svelte@4.2.19)(typescript@5.7.2): + svelte-check@4.0.0(picomatch@4.0.2)(svelte@5.1.9)(typescript@5.7.2): dependencies: '@jridgewell/trace-mapping': 0.3.25 chokidar: 3.6.0 fdir: 6.3.0(picomatch@4.0.2) picocolors: 1.1.1 sade: 1.8.1 - svelte: 4.2.19 + svelte: 5.1.9 typescript: 5.7.2 transitivePeerDependencies: - picomatch - svelte-eslint-parser@0.43.0(svelte@4.2.19): + svelte-eslint-parser@0.43.0(svelte@5.1.9): dependencies: eslint-scope: 7.2.2 eslint-visitor-keys: 3.4.3 @@ -33328,35 +33297,30 @@ snapshots: postcss: 8.4.49 postcss-scss: 4.0.9(postcss@8.4.49) optionalDependencies: - svelte: 4.2.19 - - svelte-hmr@0.16.0(svelte@4.2.19): - dependencies: - svelte: 4.2.19 + svelte: 5.1.9 - svelte2tsx@0.7.28(svelte@4.2.19)(typescript@5.7.2): + svelte2tsx@0.7.28(svelte@5.1.9)(typescript@5.7.2): dependencies: dedent-js: 1.0.1 pascal-case: 3.1.2 - svelte: 4.2.19 + svelte: 5.1.9 typescript: 5.7.2 - svelte@4.2.19: + svelte@5.1.9: dependencies: '@ampproject/remapping': 2.3.0 '@jridgewell/sourcemap-codec': 1.5.0 - '@jridgewell/trace-mapping': 0.3.25 '@types/estree': 1.0.6 acorn: 8.14.0 + acorn-typescript: 1.4.13(acorn@8.14.0) aria-query: 5.3.2 axobject-query: 4.1.0 - code-red: 1.0.4 - css-tree: 2.3.1 - estree-walker: 3.0.3 + esm-env: 1.1.4 + esrap: 1.2.2 is-reference: 3.0.2 locate-character: 3.0.0 magic-string: 0.30.13 - periscopic: 3.1.0 + zimmerframe: 1.1.2 symbol-observable@4.0.0: {} @@ -35253,6 +35217,8 @@ snapshots: yoctocolors-cjs@2.1.2: {} + zimmerframe@1.1.2: {} + zip-stream@6.0.1: dependencies: archiver-utils: 5.0.2