@ai-sdk/vue 0.0.1

package/dist/index.mjs

@@ -0,0 +1,296 @@
+// src/use-chat.ts
+import {
+  callChatApi,
+  generateId as generateIdFunc,
+  processChatStream
+} from "@ai-sdk/ui-utils";
+import swrv from "swrv";
+import { ref, unref } from "vue";
+var uniqueId = 0;
+var useSWRV = swrv.default || swrv;
+var store = {};
+function useChat({
+  api = "/api/chat",
+  id,
+  initialMessages = [],
+  initialInput = "",
+  sendExtraMessageFields,
+  experimental_onFunctionCall,
+  streamMode,
+  onResponse,
+  onFinish,
+  onError,
+  credentials,
+  headers,
+  body,
+  generateId = generateIdFunc
+} = {}) {
+  var _a, _b;
+  const chatId = id || `chat-${uniqueId++}`;
+  const key = `${api}|${chatId}`;
+  const { data: messagesData, mutate: originalMutate } = useSWRV(
+    key,
+    () => store[key] || initialMessages
+  );
+  const { data: isLoading, mutate: mutateLoading } = useSWRV(
+    `${chatId}-loading`,
+    null
+  );
+  (_a = isLoading.value) != null ? _a : isLoading.value = false;
+  (_b = messagesData.value) != null ? _b : messagesData.value = initialMessages;
+  const mutate = (data) => {
+    store[key] = data;
+    return originalMutate();
+  };
+  const messages = messagesData;
+  const error = ref(void 0);
+  const streamData = ref(void 0);
+  let abortController = null;
+  async function triggerRequest(messagesSnapshot, { options, data } = {}) {
+    try {
+      error.value = void 0;
+      mutateLoading(() => true);
+      abortController = new AbortController();
+      const previousMessages = messagesData.value;
+      mutate(messagesSnapshot);
+      let chatRequest = {
+        messages: messagesSnapshot,
+        options,
+        data
+      };
+      await processChatStream({
+        getStreamedResponse: async () => {
+          var _a2;
+          const existingData = (_a2 = streamData.value) != null ? _a2 : [];
+          return await callChatApi({
+            api,
+            messages: sendExtraMessageFields ? chatRequest.messages : chatRequest.messages.map(
+              ({
+                role,
+                content,
+                name,
+                data: data2,
+                annotations,
+                function_call
+              }) => ({
+                role,
+                content,
+                ...name !== void 0 && { name },
+                ...data2 !== void 0 && { data: data2 },
+                ...annotations !== void 0 && { annotations },
+                // outdated function/tool call handling (TODO deprecate):
+                ...function_call !== void 0 && { function_call }
+              })
+            ),
+            body: {
+              data: chatRequest.data,
+              ...unref(body),
+              // Use unref to unwrap the ref value
+              ...options == null ? void 0 : options.body
+            },
+            streamMode,
+            headers: {
+              ...headers,
+              ...options == null ? void 0 : options.headers
+            },
+            abortController: () => abortController,
+            credentials,
+            onResponse,
+            onUpdate(merged, data2) {
+              mutate([...chatRequest.messages, ...merged]);
+              streamData.value = [...existingData, ...data2 != null ? data2 : []];
+            },
+            onFinish(message) {
+              mutate([...chatRequest.messages, message]);
+              onFinish == null ? void 0 : onFinish(message);
+            },
+            restoreMessagesOnFailure() {
+              mutate(previousMessages);
+            },
+            generateId
+          });
+        },
+        experimental_onFunctionCall,
+        updateChatRequest(newChatRequest) {
+          chatRequest = newChatRequest;
+        },
+        getCurrentMessages: () => messages.value
+      });
+      abortController = null;
+    } catch (err) {
+      if (err.name === "AbortError") {
+        abortController = null;
+        return null;
+      }
+      if (onError && err instanceof Error) {
+        onError(err);
+      }
+      error.value = err;
+    } finally {
+      mutateLoading(() => false);
+    }
+  }
+  const append = async (message, options) => {
+    if (!message.id) {
+      message.id = generateId();
+    }
+    return triggerRequest(messages.value.concat(message), options);
+  };
+  const reload = async (options) => {
+    const messagesSnapshot = messages.value;
+    if (messagesSnapshot.length === 0)
+      return null;
+    const lastMessage = messagesSnapshot[messagesSnapshot.length - 1];
+    if (lastMessage.role === "assistant") {
+      return triggerRequest(messagesSnapshot.slice(0, -1), options);
+    }
+    return triggerRequest(messagesSnapshot, options);
+  };
+  const stop = () => {
+    if (abortController) {
+      abortController.abort();
+      abortController = null;
+    }
+  };
+  const setMessages = (messages2) => {
+    mutate(messages2);
+  };
+  const input = ref(initialInput);
+  const handleSubmit = (e, options = {}) => {
+    e.preventDefault();
+    const inputValue = input.value;
+    if (!inputValue)
+      return;
+    append(
+      {
+        content: inputValue,
+        role: "user"
+      },
+      options
+    );
+    input.value = "";
+  };
+  return {
+    messages,
+    append,
+    error,
+    reload,
+    stop,
+    setMessages,
+    input,
+    handleSubmit,
+    isLoading,
+    data: streamData
+  };
+}
+
+// src/use-completion.ts
+import { callCompletionApi } from "@ai-sdk/ui-utils";
+import swrv2 from "swrv";
+import { ref as ref2, unref as unref2 } from "vue";
+var uniqueId2 = 0;
+var useSWRV2 = swrv2.default || swrv2;
+var store2 = {};
+function useCompletion({
+  api = "/api/completion",
+  id,
+  initialCompletion = "",
+  initialInput = "",
+  credentials,
+  headers,
+  body,
+  streamMode,
+  onResponse,
+  onFinish,
+  onError
+} = {}) {
+  var _a;
+  const completionId = id || `completion-${uniqueId2++}`;
+  const key = `${api}|${completionId}`;
+  const { data, mutate: originalMutate } = useSWRV2(
+    key,
+    () => store2[key] || initialCompletion
+  );
+  const { data: isLoading, mutate: mutateLoading } = useSWRV2(
+    `${completionId}-loading`,
+    null
+  );
+  (_a = isLoading.value) != null ? _a : isLoading.value = false;
+  const { data: streamData, mutate: mutateStreamData } = useSWRV2(`${completionId}-data`, null);
+  data.value || (data.value = initialCompletion);
+  const mutate = (data2) => {
+    store2[key] = data2;
+    return originalMutate();
+  };
+  const completion = data;
+  const error = ref2(void 0);
+  let abortController = null;
+  async function triggerRequest(prompt, options) {
+    var _a2;
+    const existingData = (_a2 = streamData.value) != null ? _a2 : [];
+    return callCompletionApi({
+      api,
+      prompt,
+      credentials,
+      headers: {
+        ...headers,
+        ...options == null ? void 0 : options.headers
+      },
+      body: {
+        ...unref2(body),
+        ...options == null ? void 0 : options.body
+      },
+      streamMode,
+      setCompletion: mutate,
+      setLoading: (loading) => mutateLoading(() => loading),
+      setError: (err) => {
+        error.value = err;
+      },
+      setAbortController: (controller) => {
+        abortController = controller;
+      },
+      onResponse,
+      onFinish,
+      onError,
+      onData: (data2) => {
+        mutateStreamData(() => [...existingData, ...data2 != null ? data2 : []]);
+      }
+    });
+  }
+  const complete = async (prompt, options) => {
+    return triggerRequest(prompt, options);
+  };
+  const stop = () => {
+    if (abortController) {
+      abortController.abort();
+      abortController = null;
+    }
+  };
+  const setCompletion = (completion2) => {
+    mutate(completion2);
+  };
+  const input = ref2(initialInput);
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    const inputValue = input.value;
+    if (!inputValue)
+      return;
+    return complete(inputValue);
+  };
+  return {
+    completion,
+    complete,
+    error,
+    stop,
+    setCompletion,
+    input,
+    handleSubmit,
+    isLoading,
+    data: streamData
+  };
+}
+export {
+  useChat,
+  useCompletion
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/use-chat.ts","../src/use-completion.ts"],"sourcesContent":["import type {\n  ChatRequest,\n  ChatRequestOptions,\n  CreateMessage,\n  JSONValue,\n  Message,\n  UseChatOptions,\n} from '@ai-sdk/ui-utils';\nimport {\n  callChatApi,\n  generateId as generateIdFunc,\n  processChatStream,\n} from '@ai-sdk/ui-utils';\nimport swrv from 'swrv';\nimport type { Ref } from 'vue';\nimport { ref, unref } from 'vue';\n\nexport type { CreateMessage, Message, UseChatOptions };\n\nexport type UseChatHelpers = {\n  /** Current messages in the chat */\n  messages: Ref<Message[]>;\n  /** The error object of the API request */\n  error: Ref<undefined | Error>;\n  /**\n   * Append a user message to the chat list. This triggers the API call to fetch\n   * the assistant's response.\n   */\n  append: (\n    message: Message | CreateMessage,\n    chatRequestOptions?: ChatRequestOptions,\n  ) => Promise<string | null | undefined>;\n  /**\n   * Reload the last AI chat response for the given chat history. If the last\n   * message isn't from the assistant, it will request the API to generate a\n   * new response.\n   */\n  reload: (\n    chatRequestOptions?: ChatRequestOptions,\n  ) => Promise<string | null | undefined>;\n  /**\n   * Abort the current request immediately, keep the generated tokens if any.\n   */\n  stop: () => void;\n  /**\n   * Update the `messages` state locally. This is useful when you want to\n   * edit the messages on the client, and then trigger the `reload` method\n   * manually to regenerate the AI response.\n   */\n  setMessages: (messages: Message[]) => void;\n  /** The current value of the input */\n  input: Ref<string>;\n  /** Form submission handler to automatically reset input and append a user message  */\n  handleSubmit: (e: any, chatRequestOptions?: ChatRequestOptions) => void;\n  /** Whether the API request is in progress */\n  isLoading: Ref<boolean | undefined>;\n\n  /** Additional data added on the server via StreamData */\n  data: Ref<JSONValue[] | undefined>;\n};\n\nlet uniqueId = 0;\n\n// @ts-expect-error - some issues with the default export of useSWRV\nconst useSWRV = (swrv.default as typeof import('swrv')['default']) || swrv;\nconst store: Record<string, Message[] | undefined> = {};\n\nexport function useChat({\n  api = '/api/chat',\n  id,\n  initialMessages = [],\n  initialInput = '',\n  sendExtraMessageFields,\n  experimental_onFunctionCall,\n  streamMode,\n  onResponse,\n  onFinish,\n  onError,\n  credentials,\n  headers,\n  body,\n  generateId = generateIdFunc,\n}: UseChatOptions = {}): UseChatHelpers {\n  // Generate a unique ID for the chat if not provided.\n  const chatId = id || `chat-${uniqueId++}`;\n\n  const key = `${api}|${chatId}`;\n  const { data: messagesData, mutate: originalMutate } = useSWRV<Message[]>(\n    key,\n    () => store[key] || initialMessages,\n  );\n\n  const { data: isLoading, mutate: mutateLoading } = useSWRV<boolean>(\n    `${chatId}-loading`,\n    null,\n  );\n\n  isLoading.value ??= false;\n\n  // Force the `data` to be `initialMessages` if it's `undefined`.\n  messagesData.value ??= initialMessages;\n\n  const mutate = (data?: Message[]) => {\n    store[key] = data;\n    return originalMutate();\n  };\n\n  // Because of the `initialData` option, the `data` will never be `undefined`.\n  const messages = messagesData as Ref<Message[]>;\n\n  const error = ref<undefined | Error>(undefined);\n  // cannot use JSONValue[] in ref because of infinite Typescript recursion:\n  const streamData = ref<undefined | unknown[]>(undefined);\n\n  let abortController: AbortController | null = null;\n  async function triggerRequest(\n    messagesSnapshot: Message[],\n    { options, data }: ChatRequestOptions = {},\n  ) {\n    try {\n      error.value = undefined;\n      mutateLoading(() => true);\n\n      abortController = new AbortController();\n\n      // Do an optimistic update to the chat state to show the updated messages\n      // immediately.\n      const previousMessages = messagesData.value;\n      mutate(messagesSnapshot);\n\n      let chatRequest: ChatRequest = {\n        messages: messagesSnapshot,\n        options,\n        data,\n      };\n\n      await processChatStream({\n        getStreamedResponse: async () => {\n          const existingData = (streamData.value ?? []) as JSONValue[];\n\n          return await callChatApi({\n            api,\n            messages: sendExtraMessageFields\n              ? chatRequest.messages\n              : chatRequest.messages.map(\n                  ({\n                    role,\n                    content,\n                    name,\n                    data,\n                    annotations,\n                    function_call,\n                  }) => ({\n                    role,\n                    content,\n                    ...(name !== undefined && { name }),\n                    ...(data !== undefined && { data }),\n                    ...(annotations !== undefined && { annotations }),\n                    // outdated function/tool call handling (TODO deprecate):\n                    ...(function_call !== undefined && { function_call }),\n                  }),\n                ),\n            body: {\n              data: chatRequest.data,\n              ...unref(body), // Use unref to unwrap the ref value\n              ...options?.body,\n            },\n            streamMode,\n            headers: {\n              ...headers,\n              ...options?.headers,\n            },\n            abortController: () => abortController,\n            credentials,\n            onResponse,\n            onUpdate(merged, data) {\n              mutate([...chatRequest.messages, ...merged]);\n              streamData.value = [...existingData, ...(data ?? [])];\n            },\n            onFinish(message) {\n              // workaround: sometimes the last chunk is not shown in the UI.\n              // push it twice to make sure it's displayed.\n              mutate([...chatRequest.messages, message]);\n              onFinish?.(message);\n            },\n            restoreMessagesOnFailure() {\n              // Restore the previous messages if the request fails.\n              mutate(previousMessages);\n            },\n            generateId,\n          });\n        },\n        experimental_onFunctionCall,\n        updateChatRequest(newChatRequest) {\n          chatRequest = newChatRequest;\n        },\n        getCurrentMessages: () => messages.value,\n      });\n\n      abortController = null;\n    } catch (err) {\n      // Ignore abort errors as they are expected.\n      if ((err as any).name === 'AbortError') {\n        abortController = null;\n        return null;\n      }\n\n      if (onError && err instanceof Error) {\n        onError(err);\n      }\n\n      error.value = err as Error;\n    } finally {\n      mutateLoading(() => false);\n    }\n  }\n\n  const append: UseChatHelpers['append'] = async (message, options) => {\n    if (!message.id) {\n      message.id = generateId();\n    }\n    return triggerRequest(messages.value.concat(message as Message), options);\n  };\n\n  const reload: UseChatHelpers['reload'] = async options => {\n    const messagesSnapshot = messages.value;\n    if (messagesSnapshot.length === 0) return null;\n\n    const lastMessage = messagesSnapshot[messagesSnapshot.length - 1];\n    if (lastMessage.role === 'assistant') {\n      return triggerRequest(messagesSnapshot.slice(0, -1), options);\n    }\n    return triggerRequest(messagesSnapshot, options);\n  };\n\n  const stop = () => {\n    if (abortController) {\n      abortController.abort();\n      abortController = null;\n    }\n  };\n\n  const setMessages = (messages: Message[]) => {\n    mutate(messages);\n  };\n\n  const input = ref(initialInput);\n\n  const handleSubmit = (e: any, options: ChatRequestOptions = {}) => {\n    e.preventDefault();\n    const inputValue = input.value;\n    if (!inputValue) return;\n    append(\n      {\n        content: inputValue,\n        role: 'user',\n      },\n      options,\n    );\n    input.value = '';\n  };\n\n  return {\n    messages,\n    append,\n    error,\n    reload,\n    stop,\n    setMessages,\n    input,\n    handleSubmit,\n    isLoading,\n    data: streamData as Ref<undefined | JSONValue[]>,\n  };\n}\n","import type {\n  JSONValue,\n  RequestOptions,\n  UseCompletionOptions,\n} from '@ai-sdk/ui-utils';\nimport { callCompletionApi } from '@ai-sdk/ui-utils';\nimport swrv from 'swrv';\nimport type { Ref } from 'vue';\nimport { ref, unref } from 'vue';\n\nexport type { UseCompletionOptions };\n\nexport type UseCompletionHelpers = {\n  /** The current completion result */\n  completion: Ref<string>;\n  /** The error object of the API request */\n  error: Ref<undefined | Error>;\n  /**\n   * Send a new prompt to the API endpoint and update the completion state.\n   */\n  complete: (\n    prompt: string,\n    options?: RequestOptions,\n  ) => Promise<string | null | undefined>;\n  /**\n   * Abort the current API request but keep the generated tokens.\n   */\n  stop: () => void;\n  /**\n   * Update the `completion` state locally.\n   */\n  setCompletion: (completion: string) => void;\n  /** The current value of the input */\n  input: Ref<string>;\n  /**\n   * Form submission handler to automatically reset input and append a user message\n   * @example\n   * ```jsx\n   * <form @submit=\"handleSubmit\">\n   *  <input @change=\"handleInputChange\" v-model=\"input\" />\n   * </form>\n   * ```\n   */\n  handleSubmit: (e: any) => void;\n  /** Whether the API request is in progress */\n  isLoading: Ref<boolean | undefined>;\n\n  /** Additional data added on the server via StreamData */\n  data: Ref<JSONValue[] | undefined>;\n};\n\nlet uniqueId = 0;\n\n// @ts-expect-error - some issues with the default export of useSWRV\nconst useSWRV = (swrv.default as typeof import('swrv')['default']) || swrv;\nconst store: Record<string, any> = {};\n\nexport function useCompletion({\n  api = '/api/completion',\n  id,\n  initialCompletion = '',\n  initialInput = '',\n  credentials,\n  headers,\n  body,\n  streamMode,\n  onResponse,\n  onFinish,\n  onError,\n}: UseCompletionOptions = {}): UseCompletionHelpers {\n  // Generate an unique id for the completion if not provided.\n  const completionId = id || `completion-${uniqueId++}`;\n\n  const key = `${api}|${completionId}`;\n  const { data, mutate: originalMutate } = useSWRV<string>(\n    key,\n    () => store[key] || initialCompletion,\n  );\n\n  const { data: isLoading, mutate: mutateLoading } = useSWRV<boolean>(\n    `${completionId}-loading`,\n    null,\n  );\n\n  isLoading.value ??= false;\n\n  const { data: streamData, mutate: mutateStreamData } = useSWRV<\n    JSONValue[] | undefined\n  >(`${completionId}-data`, null);\n\n  // Force the `data` to be `initialCompletion` if it's `undefined`.\n  data.value ||= initialCompletion;\n\n  const mutate = (data: string) => {\n    store[key] = data;\n    return originalMutate();\n  };\n\n  // Because of the `initialData` option, the `data` will never be `undefined`.\n  const completion = data as Ref<string>;\n\n  const error = ref<undefined | Error>(undefined);\n\n  let abortController: AbortController | null = null;\n\n  async function triggerRequest(prompt: string, options?: RequestOptions) {\n    const existingData = (streamData.value ?? []) as JSONValue[];\n    return callCompletionApi({\n      api,\n      prompt,\n      credentials,\n      headers: {\n        ...headers,\n        ...options?.headers,\n      },\n      body: {\n        ...unref(body),\n        ...options?.body,\n      },\n      streamMode,\n      setCompletion: mutate,\n      setLoading: loading => mutateLoading(() => loading),\n      setError: err => {\n        error.value = err;\n      },\n      setAbortController: controller => {\n        abortController = controller;\n      },\n      onResponse,\n      onFinish,\n      onError,\n      onData: data => {\n        mutateStreamData(() => [...existingData, ...(data ?? [])]);\n      },\n    });\n  }\n\n  const complete: UseCompletionHelpers['complete'] = async (\n    prompt,\n    options,\n  ) => {\n    return triggerRequest(prompt, options);\n  };\n\n  const stop = () => {\n    if (abortController) {\n      abortController.abort();\n      abortController = null;\n    }\n  };\n\n  const setCompletion = (completion: string) => {\n    mutate(completion);\n  };\n\n  const input = ref(initialInput);\n\n  const handleSubmit = (e: any) => {\n    e.preventDefault();\n    const inputValue = input.value;\n    if (!inputValue) return;\n    return complete(inputValue);\n  };\n\n  return {\n    completion,\n    complete,\n    error,\n    stop,\n    setCompletion,\n    input,\n    handleSubmit,\n    isLoading,\n    data: streamData,\n  };\n}\n"],"mappings":"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","names":["_a","data","messages","swrv","ref","unref","uniqueId","useSWRV","store","data","_a","completion"]}

package/package.json

@@ -0,0 +1,71 @@
+{
+  "name": "@ai-sdk/vue",
+  "version": "0.0.1",
+  "license": "Apache-2.0",
+  "sideEffects": false,
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    }
+  },
+  "dependencies": {
+    "@ai-sdk/ui-utils": "0.0.1",
+    "swrv": "1.0.4"
+  },
+  "devDependencies": {
+    "@testing-library/jest-dom": "^6.4.5",
+    "@testing-library/user-event": "^14.5.1",
+    "@testing-library/vue": "^8.0.1",
+    "@types/node": "^18",
+    "@vitejs/plugin-vue": "4.5.0",
+    "eslint": "^7.32.0",
+    "jsdom": "^24.0.0",
+    "msw": "2.0.9",
+    "tsup": "^7.2.0",
+    "typescript": "5.1.3",
+    "@vercel/ai-tsconfig": "0.0.0",
+    "eslint-config-vercel-ai": "0.0.0"
+  },
+  "peerDependencies": {
+    "vue": "^3.3.4"
+  },
+  "peerDependenciesMeta": {
+    "vue": {
+      "optional": true
+    }
+  },
+  "engines": {
+    "node": ">=18"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "homepage": "https://sdk.vercel.ai/docs",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/vercel/ai.git"
+  },
+  "bugs": {
+    "url": "https://github.com/vercel/ai/issues"
+  },
+  "keywords": [
+    "ai",
+    "vue"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "clean": "rm -rf dist",
+    "dev": "tsup --watch",
+    "lint": "eslint \"./**/*.ts*\"",
+    "type-check": "tsc --noEmit",
+    "prettier-check": "prettier --check \"./**/*.ts*\"",
+    "test": "vitest --config vitest.config.js --run",
+    "test:watch": "vitest --config vitest.config.js"
+  }
+}

package/src/TestChatComponent.vue

@@ -0,0 +1,26 @@
+<script setup lang="ts">
+import { useChat } from './use-chat';
+
+const { messages, append, data, error, isLoading } = useChat();
+</script>
+
+<template>
+  <div class="flex flex-col w-full max-w-md py-24 mx-auto stretch">
+    <div data-testid="loading">{{ isLoading?.toString() }}</div>
+    <div data-testid="error">{{ error?.toString() }}</div>
+    <div data-testid="data">{{ JSON.stringify(data) }}</div>
+    <div
+      v-for="(m, idx) in messages"
+      key="m.id"
+      :data-testid="`message-${idx}`"
+    >
+      {{ m.role === 'user' ? 'User: ' : 'AI: ' }}
+      {{ m.content }}
+    </div>
+
+    <button
+      data-testid="button"
+      @click="append({ role: 'user', content: 'hi' })"
+    />
+  </div>
+</template>

package/src/TestChatTextStreamComponent.vue

@@ -0,0 +1,28 @@
+<script setup lang="ts">
+import { useChat } from './use-chat';
+
+const { messages, append, data, error, isLoading } = useChat({
+  streamMode: 'text',
+});
+</script>
+
+<template>
+  <div class="flex flex-col w-full max-w-md py-24 mx-auto stretch">
+    <div data-testid="loading">{{ isLoading?.toString() }}</div>
+    <div data-testid="error">{{ error?.toString() }}</div>
+    <div data-testid="data">{{ JSON.stringify(data) }}</div>
+    <div
+      v-for="(m, idx) in messages"
+      key="m.id"
+      :data-testid="`message-${idx}`"
+    >
+      {{ m.role === 'user' ? 'User: ' : 'AI: ' }}
+      {{ m.content }}
+    </div>
+
+    <button
+      data-testid="button"
+      @click="append({ role: 'user', content: 'hi' })"
+    />
+  </div>
+</template>

package/src/TestCompletionComponent.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import { useCompletion } from './use-completion';
+
+const { completion, handleSubmit, input, isLoading, error } = useCompletion();
+</script>
+
+<template>
+  <div class="flex flex-col w-full max-w-md py-24 mx-auto stretch">
+    <div data-testid="loading">{{ isLoading?.toString() }}</div>
+    <div data-testid="error">{{ error?.toString() }}</div>
+    <div data-testid="completion">{{ completion }}</div>
+
+    <form @submit="handleSubmit">
+      <input data-testid="input" v-model="input" />
+    </form>
+  </div>
+</template>

package/src/TestCompletionTextStreamComponent.vue

@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import { useCompletion } from './use-completion';
+
+const { completion, handleSubmit, input, isLoading, error } = useCompletion({
+  streamMode: 'text',
+});
+</script>
+
+<template>
+  <div class="flex flex-col w-full max-w-md py-24 mx-auto stretch">
+    <div data-testid="loading">{{ isLoading?.toString() }}</div>
+    <div data-testid="error">{{ error?.toString() }}</div>
+    <div data-testid="completion">{{ completion }}</div>
+
+    <form @submit="handleSubmit">
+      <input data-testid="input" v-model="input" />
+    </form>
+  </div>
+</template>

package/src/index.ts

@@ -0,0 +1,2 @@
+export * from './use-chat';
+export * from './use-completion';

package/src/package.json

@@ -0,0 +1,10 @@
+{
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": "./dist/index.mjs",
+  "private": true,
+  "peerDependencies": {
+    "vue": "*"
+  }
+}

package/src/shims-vue.d.ts

@@ -0,0 +1,5 @@
+// required for vue testing library
+declare module '*.vue' {
+  import Vue from 'vue';
+  export default Vue;
+}