@blujosi/rivetkit-svelte 0.0.7 → 2.1.0

package/README.md

@@ -1,55 +1,61 @@
-# RivetKit Svelte
+# @blujosi/rivetkit-svelte
 
-A Svelte 5 integration for [RivetKit](https://rivetkit.com) that provides reactive actor connections using Svelte's new runes system.
+A Svelte 5 integration for [RivetKit](https://rivet.dev) that provides reactive actor connections using Svelte 5's runes system, plus a built-in SvelteKit handler for serverless deployment.
 
 ## Installation
 
 ```sh
-pnpm add @rivetkit/svelte
+pnpm add @blujosi/rivetkit-svelte rivetkit
 
 # or
 
-npm i @rivetkit/svelte
+npm i @blujosi/rivetkit-svelte rivetkit
 ```
 
 ## Overview
 
-RivetKit Svelte provides seamless integration between RivetKit's actor system and Svelte 5's reactive runes. It allows you to connect to RivetKit actors from your Svelte components with automatic reactivity, real-time event handling, and type safety.
+`@blujosi/rivetkit-svelte` provides two main pieces:
+
+1. **Svelte 5 client** (`@blujosi/rivetkit-svelte`) — `useActor` hook for reactive actor connections with real-time events
+2. **SvelteKit handler** (`@blujosi/rivetkit-svelte/sveltekit`) — `createRivetKitHandler` to serve RivetKit as a SvelteKit API route
 
 ## Features
 
-- **Svelte 5 Runes Integration** - Built specifically for Svelte 5's new reactivity system
-- **Real-time Actor Connections** - Connect to RivetKit actors with automatic state synchronization
-- **Event Handling** - Listen to actor events with automatic cleanup
-- **Type Safety** - Full TypeScript support with proper type inference
-- **SSR Compatible** - Works with SvelteKit's server-side rendering
-- **Automatic Reconnection** - Handles connection states and errors gracefully
+- **Svelte 5 Runes** — Built for `$state`, `$effect`, and `$derived`
+- **Real-time Actor Connections** — Connect to RivetKit actors with automatic state sync
+- **Event Handling** — `useEvent` with automatic cleanup
+- **Type Safety** — Full TypeScript support with registry type inference
+- **SSR Compatible** — Browser guard for SvelteKit SSR
+- **SvelteKit Handler** — Run RivetKit serverless inside your SvelteKit app
 
-## Quick Start
+---
 
-### Step 1: Set Up Your RivetKit Backend
+## Quick Start
 
-First, create your RivetKit actors and registry. Here's a simple counter example:
+### 1. Define Your Actors & Registry
 
 ```typescript
 // backend/registry.ts
-import { actor, setup } from "@rivetkit/actor";
+import { actor, setup } from "rivetkit";
 
 export const counter = actor({
-  onAuth: () => {
-    // Configure auth here if needed
-  },
-  state: { count: 0 },
+  state: { count: 0, countDouble: 0 },
   actions: {
     increment: (c, x: number) => {
-      console.log("incrementing by", x);
       c.state.count += x;
       c.broadcast("newCount", c.state.count);
       return c.state.count;
     },
+    doubleIncrement: (c, y: number) => {
+      c.state.countDouble += y;
+      c.broadcast("newDoubleCount", c.state.countDouble);
+      return c.state.countDouble;
+    },
     reset: (c) => {
       c.state.count = 0;
+      c.state.countDouble = 0;
       c.broadcast("newCount", c.state.count);
+      c.broadcast("newDoubleCount", c.state.countDouble);
       return c.state.count;
     },
   },
@@ -58,285 +64,252 @@ export const counter = actor({
 export const registry = setup({
   use: { counter },
 });
+
+export type Registry = typeof registry;
 ```
 
-### Step 2: Start Your RivetKit Server
+### 2. Set Up the SvelteKit Handler
+
+Create a catch-all API route to proxy RivetKit requests through SvelteKit:
 
 ```typescript
-// backend/index.ts
-import { registry } from "./registry";
+// src/routes/api/rivet/[...rest]/+server.ts
+import { createRivetKitHandler } from "@blujosi/rivetkit-svelte/sveltekit";
+import { dev } from "$app/environment";
+import { registry } from "$backend/registry";
+
+export const { GET, POST, PUT, DELETE, PATCH, HEAD, OPTIONS } =
+  createRivetKitHandler({
+    isDev: !!dev,
+    registry,
+    rivetSiteUrl: "http://localhost:5173",
+  });
+```
 
-export type Registry = typeof registry;
+The handler automatically:
+- Spawns the RivetKit engine in dev mode
+- Configures the serverless runner pool
+- Proxies requests to the registry's built-in handler
 
-registry.runServer({
-  cors: {
-    origin: "http://localhost:5173", // Your Svelte app URL
-  },
-});
-```
+#### Handler Options
 
-### Step 3: Create the Client Connection
+| Option | Type | Description |
+|---|---|---|
+| `registry` | `Registry` | Your RivetKit registry instance |
+| `isDev` | `boolean` | Enables auto-engine spawn and runner pool config |
+| `rivetSiteUrl` | `string?` | Base URL for the site. Falls back to `PUBLIC_RIVET_ENDPOINT` env var |
 
-In your Svelte app, create a client connection to your RivetKit server:
+### 3. Create the Client
 
 ```typescript
-// src/lib/actor-client.ts
-import { createClient, createRivetKit } from "@rivetkit/svelte";
-import type { Registry } from "../../backend";
+// src/lib/actor.client.ts
+import { createClient, createRivetKitWithClient } from "@blujosi/rivetkit-svelte";
+import type { Client } from "rivetkit/client";
+import { browser } from "$app/environment";
+import type { Registry } from "$backend/registry";
+
+let rivetClient: Client<Registry> | undefined;
+
+export const getRivetClient = () => {
+  if (!browser) return { useActor: () => {} };
 
-const client = createClient<Registry>(`http://localhost:8080`);
-export const { useActor } = createRivetKit(client);
+  const origin = `${location.origin}/api/rivet`;
+  rivetClient = createClient<Registry>(origin);
+  const { useActor } = createRivetKitWithClient(rivetClient);
+
+  return { rivetClient, useActor };
+};
 ```
 
-### Step 4: Use Actors in Your Svelte Components
+> **Important:** The client must only be created in the browser. The `browser` guard ensures SSR doesn't attempt a connection.
 
-Now you can use the `useActor` function in your Svelte 5 components:
+### 4. Use Actors in Svelte Components
 
 ```svelte
 <!-- src/routes/+page.svelte -->
 <script lang="ts">
-  import { useActor } from "../lib/actor-client";
+  import { getRivetClient } from "../lib/actor.client";
+  import { browser } from "$app/environment";
 
   let count = $state(0);
-  const counter = useActor({ name: 'counter', key: ['test-counter'] });
-
-  $effect(() => {
-    console.log('status', counter?.isConnected);
-    counter?.useEvent('newCount', (x: number) => {
-      console.log('new count event', x);
-      count = x;
-    });
+  let countDouble = $state(0);
+
+  const { useActor } = getRivetClient();
+  const counterActor = browser
+    ? useActor({ name: "counter", key: ["test-counter"] })
+    : undefined;
+
+  // Listen for events (call at top-level, NOT inside $effect)
+  counterActor?.useEvent("newCount", (x: number) => {
+    count = x;
   });
 
-  const increment = () => {
-    counter?.connection?.increment(1);
-  };
+  counterActor?.useEvent("newDoubleCount", (y: number) => {
+    countDouble = y;
+  });
 
-  const reset = () => {
-    counter?.connection?.reset();
+  // Call actions through the connection
+  const increment = async () => {
+    await counterActor?.current?.connection?.increment(1);
+  };
+  const reset = async () => {
+    await counterActor?.current?.connection?.reset();
+  };
+  const doubleCountClick = async () => {
+    await counterActor?.current?.connection?.doubleIncrement(2);
   };
-
-  // Debug the connection status
-  $inspect('useActor is connected', counter?.isConnected);
 </script>
 
 <div>
   <h1>Counter: {count}</h1>
   <button onclick={increment}>Increment</button>
   <button onclick={reset}>Reset</button>
+
+  <h1>Counter 2: {countDouble}</h1>
+  <button onclick={doubleCountClick}>Double Count</button>
 </div>
 ```
 
-## Core Concepts
-
-### useActor Hook
+---
 
-The `useActor` function is the main way to connect to RivetKit actors from your Svelte components. It returns a reactive object with the following properties:
+## API Reference
 
-- **`connection`** - The actor connection object for calling actions
-- **`handle`** - The actor handle for advanced operations
-- **`isConnected`** - Boolean indicating if the actor is connected
-- **`isConnecting`** - Boolean indicating if the actor is currently connecting
-- **`isError`** - Boolean indicating if there's an error
-- **`error`** - The error object if one exists
-- **`useEvent`** - Function to listen for actor events
+### Client Exports (`@blujosi/rivetkit-svelte`)
 
-### Actor Options
+#### `createClient<Registry>(url)`
 
-When calling `useActor`, you need to provide:
+Creates a RivetKit client connection.
 
 ```typescript
-const actor = useActor({
-  name: 'counter',           // The actor name from your registry
-  key: ['test-counter'],     // Unique key for this actor instance
-  params: { /* ... */ },     // Optional parameters
-  enabled: true              // Optional, defaults to true
-});
+import { createClient } from "@blujosi/rivetkit-svelte";
+const client = createClient<Registry>("http://localhost:5173/api/rivet");
 ```
 
-## Event Handling
-
-### Using useEvent
+#### `createRivetKit<Registry>(url, opts?)`
 
-The `useEvent` function allows you to listen for events broadcast by actors:
+Shorthand that creates both the client and the `useActor` hook.
 
-```svelte
-<script lang="ts">
-  import { useActor } from "../lib/actor-client";
-
-  const chatActor = useActor({ name: 'chat', key: ['room-1'] });
-
-  $effect(() => {
-    // Listen for new messages
-    chatActor?.useEvent('newMessage', (message) => {
-      console.log('New message:', message);
-      // Update your component state
-    });
-
-    // Listen for user joined events
-    chatActor?.useEvent('userJoined', (user) => {
-      console.log('User joined:', user);
-    });
-  });
-</script>
+```typescript
+import { createRivetKit } from "@blujosi/rivetkit-svelte";
+export const { useActor } = createRivetKit<Registry>("http://localhost:5173/api/rivet");
 ```
 
-### Alternative Event Listening
-
-You can also listen to events directly on the connection:
-
-```svelte
-<script lang="ts">
-  const actor = useActor({ name: 'counter', key: ['test'] });
+#### `createRivetKitWithClient<Registry>(client, opts?)`
 
-  $effect(() => {
-    const unsubscribe = actor.connection?.on('newCount', (count) => {
-      console.log('Count updated:', count);
-    });
+Creates the `useActor` hook from an existing client instance. Use this when you need access to the client elsewhere.
 
-    // Cleanup is handled automatically by $effect
-    return unsubscribe;
-  });
-</script>
+```typescript
+import { createClient, createRivetKitWithClient } from "@blujosi/rivetkit-svelte";
+const client = createClient<Registry>(url);
+export const { useActor } = createRivetKitWithClient(client);
 ```
 
-## Advanced Usage
+### `useActor(options)`
 
-### Conditional Actor Connections
+Connects to a RivetKit actor and returns reactive state. **Must be called at the top level of a component script** (not inside `onMount` or other callbacks) so runes attach correctly.
 
-You can conditionally enable/disable actor connections:
+```typescript
+const actor = useActor({
+  name: "counter",             // Actor name from your registry
+  key: ["test-counter"],       // Unique key for this instance
+  params: { /* ... */ },       // Optional parameters
+  createInRegion: "us-east-1", // Optional region
+  createWithInput: { /* */ },  // Optional input data
+  enabled: true,               // Optional, defaults to true
+});
+```
 
-```svelte
-<script lang="ts">
-  let userId = $state<string | null>(null);
+**Returns:**
 
-  const userActor = useActor({
-    name: 'user',
-    key: [userId || 'anonymous'],
-    enabled: userId !== null
-  });
-</script>
-```
+| Property | Type | Description |
+|---|---|---|
+| `current.connection` | `ActorConn` | Call actions on the actor |
+| `current.handle` | `ActorHandle` | Advanced actor operations |
+| `current.isConnected` | `boolean` | Whether the actor is connected |
+| `current.isConnecting` | `boolean` | Whether a connection is in progress |
+| `current.isError` | `boolean` | Whether there's an error |
+| `current.error` | `Error \| null` | The error object, if any |
+| `useEvent(name, handler)` | `function` | Listen for actor events |
 
-### Multiple Actor Instances
+### `useEvent(eventName, handler)`
 
-You can connect to multiple instances of the same actor:
+Registers an event listener with automatic cleanup. **Call at the top level of the component script, not inside `$effect`.**
 
-```svelte
-<script lang="ts">
-  const chatRoom1 = useActor({ name: 'chat', key: ['room-1'] });
-  const chatRoom2 = useActor({ name: 'chat', key: ['room-2'] });
-  const privateChat = useActor({ name: 'chat', key: ['private', userId] });
-</script>
+```typescript
+counterActor?.useEvent("newCount", (value: number) => {
+  count = value;
+});
 ```
 
-### Error Handling
+### SvelteKit Exports (`@blujosi/rivetkit-svelte/sveltekit`)
 
-Handle connection errors gracefully:
+#### `createRivetKitHandler(opts)`
 
-```svelte
-<script lang="ts">
-  const actor = useActor({ name: 'counter', key: ['test'] });
+Creates SvelteKit request handlers for all HTTP methods.
 
-  $effect(() => {
-    if (actor?.isError && actor?.error) {
-      console.error('Actor connection error:', actor.error);
-      // Show error message to user
-    }
-  });
-</script>
+```typescript
+import { createRivetKitHandler } from "@blujosi/rivetkit-svelte/sveltekit";
 
-{#if actor?.isError}
-  <div class="error">
-    Connection failed: {actor.error?.message}
-  </div>
-{:else if actor?.isConnecting}
-  <div class="loading">Connecting...</div>
-{:else if actor?.isConnected}
-  <div class="success">Connected!</div>
-{/if}
+export const { GET, POST, PUT, DELETE, PATCH, HEAD, OPTIONS } =
+  createRivetKitHandler({ isDev: true, registry, rivetSiteUrl: "http://localhost:5173" });
 ```
 
-## API Reference
+---
 
-### createClient(url: string)
+## Common Pitfalls
 
-Creates a client connection to your RivetKit server.
+### Don't call `useActor` inside `onMount`
+
+`useActor` uses `$effect` runes internally. Runes must be initialized during synchronous component setup, not in deferred callbacks.
 
 ```typescript
-import { createClient } from "@rivetkit/svelte";
+// BAD
+onMount(() => {
+  const actor = useActor({ name: "counter", key: ["test"] });
+});
 
-const client = createClient<Registry>("http://localhost:8080");
+// GOOD
+const actor = browser
+  ? useActor({ name: "counter", key: ["test"] })
+  : undefined;
 ```
 
-### createRivetKit(client: Client)
+### Don't call `useEvent` inside `$effect`
 
-Creates the RivetKit integration with your client.
+`useEvent` manages its own internal effects. Wrapping it in another `$effect` causes duplicate listeners and broken state.
 
 ```typescript
-import { createRivetKit } from "@rivetkit/svelte";
+// BAD
+$effect(() => {
+  actor?.useEvent("newCount", (x) => { count = x; });
+});
 
-const { useActor } = createRivetKit(client);
+// GOOD
+actor?.useEvent("newCount", (x) => { count = x; });
 ```
 
-### useActor(options: ActorOptions)
-
-Connects to a RivetKit actor and returns reactive state.
-
-**Parameters:**
-- `name: string` - The actor name from your registry
-- `key: string | string[]` - Unique identifier for the actor instance
-- `params?: Record<string, string>` - Optional parameters to pass to the actor
-- `enabled?: boolean` - Whether the connection is enabled (default: true)
-
-**Returns:**
-- `connection` - Actor connection for calling actions
-- `handle` - Actor handle for advanced operations
-- `isConnected` - Connection status
-- `isConnecting` - Loading state
-- `isError` - Error state
-- `error` - Error object
-- `useEvent` - Function to listen for events
-
-## TypeScript Support
+### Don't call `.connect()` on the connection
 
-RivetKit Svelte provides full TypeScript support. Make sure to type your registry:
+The connection is automatically managed by `useActor`. Calling `.connect()` sends an RPC action named "connect" to your actor, which doesn't exist.
 
 ```typescript
-// backend/index.ts
-export type Registry = typeof registry;
+// BAD
+await actor?.current?.connection?.connect();
 
-// frontend/actor-client.ts
-import type { Registry } from "../../backend";
-const client = createClient<Registry>("http://localhost:8080");
+// GOOD — just call actions directly
+await actor?.current?.connection?.increment(1);
 ```
 
-## SvelteKit Integration
-
-RivetKit Svelte works seamlessly with SvelteKit. The library automatically detects browser environment and handles SSR appropriately.
-
-```svelte
-<!-- +layout.svelte -->
-<script lang="ts">
-  import { useActor } from "$lib/actor-client";
-
-  // This will only connect in the browser
-  const globalActor = useActor({ name: 'global', key: ['app'] });
-</script>
-```
+---
 
-## Examples
+## TODO
 
-Check out the `examples` folder in this repository for a complete working example with:
-- Backend RivetKit server setup
-- Frontend Svelte integration
-- Real-time counter with events
-- TypeScript configuration
+- [ ] Figure out using `useActor` and `rivetClient` in SSR mode, maybe using context?
 
-## Contributing
+## License
 
-Contributions are welcome! Please read our contributing guidelines and submit pull requests to our repository.
+MIT
 
-## License
+---
 
-MIT License - see LICENSE file for details.
+Inspired by the Rivet core implementation for React and Next.js.

package/dist/index.d.ts

@@ -1 +1,2 @@
-export * from "./rivet.svelte.js";
+export * from './svelte';
+export * from './sveltekit';

package/dist/index.js

@@ -1 +1,2 @@
-export * from "./rivet.svelte.js";
+export * from './svelte';
+export * from './sveltekit';

package/dist/svelte/index.d.ts

@@ -0,0 +1 @@
+export * from "./rivet.svelte.js";

package/dist/svelte/index.js

@@ -0,0 +1 @@
+export * from "./rivet.svelte.js";

package/dist/{rivet.svelte.d.ts → svelte/rivet.svelte.d.ts}

@@ -1,5 +1,5 @@
-import type { ActorConn, ActorHandle, AnyActorDefinition, Client, ExtractActorsFromRegistry } from "@rivetkit/core/client";
 import { type ActorOptions, type AnyActorRegistry, type CreateRivetKitOptions } from "@rivetkit/framework-base";
+import type { ActorConn, ActorHandle, AnyActorDefinition, Client, ExtractActorsFromRegistry } from "rivetkit/client";
 export interface ActorStateReference<AD extends AnyActorDefinition> {
     /**
      * The unique identifier for the actor.
@@ -61,12 +61,36 @@ export interface ActorStateReference<AD extends AnyActorDefinition> {
         enabled?: boolean;
     };
 }
-export { createClient } from "@rivetkit/core/client";
-export declare function createRivetKit<Registry extends AnyActorRegistry>(client: Client<Registry>, opts?: CreateRivetKitOptions<Registry>): {
+import { createClient } from "rivetkit/client";
+export { createClient } from "rivetkit/client";
+export declare function createRivetKit<Registry extends AnyActorRegistry>(clientInput?: Parameters<typeof createClient>[0], opts?: CreateRivetKitOptions<Registry>): {
     useActor: <ActorName extends keyof ExtractActorsFromRegistry<Registry>>(opts: ActorOptions<Registry, ActorName>) => {
-        current: Omit<ActorStateReference<ExtractActorsFromRegistry<Registry>>, "handle" | "connection"> & {
-            handle: ActorHandle<ExtractActorsFromRegistry<Registry>[ActorName]> | null;
-            connection: ActorConn<ExtractActorsFromRegistry<Registry>[ActorName]> | null;
+        current: {
+            connect(): void;
+            readonly connection: any;
+            readonly handle: any;
+            readonly isConnected: boolean;
+            readonly isConnecting: boolean;
+            readonly isError: boolean;
+            readonly error: any;
+            readonly opts: any;
+            readonly hash: any;
+        };
+        useEvent: (eventName: string, handler: (...args: any[]) => void) => void;
+    };
+};
+export declare function createRivetKitWithClient<Registry extends AnyActorRegistry>(client: Client<Registry>, opts?: CreateRivetKitOptions<Registry>): {
+    useActor: <ActorName extends keyof ExtractActorsFromRegistry<Registry>>(opts: ActorOptions<Registry, ActorName>) => {
+        current: {
+            connect(): void;
+            readonly connection: any;
+            readonly handle: any;
+            readonly isConnected: boolean;
+            readonly isConnecting: boolean;
+            readonly isError: boolean;
+            readonly error: any;
+            readonly opts: any;
+            readonly hash: any;
         };
         useEvent: (eventName: string, handler: (...args: any[]) => void) => void;
     };

package/dist/{rivet.svelte.js → svelte/rivet.svelte.js}

@@ -1,7 +1,10 @@
 import { createRivetKit as createVanillaRivetKit, } from "@rivetkit/framework-base";
-import { useStore } from '@tanstack/svelte-store';
-export { createClient } from "@rivetkit/core/client";
-export function createRivetKit(client, opts = {}) {
+import { createClient } from "rivetkit/client";
+export { createClient } from "rivetkit/client";
+export function createRivetKit(clientInput = undefined, opts = {}) {
+    return createRivetKitWithClient(createClient(clientInput), opts);
+}
+export function createRivetKitWithClient(client, opts = {}) {
     const { getOrCreateActor } = createVanillaRivetKit(client, opts);
     /**
      * Svelte 5 rune-based function to connect to an actor and retrieve its state.
@@ -12,63 +15,73 @@ export function createRivetKit(client, opts = {}) {
      * @returns An object containing reactive state and event listener function.
      */
     function useActor(opts) {
-        const { mount, setState, state } = getOrCreateActor(opts);
+        const { mount, state } = getOrCreateActor(opts);
         // Update options reactively
-        $effect.root(() => {
-            setState((prev) => {
-                prev.opts = {
-                    ...opts,
-                    enabled: opts.enabled ?? true,
-                };
-                return prev;
-            });
-        });
+        // $effect.root(() => {
+        // 	setState((prev) => {
+        // 		prev.opts = {
+        // 			...opts,
+        // 			enabled: opts.enabled ?? true,
+        // 		} as any
+        // 		return prev
+        // 	})s
+        // })
         // Mount and subscribe to state changes
         $effect.root(() => {
             mount();
         });
-        const actorState = useStore(state);
-        function useEvent(eventName, 
-        // biome-ignore lint/suspicious/noExplicitAny: strong typing of handler is not supported yet
-        handler) {
+        let actorState = $state(undefined);
+        const unsubscribe = state?.subscribe((res) => {
+            actorState = res.currentVal;
+        });
+        $effect(() => {
+            return () => unsubscribe?.();
+        });
+        function useEvent(eventName, handler) {
             let ref = $state(handler);
-            const actorState = useStore(state) || {};
+            let actorState = $state(undefined);
+            state.subscribe((s) => {
+                actorState = s.currentVal;
+            });
             $effect(() => {
                 ref = handler;
             });
             $effect(() => {
-                if (!actorState?.current?.connection)
+                if (!actorState?.connection)
                     return;
                 function eventHandler(...args) {
                     ref(...args);
                 }
-                return actorState.current.connection.on(eventName, eventHandler);
+                return actorState.connection?.on(eventName, eventHandler);
             });
         }
         const current = {
+            connect() {
+                actorState?.connection?.connect();
+            },
             get connection() {
-                return actorState.current?.connection;
+                return actorState?.connection;
             },
             get handle() {
-                return actorState.current?.handle;
+                return actorState?.handle;
             },
             get isConnected() {
-                return actorState.current?.isConnected;
+                return actorState?.connStatus === "connected";
             },
             get isConnecting() {
-                return actorState.current?.isConnecting;
+                return actorState?.connStatus === "connecting";
             },
             get isError() {
-                return actorState.current?.isError;
+                return !!actorState?.error;
             },
             get error() {
-                return actorState.current?.error;
+                return actorState?.error;
             },
             get opts() {
-                return actorState.current?.opts;
+                return actorState?.opts;
             },
             get hash() {
-                return actorState.current?.hash;
+                return actorState?.hash;
             },
         };
         return {

package/dist/sveltekit/handler.server.d.ts

@@ -0,0 +1,15 @@
+import type { RequestHandler } from "@sveltejs/kit";
+import type { Registry } from "rivetkit";
+export declare const createRivetKitHandler: (opts?: {
+    registry: Registry<any>;
+    isDev: boolean;
+    rivetSiteUrl?: string;
+}) => {
+    GET: RequestHandler;
+    POST: RequestHandler;
+    PUT: RequestHandler;
+    DELETE: RequestHandler;
+    PATCH: RequestHandler;
+    HEAD: RequestHandler;
+    OPTIONS: RequestHandler;
+};

package/dist/sveltekit/handler.server.js

@@ -0,0 +1,62 @@
+import { getLogger } from "rivetkit/log";
+import { PUBLIC_RIVET_ENDPOINT } from "$env/static/public";
+const _devRunnerVersion = Math.floor(Date.now() / 1000);
+const _logger = getLogger("driver-sveltekit");
+const handler = async (request, opts) => {
+    const _requestUrl = new URL(request.url);
+    const rivetSiteUrl = opts?.rivetSiteUrl ?? PUBLIC_RIVET_ENDPOINT;
+    if (!rivetSiteUrl) {
+        throw new Error('PUBLIC_RIVET_ENDPOINT environment variable is not set');
+    }
+    const registry = opts?.registry;
+    if (!registry) {
+        throw new Error("registry is not set");
+    }
+    registry.config.serveManager = false;
+    registry.config.serverless = {
+        ...registry.config.serverless,
+        basePath: "/api/rivet",
+    };
+    if (opts?.isDev) {
+        _logger.debug("detected development environment, auto-starting engine and auto-configuring serverless");
+        // Set these on the registry's config directly since the legacy inputConfig
+        // isn't used by the serverless router
+        registry.config.serverless.spawnEngine = true;
+        registry.config.serverless.configureRunnerPool = {
+            url: `${rivetSiteUrl}/api/rivet`,
+            minRunners: 0,
+            maxRunners: 100_000,
+            requestLifespan: 300,
+            slotsPerRunner: 1,
+            metadata: { provider: "sveltekit" },
+        };
+        // Set runner version to enable hot-reloading on code changes
+        registry.config.runner = {
+            ...registry.config.runner,
+            version: _devRunnerVersion,
+        };
+    }
+    else {
+        _logger.debug("detected production environment, will not auto-start engine and auto-configure serverless");
+    }
+    const newUrl = `${rivetSiteUrl}${_requestUrl.pathname}`;
+    const newRequest = new Request(newUrl, request);
+    newRequest.headers.set("host", new URL(newUrl).host);
+    newRequest.headers.set("accept-encoding", "application/json");
+    return await registry.handler(newRequest);
+    // return fetch(newRequest, { method: request.method, redirect: "manual" })
+};
+export const createRivetKitHandler = (opts) => {
+    const requestHandler = async ({ request }) => {
+        return handler(request, opts);
+    };
+    return {
+        GET: requestHandler,
+        POST: requestHandler,
+        PUT: requestHandler,
+        DELETE: requestHandler,
+        PATCH: requestHandler,
+        HEAD: requestHandler,
+        OPTIONS: requestHandler,
+    };
+};

package/dist/sveltekit/index.d.ts

@@ -0,0 +1 @@
+export * from './handler.server';

package/dist/sveltekit/index.js

@@ -0,0 +1 @@
+export * from './handler.server';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@blujosi/rivetkit-svelte",
-	"version": "0.0.7",
+	"version": "2.1.0",
 	"scripts": {
 		"build": "vite build && npm run prepack",
 		"preview": "vite preview",
@@ -17,37 +17,45 @@
 	"sideEffects": [
 		"**/*.css"
 	],
-	"svelte": "./dist/index.js",
-	"types": "./dist/index.d.ts",
+	"svelte": "./dist/svelte/index.js",
+	"types": "./dist/svelte/index.d.ts",
 	"type": "module",
 	"exports": {
 		".": {
-			"types": "./dist/index.d.ts",
-			"svelte": "./dist/index.js"
+			"types": "./dist/svelte/index.d.ts",
+			"svelte": "./dist/svelte/index.js",
+			"default": "./dist/svelte/index.js"
+		},
+		"./svelte": {
+			"types": "./dist/svelte/index.d.ts",
+			"svelte": "./dist/svelte/index.js",
+			"default": "./dist/svelte/index.js"
+		},
+		"./sveltekit": {
+			"types": "./dist/sveltekit/index.d.ts",
+			"svelte": "./dist/sveltekit/index.js"
 		}
 	},
 	"peerDependencies": {
 		"svelte": "^5.0.0"
 	},
 	"devDependencies": {
-		"@sveltejs/adapter-auto": "^6.1.0",
-		"@sveltejs/kit": "^2.37.0",
-		"@sveltejs/package": "^2.5.0",
-		"@sveltejs/vite-plugin-svelte": "^6.1.4",
-		"publint": "^0.3.12",
-		"svelte": "^5.38.7",
-		"svelte-check": "^4.3.1",
-		"typescript": "^5.9.2",
-		"vite": "^7.1.4"
+		"@rivetkit/framework-base": "^2.1.3",
+		"@sveltejs/adapter-auto": "^7.0.1",
+		"@sveltejs/kit": "^2.53.4",
+		"@sveltejs/package": "^2.5.7",
+		"@sveltejs/vite-plugin-svelte": "^6.2.4",
+		"publint": "^0.3.18",
+		"svelte": "^5.53.6",
+		"svelte-check": "^4.4.4",
+		"typescript": "^5.9.3",
+		"vite": "^7.3.1"
 	},
 	"keywords": [
 		"svelte"
 	],
 	"dependencies": {
-		"@rivetkit/actor": "^2.0.2",
-		"@rivetkit/core": "^2.0.2",
-		"@rivetkit/framework-base": "^2.0.2",
-		"@tanstack/svelte-store": "^0.7.4",
-		"esm-env": "^1.2.2"
+		"esm-env": "^1.2.2",
+		"rivetkit": "^2.1.3"
 	}
-}
+}