Svelte 5
Rune-based reactive wrappers using $state and $effect. Input is a getter () => Input for reactive dependency tracking.
Generated as .svelte.ts (required for rune syntax).
Setup
# metaxy.config.toml
[output]
svelte = "src/lib/rpc.svelte.ts"or via CLI
metaxy generate --svelte-output src/lib/rpc.svelte.tscreateQuery
import { createQuery } from './rpc.svelte';
import { rpc } from './client';
// Void input
const time = createQuery(rpc, 'time');
// Reactive input — refetches when name changes
let name = $state('World');
const hello = createQuery(rpc, 'hello', () => name);
// With options
const users = createQuery(rpc, 'list_users', () => page, {
enabled: () => page > 0,
refetchInterval: 30000,
placeholderData: [],
onSuccess: (data) => console.log(data),
});
// Access state
hello.data // T | undefined
hello.error // RpcError | undefined
hello.status // "idle" | "loading" | "success" | "error"
hello.isLoading // boolean
hello.isSuccess // boolean
hello.isError // boolean
hello.isPlaceholderData // boolean (true until first real fetch)
hello.refetch() // manual refetchcreateMutation
import { createMutation } from './rpc.svelte';
const echo = createMutation(rpc, 'echo', {
onSuccess: (data) => console.log('Done:', data),
onError: (err) => console.error(err),
onSettled: () => console.log('Finished'),
});
// Fire-and-forget
echo.mutate({ message: 'Hello', uppercase: true });
// Await the result
const result = await echo.mutateAsync({ message: 'Hello', uppercase: true });
// Access state
echo.data // T | undefined
echo.error // RpcError | undefined
echo.isLoading // boolean
echo.isSuccess // boolean
echo.isError // boolean
echo.reset() // clear state