@copilotkit/vue 2.0.0-rc.1 → 2.0.0-rc.11

package/src/v2/components/chat/BasicMarkdown.vue

@@ -1,158 +0,0 @@
-<script setup lang="ts">
-import { computed, h, type VNode } from "vue";
-import { parseMarkdown, type MarkdownToken } from "@copilotkit/core";
-
-const props = withDefaults(
-  defineProps<{ content: string; isStreaming?: boolean }>(),
-  { isStreaming: false },
-);
-
-const tokens = computed(() => parseMarkdown(props.content ?? ""));
-
-// Allowlist URL schemes to prevent XSS via javascript:/data:/vbscript: URIs.
-const SAFE_HREF = /^(https?:|mailto:|tel:|#|\/|\.\/|\.\.\/)/i;
-const SAFE_IMG_SRC = /^(https?:|data:image\/(?!svg)|\/|\.\/|\.\.\/)/i;
-
-function sanitizeHref(href: string | undefined): string | undefined {
-  if (!href) return undefined;
-  return SAFE_HREF.test(href.trim()) ? href : undefined;
-}
-function sanitizeImgSrc(src: string | undefined): string | undefined {
-  if (!src) return undefined;
-  return SAFE_IMG_SRC.test(src.trim()) ? src : undefined;
-}
-
-function inline(toks: MarkdownToken[] | undefined): (VNode | string)[] {
-  if (!toks) return [];
-  return toks.map((t) => {
-    switch (t.type) {
-      case "text":
-        return "tokens" in t && (t as any).tokens
-          ? h("span", inline((t as any).tokens))
-          : (t as any).text;
-      case "strong":
-        return h("strong", inline((t as any).tokens));
-      case "em":
-        return h("em", inline((t as any).tokens));
-      case "del":
-        return h("del", inline((t as any).tokens));
-      case "codespan":
-        return h(
-          "code",
-          { class: "cpk:rounded cpk:bg-black/5 cpk:px-1 cpk:py-0.5" },
-          (t as any).text,
-        );
-      case "br":
-        return h("br");
-      case "link":
-        return h(
-          "a",
-          {
-            href: sanitizeHref((t as any).href),
-            target: "_blank",
-            rel: "noopener noreferrer",
-          },
-          (t as any).tokens ? inline((t as any).tokens) : (t as any).text,
-        );
-      case "image":
-        return h("img", {
-          src: sanitizeImgSrc((t as any).href),
-          alt: (t as any).text,
-          class: "cpk:max-w-full",
-        });
-      case "escape":
-        return (t as any).text;
-      default:
-        return "text" in t ? (t as any).text : "";
-    }
-  });
-}
-
-function block(t: MarkdownToken): VNode | null {
-  switch (t.type) {
-    case "space":
-      return null;
-    case "heading": {
-      const depth = Math.min(Math.max((t as any).depth, 1), 6);
-      return h(`h${depth}`, inline((t as any).tokens));
-    }
-    case "paragraph":
-      return h("p", inline((t as any).tokens));
-    case "blockquote":
-      return h(
-        "blockquote",
-        (((t as any).tokens as MarkdownToken[] | undefined) ?? [])
-          .map(block)
-          .filter(Boolean),
-      );
-    case "code":
-      return h("pre", { class: "cpk:overflow-x-auto cpk:rounded-lg cpk:p-3" }, [
-        h(
-          "code",
-          { "data-language": (t as any).lang || undefined },
-          (t as any).text,
-        ),
-      ]);
-    case "hr":
-      return h("hr");
-    case "list": {
-      const list = t as any;
-      const items = list.items.map((it: any) =>
-        h(
-          "li",
-          ((it.tokens as MarkdownToken[] | undefined) ?? [])
-            .map(block)
-            .filter(Boolean),
-        ),
-      );
-      return list.ordered
-        ? h(
-            "ol",
-            { start: typeof list.start === "number" ? list.start : undefined },
-            items,
-          )
-        : h("ul", items);
-    }
-    case "table": {
-      const tbl = t as any;
-      return h("div", { class: "cpk:overflow-x-auto" }, [
-        h("table", [
-          h("thead", [
-            h(
-              "tr",
-              tbl.header.map((c: any) => h("th", inline(c.tokens))),
-            ),
-          ]),
-          h(
-            "tbody",
-            tbl.rows.map((row: any) =>
-              h(
-                "tr",
-                row.map((c: any) => h("td", inline(c.tokens))),
-              ),
-            ),
-          ),
-        ]),
-      ]);
-    }
-    case "text":
-      return h(
-        "p",
-        (t as any).tokens ? inline((t as any).tokens) : (t as any).text,
-      );
-    default:
-      return "text" in t ? h("span", (t as any).text) : null;
-  }
-}
-
-const Rendered = () =>
-  h(
-    "div",
-    { class: "copilot-chat-assistant-markdown" },
-    tokens.value.map(block).filter(Boolean),
-  );
-</script>
-
-<template>
-  <Rendered v-if="tokens.length" />
-</template>

package/src/v2/components/chat/__tests__/BasicMarkdown.test.ts

@@ -1,69 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { mount } from "@vue/test-utils";
-import BasicMarkdown from "../BasicMarkdown.vue";
-
-describe("BasicMarkdown.vue", () => {
-  it("renders headings", () => {
-    const w = mount(BasicMarkdown, { props: { content: "# Title" } });
-    expect(w.find("h1").text()).toBe("Title");
-  });
-
-  it("renders bold/italic", () => {
-    const w = mount(BasicMarkdown, { props: { content: "**b** *i*" } });
-    expect(w.find("strong").text()).toBe("b");
-    expect(w.find("em").text()).toBe("i");
-  });
-
-  it("renders code blocks", () => {
-    const w = mount(BasicMarkdown, { props: { content: "```\nx\n```" } });
-    expect(w.find("pre code").text()).toContain("x");
-  });
-
-  it("renders tables", () => {
-    const w = mount(BasicMarkdown, {
-      props: { content: "| a | b |\n| --- | --- |\n| 1 | 2 |" },
-    });
-    expect(w.findAll("th")).toHaveLength(2);
-    expect(w.findAll("tbody td")).toHaveLength(2);
-  });
-
-  it("renders links with safe href", () => {
-    const w = mount(BasicMarkdown, {
-      props: { content: "[CK](https://copilotkit.ai)" },
-    });
-    expect(w.find("a").attributes("href")).toBe("https://copilotkit.ai");
-  });
-
-  it("neutralizes javascript: URIs in links (no XSS)", () => {
-    const w = mount(BasicMarkdown, {
-      props: { content: "[x](javascript:alert(1))" },
-    });
-    expect(w.find("a").attributes("href")).toBeUndefined();
-  });
-
-  it("neutralizes javascript: image src", () => {
-    const w = mount(BasicMarkdown, {
-      props: { content: "![x](javascript:alert(1))" },
-    });
-    expect(w.find("img").attributes("src")).toBeUndefined();
-  });
-
-  it("renders nothing for empty content", () => {
-    const w = mount(BasicMarkdown, { props: { content: "" } });
-    expect(w.text()).toBe("");
-  });
-
-  it("rejects data:image/svg+xml image src (SVG script vector)", () => {
-    const w = mount(BasicMarkdown, {
-      props: { content: "![x](data:image/svg+xml;base64,PHN2Zz48L3N2Zz4=)" },
-    });
-    expect(w.find("img").attributes("src")).toBeUndefined();
-  });
-
-  it("still allows data:image/png image src", () => {
-    const w = mount(BasicMarkdown, {
-      props: { content: "![x](data:image/png;base64,iVBORw0KGgo=)" },
-    });
-    expect(w.find("img").attributes("src")).toContain("data:image/png");
-  });
-});

package/src/v2/lib/__tests__/processPartialHtml.test.ts

@@ -1,84 +0,0 @@
-import { describe, it, expect } from "vitest";
-import {
-  processPartialHtml,
-  extractCompleteStyles,
-} from "../processPartialHtml";
-
-describe("processPartialHtml", () => {
-  it("returns empty string for empty input", () => {
-    expect(processPartialHtml("")).toBe("");
-  });
-
-  it("strips incomplete tag at end", () => {
-    expect(processPartialHtml('<div>Hello<span class="fo')).toBe("<div>Hello");
-  });
-
-  it("strips complete <style> blocks", () => {
-    const input =
-      "<div>Hello</div><style>.foo { color: red; }</style><p>World</p>";
-    expect(processPartialHtml(input)).toBe("<div>Hello</div><p>World</p>");
-  });
-
-  it("strips complete <script> blocks", () => {
-    const input = '<div>Hello</div><script>alert("hi")</script><p>World</p>';
-    expect(processPartialHtml(input)).toBe("<div>Hello</div><p>World</p>");
-  });
-
-  it("strips incomplete <style> block", () => {
-    const input = "<div>Hello</div><style>.foo { color:";
-    expect(processPartialHtml(input)).toBe("<div>Hello</div>");
-  });
-
-  it("strips incomplete <script> block", () => {
-    const input = '<div>Hello</div><script>const x = "val';
-    expect(processPartialHtml(input)).toBe("<div>Hello</div>");
-  });
-
-  it("strips incomplete HTML entities", () => {
-    expect(processPartialHtml("<p>Hello &amp")).toBe("<p>Hello ");
-    expect(processPartialHtml("<p>Hello &#123")).toBe("<p>Hello ");
-  });
-
-  it("preserves complete entities", () => {
-    expect(processPartialHtml("<p>Hello &amp; World</p>")).toBe(
-      "<p>Hello &amp; World</p>",
-    );
-  });
-
-  it("extracts body content from full HTML document", () => {
-    const input =
-      "<html><head><title>Test</title></head><body><p>Content</p></body></html>";
-    expect(processPartialHtml(input)).toBe("<p>Content</p>");
-  });
-
-  it("handles <body> with attributes", () => {
-    const input = '<body class="dark"><p>Content</p></body>';
-    expect(processPartialHtml(input)).toBe("<p>Content</p>");
-  });
-
-  it("handles no <body> tag", () => {
-    const input = "<div><p>Just content</p></div>";
-    expect(processPartialHtml(input)).toBe("<div><p>Just content</p></div>");
-  });
-});
-
-describe("extractCompleteStyles", () => {
-  it("returns empty string for no styles", () => {
-    expect(extractCompleteStyles("<div>Hello</div>")).toBe("");
-  });
-
-  it("extracts a single complete style block", () => {
-    const input =
-      "<div>Hello</div><style>.foo { color: red; }</style><p>World</p>";
-    expect(extractCompleteStyles(input)).toBe(
-      "<style>.foo { color: red; }</style>",
-    );
-  });
-
-  it("extracts multiple complete style blocks", () => {
-    const input = "<style>a{}</style><div>X</div><style>b{}</style>";
-    expect(extractCompleteStyles(input)).toBe(
-      "<style>a{}</style><style>b{}</style>",
-    );
-  });
-});

package/src/v2/lib/__tests__/transcription-client.test.ts

@@ -1,67 +0,0 @@
-import { afterEach, describe, expect, it, vi } from "vitest";
-import { TranscriptionErrorCode } from "@copilotkit/shared";
-import type { TranscriptionError } from "../transcription-client";
-import { transcribeAudio } from "../transcription-client";
-import type { CopilotKitCoreVue } from "../vue-core";
-
-describe("transcription-client", () => {
-  const originalFetch = globalThis.fetch;
-
-  afterEach(() => {
-    globalThis.fetch = originalFetch;
-  });
-
-  it("transcribes audio in REST mode", async () => {
-    globalThis.fetch = vi.fn().mockResolvedValue({
-      ok: true,
-      json: async () => ({
-        text: "Transcribed text",
-        size: 12,
-        type: "audio/webm",
-      }),
-    } satisfies Partial<Response>) as typeof fetch;
-
-    const result = await transcribeAudio(
-      {
-        runtimeUrl: "/api/copilotkit",
-        runtimeTransport: "rest",
-        headers: {},
-        resolveHeaders: async () => ({}),
-      } as CopilotKitCoreVue,
-      new Blob(["audio"], { type: "audio/webm" }),
-    );
-
-    expect(globalThis.fetch).toHaveBeenCalledTimes(1);
-    expect(result.text).toBe("Transcribed text");
-  });
-
-  it("maps structured error responses to TranscriptionError", async () => {
-    globalThis.fetch = vi.fn().mockResolvedValue({
-      ok: false,
-      status: 429,
-      statusText: "Too Many Requests",
-      json: async () => ({
-        error: TranscriptionErrorCode.RATE_LIMITED,
-        message: "Rate limited",
-        retryable: true,
-      }),
-    } satisfies Partial<Response>) as typeof fetch;
-
-    await expect(
-      transcribeAudio(
-        {
-          runtimeUrl: "/api/copilotkit",
-          runtimeTransport: "rest",
-          headers: {},
-          resolveHeaders: async () => ({}),
-        } as CopilotKitCoreVue,
-        new Blob(["audio"], { type: "audio/webm" }),
-      ),
-    ).rejects.toMatchObject({
-      info: {
-        code: TranscriptionErrorCode.RATE_LIMITED,
-        retryable: true,
-      },
-    } satisfies Partial<TranscriptionError>);
-  });
-});

package/src/v2/lib/transcription-client.ts

@@ -1,151 +0,0 @@
-import type { CopilotKitCoreVue } from "./vue-core";
-import { TranscriptionErrorCode } from "@copilotkit/shared";
-import type { TranscriptionErrorResponse } from "@copilotkit/shared";
-
-export interface TranscriptionResult {
-  text: string;
-  size: number;
-  type: string;
-}
-
-export interface TranscriptionErrorInfo {
-  code: TranscriptionErrorCode;
-  message: string;
-  retryable: boolean;
-}
-
-export { TranscriptionErrorCode };
-
-async function blobToBase64(blob: Blob): Promise<string> {
-  return await new Promise((resolve, reject) => {
-    const reader = new FileReader();
-    reader.onloadend = () => {
-      const result = reader.result as string;
-      resolve(result.split(",")[1] ?? "");
-    };
-    reader.addEventListener("error", () =>
-      reject(new Error("Failed to read audio data")),
-    );
-    reader.readAsDataURL(blob);
-  });
-}
-
-function isTranscriptionErrorResponse(
-  data: unknown,
-): data is TranscriptionErrorResponse {
-  return (
-    typeof data === "object" &&
-    data !== null &&
-    "error" in data &&
-    "message" in data &&
-    typeof (data as TranscriptionErrorResponse).error === "string" &&
-    typeof (data as TranscriptionErrorResponse).message === "string"
-  );
-}
-
-function parseTranscriptionError(
-  response: TranscriptionErrorResponse,
-): TranscriptionErrorInfo {
-  return {
-    code: response.error,
-    message: response.message,
-    retryable: response.retryable ?? false,
-  };
-}
-
-export class TranscriptionError extends Error {
-  public readonly info: TranscriptionErrorInfo;
-
-  constructor(info: TranscriptionErrorInfo) {
-    super(info.message);
-    this.name = "TranscriptionError";
-    this.info = info;
-  }
-}
-
-export async function transcribeAudio(
-  core: CopilotKitCoreVue,
-  audioBlob: Blob,
-  filename: string = "recording.webm",
-): Promise<TranscriptionResult> {
-  const runtimeUrl = core.runtimeUrl;
-  if (!runtimeUrl) {
-    throw new TranscriptionError({
-      code: TranscriptionErrorCode.INVALID_REQUEST,
-      message: "Runtime URL is not configured",
-      retryable: false,
-    });
-  }
-
-  const headers: Record<string, string> = { ...(await core.resolveHeaders()) };
-  let response: Response;
-
-  try {
-    if (core.runtimeTransport === "single") {
-      const base64Audio = await blobToBase64(audioBlob);
-
-      headers["Content-Type"] = "application/json";
-
-      response = await fetch(runtimeUrl, {
-        method: "POST",
-        headers,
-        body: JSON.stringify({
-          method: "transcribe",
-          body: {
-            audio: base64Audio,
-            mimeType: audioBlob.type || "audio/webm",
-            filename,
-          },
-        }),
-      });
-    } else {
-      delete headers["Content-Type"];
-
-      const formData = new FormData();
-      formData.append("audio", audioBlob, filename);
-
-      response = await fetch(`${runtimeUrl}/transcribe`, {
-        method: "POST",
-        headers,
-        body: formData,
-      });
-    }
-  } catch (error) {
-    throw new TranscriptionError({
-      code: TranscriptionErrorCode.NETWORK_ERROR,
-      message:
-        error instanceof Error ? error.message : "Network request failed",
-      retryable: true,
-    });
-  }
-
-  if (!response.ok) {
-    let errorData: unknown;
-    try {
-      errorData = await response.json();
-    } catch {
-      throw new TranscriptionError({
-        code: TranscriptionErrorCode.PROVIDER_ERROR,
-        message: `HTTP ${response.status}: ${response.statusText}`,
-        retryable: response.status >= 500,
-      });
-    }
-
-    if (isTranscriptionErrorResponse(errorData)) {
-      throw new TranscriptionError(parseTranscriptionError(errorData));
-    }
-
-    throw new TranscriptionError({
-      code: TranscriptionErrorCode.PROVIDER_ERROR,
-      message:
-        typeof errorData === "object" &&
-        errorData !== null &&
-        "message" in errorData
-          ? String((errorData as { message: unknown }).message)
-          : "Transcription failed",
-      retryable: response.status >= 500,
-    });
-  }
-
-  return (await response.json()) as TranscriptionResult;
-}