@ai-sdk/svelte 1.1.23 → 2.0.0

package/dist/structured-object.svelte.js

@@ -0,0 +1,123 @@
+import { generateId, isAbortError, safeValidateTypes, } from '@ai-sdk/provider-utils';
+import { asSchema, isDeepEqualData, parsePartialJson, } from '@ai-sdk/ui-utils';
+import {} from 'zod';
+import { getStructuredObjectContext, hasStructuredObjectContext, KeyedStructuredObjectStore, } from './structured-object-context.svelte.js';
+export class StructuredObject {
+    #options = {};
+    #id = $derived(this.#options.id ?? generateId());
+    #keyedStore = $state();
+    #store = $derived(this.#keyedStore.get(this.#id));
+    #abortController;
+    /**
+     * The current value for the generated object. Updated as the API streams JSON chunks.
+     */
+    get object() {
+        return this.#store.object;
+    }
+    set #object(value) {
+        this.#store.object = value;
+    }
+    /** The error object of the API request */
+    get error() {
+        return this.#store.error;
+    }
+    /**
+     * Flag that indicates whether an API request is in progress.
+     */
+    get loading() {
+        return this.#store.loading;
+    }
+    constructor(options) {
+        if (hasStructuredObjectContext()) {
+            this.#keyedStore = getStructuredObjectContext();
+        }
+        else {
+            this.#keyedStore = new KeyedStructuredObjectStore();
+        }
+        this.#options = options;
+        this.#object = options.initialValue;
+    }
+    /**
+     * Abort the current request immediately, keep the current partial object if any.
+     */
+    stop = () => {
+        try {
+            this.#abortController?.abort();
+        }
+        catch {
+            // ignore
+        }
+        finally {
+            this.#store.loading = false;
+            this.#abortController = undefined;
+        }
+    };
+    /**
+     * Calls the API with the provided input as JSON body.
+     */
+    submit = async (input) => {
+        try {
+            this.#store.object = undefined; // reset the data
+            this.#store.loading = true;
+            this.#store.error = undefined;
+            const abortController = new AbortController();
+            this.#abortController = abortController;
+            const actualFetch = this.#options.fetch ?? fetch;
+            const response = await actualFetch(this.#options.api, {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    ...this.#options.headers,
+                },
+                signal: abortController.signal,
+                body: JSON.stringify(input),
+            });
+            if (!response.ok) {
+                throw new Error((await response.text()) ?? 'Failed to fetch the response.');
+            }
+            if (response.body == null) {
+                throw new Error('The response body is empty.');
+            }
+            let accumulatedText = '';
+            let latestObject = undefined;
+            await response.body.pipeThrough(new TextDecoderStream()).pipeTo(new WritableStream({
+                write: chunk => {
+                    if (abortController?.signal.aborted) {
+                        throw new DOMException('Stream aborted', 'AbortError');
+                    }
+                    accumulatedText += chunk;
+                    const { value } = parsePartialJson(accumulatedText);
+                    const currentObject = value;
+                    if (!isDeepEqualData(latestObject, currentObject)) {
+                        latestObject = currentObject;
+                        this.#store.object = currentObject;
+                    }
+                },
+                close: () => {
+                    this.#store.loading = false;
+                    this.#abortController = undefined;
+                    if (this.#options.onFinish != null) {
+                        const validationResult = safeValidateTypes({
+                            value: latestObject,
+                            schema: asSchema(this.#options.schema),
+                        });
+                        this.#options.onFinish(validationResult.success
+                            ? { object: validationResult.value, error: undefined }
+                            : { object: undefined, error: validationResult.error });
+                    }
+                },
+            }));
+        }
+        catch (error) {
+            if (isAbortError(error)) {
+                return;
+            }
+            const coalescedError = error instanceof Error ? error : new Error(String(error));
+            if (this.#options.onError) {
+                this.#options.onError(coalescedError);
+            }
+            this.#store.loading = false;
+            this.#store.error = coalescedError;
+        }
+    };
+}

package/dist/tests/chat-synchronization.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+  import { Chat } from '../chat.svelte.js';
+  import { createAIContext } from '../context-provider.js';
+
+  let { id }: { id?: string } = $props();
+
+  createAIContext();
+  const chat1 = new Chat({ id });
+  const chat2 = new Chat({ id });
+
+  export { chat1, chat2 };
+</script>

package/dist/tests/chat-synchronization.svelte.d.ts

@@ -0,0 +1,11 @@
+import { Chat } from '../chat.svelte.js';
+type $$ComponentProps = {
+    id?: string;
+};
+declare const ChatSynchronization: import("svelte").Component<$$ComponentProps, {
+    chat1: Chat;
+    chat2: Chat;
+}, "">;
+type ChatSynchronization = ReturnType<typeof ChatSynchronization>;
+export default ChatSynchronization;
+//# sourceMappingURL=chat-synchronization.svelte.d.ts.map

package/dist/tests/chat-synchronization.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-synchronization.svelte.d.ts","sourceRoot":"","sources":["../../src/tests/chat-synchronization.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAGxC,KAAK,gBAAgB,GAAI;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAgB1C,QAAA,MAAM,mBAAmB;;;MAAsC,CAAC;AAChE,KAAK,mBAAmB,GAAG,UAAU,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAClE,eAAe,mBAAmB,CAAC"}

package/dist/tests/completion-synchronization.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+  import { Completion } from '../completion.svelte.js';
+  import { createAIContext } from '../context-provider.js';
+
+  let { id }: { id?: string } = $props();
+
+  createAIContext();
+  const completion1 = new Completion({ id });
+  const completion2 = new Completion({ id });
+
+  export { completion1, completion2 };
+</script>

package/dist/tests/completion-synchronization.svelte.d.ts

@@ -0,0 +1,11 @@
+import { Completion } from '../completion.svelte.js';
+type $$ComponentProps = {
+    id?: string;
+};
+declare const CompletionSynchronization: import("svelte").Component<$$ComponentProps, {
+    completion1: Completion;
+    completion2: Completion;
+}, "">;
+type CompletionSynchronization = ReturnType<typeof CompletionSynchronization>;
+export default CompletionSynchronization;
+//# sourceMappingURL=completion-synchronization.svelte.d.ts.map

package/dist/tests/completion-synchronization.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"completion-synchronization.svelte.d.ts","sourceRoot":"","sources":["../../src/tests/completion-synchronization.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAGpD,KAAK,gBAAgB,GAAI;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAgB1C,QAAA,MAAM,yBAAyB;;;MAAsC,CAAC;AACtE,KAAK,yBAAyB,GAAG,UAAU,CAAC,OAAO,yBAAyB,CAAC,CAAC;AAC9E,eAAe,yBAAyB,CAAC"}

package/dist/tests/structured-object-synchronization.svelte

@@ -0,0 +1,22 @@
+<script lang="ts" generics="RESULT">
+  import { createAIContext } from '../context-provider.js';
+  import { StructuredObject } from '../structured-object.svelte.js';
+  import type { Schema } from '@ai-sdk/ui-utils';
+  import type { z } from 'zod';
+
+  let {
+    id,
+    api,
+    schema,
+  }: {
+    id?: string;
+    api: string;
+    schema: z.Schema<RESULT, z.ZodTypeDef, unknown> | Schema<RESULT>;
+  } = $props();
+
+  createAIContext();
+  const object1 = new StructuredObject({ id, api, schema });
+  const object2 = new StructuredObject({ id, api, schema });
+
+  export { object1, object2 };
+</script>

package/dist/tests/structured-object-synchronization.svelte.d.ts

@@ -0,0 +1,28 @@
+import { StructuredObject } from '../structured-object.svelte.js';
+import type { Schema } from '@ai-sdk/ui-utils';
+import type { z } from 'zod';
+declare class __sveltets_Render<RESULT> {
+    props(): {
+        id?: string;
+        api: string;
+        schema: z.ZodType<RESULT, z.ZodTypeDef, unknown> | Schema<RESULT>;
+    };
+    events(): {};
+    slots(): {};
+    bindings(): "";
+    exports(): {
+        object1: StructuredObject<RESULT, unknown>;
+        object2: StructuredObject<RESULT, unknown>;
+    };
+}
+interface $$IsomorphicComponent {
+    new <RESULT>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<RESULT>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<RESULT>['props']>, ReturnType<__sveltets_Render<RESULT>['events']>, ReturnType<__sveltets_Render<RESULT>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<RESULT>['bindings']>;
+    } & ReturnType<__sveltets_Render<RESULT>['exports']>;
+    <RESULT>(internal: unknown, props: ReturnType<__sveltets_Render<RESULT>['props']> & {}): ReturnType<__sveltets_Render<RESULT>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const StructuredObjectSynchronization: $$IsomorphicComponent;
+type StructuredObjectSynchronization<RESULT> = InstanceType<typeof StructuredObjectSynchronization<RESULT>>;
+export default StructuredObjectSynchronization;
+//# sourceMappingURL=structured-object-synchronization.svelte.d.ts.map

package/dist/tests/structured-object-synchronization.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"structured-object-synchronization.svelte.d.ts","sourceRoot":"","sources":["../../src/tests/structured-object-synchronization.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,KAAK,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AA2B7B,cAAM,iBAAiB,CAAC,MAAM;IAC1B,KAAK;aArBA,MAAM;aACN,MAAM;;;IAuBX,MAAM;IAGN,KAAK;IAGL,QAAQ;IACR,OAAO;;;;CACV;AAED,UAAU,qBAAqB;IAC3B,KAAK,MAAM,EAAE,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,UAAU,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,UAAU,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,UAAU,CAAC,CAAC,CAAA;KAAE,GAAG,UAAU,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IAC/Z,CAAC,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,GAAG,UAAU,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IAC1I,YAAY,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC;CACjE;AACD,QAAA,MAAM,+BAA+B,EAAE,qBAAmC,CAAC;AACzD,KAAK,+BAA+B,CAAC,MAAM,IAAI,YAAY,CAAC,OAAO,+BAA+B,CAAC,MAAM,CAAC,CAAC,CAAC;AAC9G,eAAe,+BAA+B,CAAC"}

package/dist/utils.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteMap } from 'svelte/reactivity';
+export declare function createContext<T>(name: string): {
+    hasContext: () => boolean;
+    getContext: () => T;
+    setContext: (value: T) => T;
+};
+export declare function promiseWithResolvers<T>(): {
+    promise: Promise<T>;
+    resolve: (value: T) => void;
+    reject: (reason?: unknown) => void;
+};
+export declare class KeyedStore<T> extends SvelteMap<string, T> {
+    #private;
+    constructor(itemConstructor: new () => T, value?: Iterable<readonly [string, T]> | null | undefined);
+    get(key: string): T;
+}
+//# sourceMappingURL=utils.svelte.d.ts.map

package/dist/utils.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.svelte.d.ts","sourceRoot":"","sources":["../src/utils.svelte.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAE9C,wBAAgB,aAAa,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM;;;wBAuBrB,CAAC;EAExB;AAED,wBAAgB,oBAAoB,CAAC,CAAC,KAAK;IACzC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IACpB,OAAO,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC5B,MAAM,EAAE,CAAC,MAAM,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;CACpC,CAQA;AAED,qBAAa,UAAU,CAAC,CAAC,CAAE,SAAQ,SAAS,CAAC,MAAM,EAAE,CAAC,CAAC;;gBAInD,eAAe,EAAE,UAAU,CAAC,EAC5B,KAAK,CAAC,EAAE,QAAQ,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,GAAG,IAAI,GAAG,SAAS;IAM3D,GAAG,CAAC,GAAG,EAAE,MAAM,GAAG,CAAC;CAUpB"}

package/dist/utils.svelte.js

@@ -0,0 +1,50 @@
+import { hasContext, getContext, setContext, untrack } from 'svelte';
+import { SvelteMap } from 'svelte/reactivity';
+export function createContext(name) {
+    const key = Symbol(name);
+    return {
+        hasContext: () => {
+            // At the time of writing there's no way to determine if we're
+            // currently initializing a component without a try-catch
+            try {
+                return hasContext(key);
+            }
+            catch (e) {
+                if (typeof e === 'object' &&
+                    e !== null &&
+                    'message' in e &&
+                    typeof e.message === 'string' &&
+                    e.message?.includes('lifecycle_outside_component')) {
+                    return false;
+                }
+                throw e;
+            }
+        },
+        getContext: () => getContext(key),
+        setContext: (value) => setContext(key, value),
+    };
+}
+export function promiseWithResolvers() {
+    let resolve;
+    let reject;
+    const promise = new Promise((res, rej) => {
+        resolve = res;
+        reject = rej;
+    });
+    return { promise, resolve: resolve, reject: reject };
+}
+export class KeyedStore extends SvelteMap {
+    #itemConstructor;
+    constructor(itemConstructor, value) {
+        super(value);
+        this.#itemConstructor = itemConstructor;
+    }
+    get(key) {
+        const test = super.get(key) ??
+            // Untrack here because this is technically a state mutation, meaning
+            // deriveds downstream would fail. Because this is idempotent (even
+            // though it's not pure), it's safe.
+            untrack(() => this.set(key, new this.#itemConstructor())).get(key);
+        return test;
+    }
+}

package/package.json

@@ -1,53 +1,69 @@
 {
   "name": "@ai-sdk/svelte",
-  "version": "1.1.23",
+  "version": "2.0.0",
   "license": "Apache-2.0",
-  "sideEffects": false,
-  "main": "./dist/index.js",
-  "module": "./dist/index.mjs",
+  "files": [
+    "dist",
+    "!dist/**/*.test.*",
+    "!dist/**/*.spec.*",
+    "src",
+    "!src/**/*.test.*",
+    "!src/**/*.spec.*",
+    "CHANGELOG.md"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "svelte": "./dist/index.js",
   "types": "./dist/index.d.ts",
+  "type": "module",
   "exports": {
-    "./package.json": "./package.json",
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.js"
+      "svelte": "./dist/index.js"
     }
   },
-  "files": [
-    "dist/**/*",
-    "CHANGELOG.md"
-  ],
-  "dependencies": {
-    "@ai-sdk/provider-utils": "2.1.12",
-    "@ai-sdk/ui-utils": "1.1.18"
-  },
-  "devDependencies": {
-    "@types/node": "^18",
-    "eslint": "8.57.1",
-    "tsup": "^7.2.0",
-    "typescript": "5.6.3",
-    "@vercel/ai-tsconfig": "0.0.0",
-    "eslint-config-vercel-ai": "0.0.0"
+  "publishConfig": {
+    "access": "public"
   },
   "peerDependencies": {
-    "svelte": "^3.0.0 || ^4.0.0 || ^5.0.0"
+    "svelte": "^5.0.0",
+    "zod": "^3.23.8"
   },
   "peerDependenciesMeta": {
-    "svelte": {
+    "zod": {
       "optional": true
     }
   },
-  "engines": {
-    "node": ">=18"
+  "dependencies": {
+    "@ai-sdk/provider-utils": "2.1.13",
+    "@ai-sdk/ui-utils": "1.1.19"
   },
-  "publishConfig": {
-    "access": "public"
+  "devDependencies": {
+    "@eslint/compat": "^1.2.5",
+    "@eslint/js": "^9.18.0",
+    "@sveltejs/package": "^2.0.0",
+    "@sveltejs/vite-plugin-svelte": "^5.0.3",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/svelte": "^5.2.4",
+    "eslint": "^9.18.0",
+    "eslint-plugin-svelte": "^3.0.0",
+    "globals": "^16.0.0",
+    "jsdom": "^26.0.0",
+    "publint": "^0.3.2",
+    "svelte": "^5.0.0",
+    "svelte-check": "^4.0.0",
+    "typescript": "^5.0.0",
+    "typescript-eslint": "^8.20.0",
+    "vite": "^6.0.0",
+    "vitest": "^3.0.0",
+    "zod": "3.23.8"
   },
   "homepage": "https://sdk.vercel.ai/docs",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/vercel/ai.git"
+    "url": "git+https://github.com/vercel/ai.git",
+    "directory": "packages/svelte"
   },
   "bugs": {
     "url": "https://github.com/vercel/ai/issues"
@@ -57,11 +73,16 @@
     "svelte"
   ],
   "scripts": {
-    "build": "tsup",
-    "build:watch": "tsup --watch",
-    "clean": "rm -rf dist",
-    "lint": "eslint \"./**/*.ts*\"",
-    "type-check": "tsc --noEmit",
-    "prettier-check": "prettier --check \"./**/*.ts*\""
+    "build": "pnpm prepack",
+    "build:watch": "svelte-package --input=src --watch",
+    "preview": "vite preview",
+    "type-check": "svelte-check --tsconfig ./tsconfig.json",
+    "type-check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
+    "prettier-fix": "prettier --write .",
+    "prettier-check": "prettier --check .",
+    "lint": "eslint .",
+    "test": "vitest --run",
+    "test:watch": "vitest",
+    "clean": "rm -rf dist"
   }
 }

package/src/chat-context.svelte.ts

@@ -0,0 +1,23 @@
+import type { JSONValue, UIMessage } from '@ai-sdk/ui-utils';
+import { createContext, KeyedStore } from './utils.svelte.js';
+
+class ChatStore {
+  messages = $state<UIMessage[]>([]);
+  data = $state<JSONValue[]>();
+  status = $state<'submitted' | 'streaming' | 'ready' | 'error'>('ready');
+  error = $state<Error>();
+}
+
+export class KeyedChatStore extends KeyedStore<ChatStore> {
+  constructor(
+    value?: Iterable<readonly [string, ChatStore]> | null | undefined,
+  ) {
+    super(ChatStore, value);
+  }
+}
+
+export const {
+  hasContext: hasChatContext,
+  getContext: getChatContext,
+  setContext: setChatContext,
+} = createContext<KeyedChatStore>('Chat');