@assistant-ui/react 0.5.92 → 0.5.93

package/src/tailwindcss/index.ts

@@ -0,0 +1,142 @@
+import plugin from "tailwindcss/plugin.js";
+import baseComponentsCSS from "../../generated/base-components.css.json";
+import threadCSS from "../../generated/thread.css.json";
+import modalCSS from "../../generated/modal.css.json";
+import defaultThemeCSS from "../../generated/default.css.json";
+
+type AssistantTailwindPluginColors = {
+  border: string;
+  input: string;
+  ring: string;
+  background: string;
+  foreground: string;
+  primary: {
+    DEFAULT: string;
+    foreground: string;
+  };
+  secondary: {
+    DEFAULT: string;
+    foreground: string;
+  };
+  destructive: {
+    DEFAULT: string;
+    foreground: string;
+  };
+  muted: {
+    DEFAULT: string;
+    foreground: string;
+  };
+  accent: {
+    DEFAULT: string;
+    foreground: string;
+  };
+  popover: {
+    DEFAULT: string;
+    foreground: string;
+  };
+  card: {
+    DEFAULT: string;
+    foreground: string;
+  };
+};
+
+type AssisstantTailwindPluginOptions = {
+  components?: ("default-theme" | "base" | "thread" | "assistant-modal")[];
+  colors?: AssistantTailwindPluginColors;
+  shadcn?: boolean;
+};
+
+const auiPlugin = plugin.withOptions<AssisstantTailwindPluginOptions>(
+  ({ components = ["assistant-modal", "thread"], shadcn = false } = {}) =>
+    ({ addComponents }) => {
+      const assistantModal = components.includes("assistant-modal");
+      const thread = assistantModal || components.includes("thread");
+      const base = thread || components.includes("base");
+      const defaultTheme = components.includes("default-theme");
+
+      if (defaultTheme && shadcn)
+        throw new Error("default-theme cannot be used with shadcn");
+
+      if (defaultTheme || (base && !shadcn)) {
+        addComponents(defaultThemeCSS);
+      }
+
+      if (base) {
+        addComponents(baseComponentsCSS);
+      }
+
+      if (thread) {
+        addComponents(threadCSS);
+      }
+
+      if (assistantModal) {
+        addComponents(modalCSS);
+      }
+    },
+  ({ shadcn = false, colors = {} } = {}) => {
+    const prefix = !shadcn ? "--aui-" : "--";
+    return {
+      safelist: [{ pattern: /aui-/ }],
+      theme: {
+        extend: {
+          colors: {
+            aui: {
+              border: colors.border ?? `hsl(var(${prefix}border))`,
+              input: colors.input ?? `hsl(var(${prefix}input))`,
+              ring: colors.ring ?? `hsl(var(${prefix}ring))`,
+              background: colors.background ?? `hsl(var(${prefix}background))`,
+              foreground: colors.foreground ?? `hsl(var(${prefix}foreground))`,
+              primary: {
+                DEFAULT:
+                  colors.primary?.DEFAULT ?? `hsl(var(${prefix}primary))`,
+                foreground:
+                  colors.primary?.foreground ??
+                  `hsl(var(${prefix}primary-foreground))`,
+              },
+              secondary: {
+                DEFAULT:
+                  colors.secondary?.DEFAULT ?? `hsl(var(${prefix}secondary))`,
+                foreground:
+                  colors.secondary?.foreground ??
+                  `hsl(var(${prefix}secondary-foreground))`,
+              },
+              destructive: {
+                DEFAULT:
+                  colors.destructive?.DEFAULT ??
+                  `hsl(var(${prefix}destructive))`,
+                foreground: `hsl(var(${prefix}destructive-foreground))`,
+              },
+              muted: {
+                DEFAULT: `hsl(var(${prefix}muted))`,
+                foreground:
+                  colors.muted?.foreground ??
+                  `hsl(var(${prefix}muted-foreground))`,
+              },
+              accent: {
+                DEFAULT: colors.accent?.DEFAULT ?? `hsl(var(${prefix}accent))`,
+                foreground:
+                  colors.accent?.foreground ??
+                  `hsl(var(${prefix}accent-foreground))`,
+              },
+              popover: {
+                DEFAULT:
+                  colors.popover?.DEFAULT ?? `hsl(var(${prefix}popover))`,
+                foreground:
+                  colors.popover?.foreground ??
+                  `hsl(var(${prefix}popover-foreground))`,
+              },
+              card: {
+                DEFAULT: colors.card?.DEFAULT ?? `hsl(var(${prefix}card))`,
+                foreground:
+                  colors.card?.foreground ??
+                  `hsl(var(${prefix}card-foreground))`,
+              },
+            },
+          },
+        },
+      },
+    };
+  },
+);
+
+export default auiPlugin;

package/src/types/AssistantTypes.ts

@@ -0,0 +1,198 @@
+import { LanguageModelV1LogProbs } from "@ai-sdk/provider";
+import type { ReactNode } from "react";
+import { CompleteAttachment } from "./AttachmentTypes";
+
+export type TextContentPart = {
+  type: "text";
+  text: string;
+};
+
+export type ImageContentPart = {
+  type: "image";
+  image: string;
+};
+
+export type Unstable_AudioContentPart = {
+  type: "audio";
+  audio: {
+    data: string;
+    format: "mp3" | "wav";
+  };
+};
+
+export type UIContentPart = {
+  type: "ui";
+  display: ReactNode;
+};
+
+export type CoreToolCallContentPart<
+  TArgs extends Record<string, unknown> = Record<string | number, unknown>,
+  TResult = unknown,
+> = {
+  type: "tool-call";
+  toolCallId: string;
+  toolName: string;
+  args: TArgs;
+  result?: TResult | undefined;
+  isError?: boolean | undefined;
+};
+
+export type ToolCallContentPart<
+  TArgs extends Record<string, unknown> = Record<string | number, unknown>,
+  TResult = unknown,
+> = CoreToolCallContentPart<TArgs, TResult> & {
+  argsText: string;
+};
+
+export type ThreadUserContentPart =
+  | TextContentPart
+  | ImageContentPart
+  | Unstable_AudioContentPart
+  | UIContentPart;
+
+export type ThreadAssistantContentPart =
+  | TextContentPart
+  | ToolCallContentPart
+  | UIContentPart;
+
+type MessageCommonProps = {
+  id: string;
+  createdAt: Date;
+};
+
+/**
+ * @deprecated Use `ThreadStep` instead. This type will be removed in v0.6.
+ */
+export type ThreadRoundtrip = ThreadStep;
+
+export type ThreadStep = {
+  /**
+   * @deprecated This field will be removed in v0.6. Submit feedback if you need this functionality.
+   */
+  logprobs?: LanguageModelV1LogProbs | undefined;
+  usage?:
+    | {
+        promptTokens: number;
+        completionTokens: number;
+      }
+    | undefined;
+};
+
+export type ContentPartStatus =
+  | {
+      type: "running";
+    }
+  | {
+      type: "complete";
+    }
+  | {
+      type: "incomplete";
+      reason: "cancelled" | "length" | "content-filter" | "other" | "error";
+      error?: unknown;
+    };
+
+export type ToolCallContentPartStatus =
+  | {
+      type: "requires-action";
+      reason: "tool-calls";
+    }
+  | ContentPartStatus;
+
+export type MessageStatus =
+  | {
+      type: "running";
+    }
+  | {
+      type: "requires-action";
+      reason: "tool-calls";
+    }
+  | {
+      type: "complete";
+      reason: "stop" | "unknown";
+    }
+  | {
+      type: "incomplete";
+      reason:
+        | "cancelled"
+        | "tool-calls"
+        | "length"
+        | "content-filter"
+        | "other"
+        | "error";
+      error?: unknown;
+    };
+
+export type ThreadSystemMessage = MessageCommonProps & {
+  role: "system";
+  content: [TextContentPart];
+};
+
+export type ThreadUserMessage = MessageCommonProps & {
+  role: "user";
+  content: ThreadUserContentPart[];
+  attachments: readonly CompleteAttachment[];
+  // TODO metadata
+};
+
+export type ThreadAssistantMessage = MessageCommonProps & {
+  role: "assistant";
+  content: ThreadAssistantContentPart[];
+  status: MessageStatus;
+  /**
+   * @deprecated Use `metadata.steps` instead.
+   */
+  roundtrips?: ThreadStep[] | undefined;
+  metadata?: {
+    /**
+     * @deprecated Use `steps` instead. This field will be removed in v0.6.
+     */
+    roundtrips?: ThreadStep[] | undefined;
+    steps?: ThreadStep[] | undefined;
+    custom?: Record<string, unknown> | undefined;
+  };
+};
+
+export type AppendMessage = CoreMessage & {
+  parentId: string | null;
+  // TODO make required in the next major version
+  attachments?: readonly CompleteAttachment[] | undefined;
+};
+
+type BaseThreadMessage = {
+  status?: ThreadAssistantMessage["status"];
+  metadata?: ThreadAssistantMessage["metadata"];
+  attachments?: ThreadUserMessage["attachments"];
+};
+
+export type ThreadMessage = BaseThreadMessage &
+  (ThreadSystemMessage | ThreadUserMessage | ThreadAssistantMessage);
+
+/** Core Message Types (without UI content parts) */
+
+export type CoreUserContentPart =
+  | TextContentPart
+  | ImageContentPart
+  | Unstable_AudioContentPart;
+export type CoreAssistantContentPart =
+  | TextContentPart
+  | CoreToolCallContentPart;
+
+export type CoreSystemMessage = {
+  role: "system";
+  content: [TextContentPart];
+};
+
+export type CoreUserMessage = {
+  role: "user";
+  content: CoreUserContentPart[];
+};
+
+export type CoreAssistantMessage = {
+  role: "assistant";
+  content: CoreAssistantContentPart[];
+};
+
+export type CoreMessage =
+  | CoreSystemMessage
+  | CoreUserMessage
+  | CoreAssistantMessage;

package/src/types/AttachmentTypes.ts

@@ -0,0 +1,46 @@
+import { CoreUserContentPart } from "./AssistantTypes";
+
+export type PendingAttachmentStatus =
+  | {
+      type: "running";
+      reason: "uploading";
+      progress: number;
+    }
+  | {
+      type: "requires-action";
+      reason: "composer-send";
+    }
+  | {
+      type: "incomplete";
+      reason: "error" | "upload-paused";
+    };
+
+export type CompleteAttachmentStatus = {
+  type: "complete";
+};
+
+export type AttachmentStatus =
+  | PendingAttachmentStatus
+  | CompleteAttachmentStatus;
+
+type BaseAttachment = {
+  id: string;
+  type: "image" | "document" | "file";
+  name: string;
+  // TODO mark as required in 0.6.0
+  contentType?: string;
+  file?: File;
+  content?: CoreUserContentPart[];
+};
+
+export type PendingAttachment = BaseAttachment & {
+  status: PendingAttachmentStatus;
+  file: File;
+};
+
+export type CompleteAttachment = BaseAttachment & {
+  status: CompleteAttachmentStatus;
+  content: CoreUserContentPart[];
+};
+
+export type Attachment = PendingAttachment | CompleteAttachment;

package/src/types/ContentPartComponentTypes.tsx

@@ -0,0 +1,70 @@
+"use client";
+import type { ComponentType } from "react";
+import type {
+  ContentPartStatus,
+  ImageContentPart,
+  TextContentPart,
+  ToolCallContentPart,
+  UIContentPart,
+  Unstable_AudioContentPart,
+} from "./AssistantTypes";
+import { ContentPartState } from "../api/ContentPartRuntime";
+
+export type EmptyContentPartProps = {
+  status: ContentPartStatus;
+};
+export type EmptyContentPartComponent = ComponentType<EmptyContentPartProps>;
+
+export type TextContentPartProps = ContentPartState &
+  TextContentPart & {
+    /**
+     * @deprecated You can directly access content part fields in the state. Replace `.part.type` with `.type` etc. This will be removed in 0.6.0.
+     */
+    part: TextContentPart;
+  };
+export type TextContentPartComponent = ComponentType<TextContentPartProps>;
+
+export type ImageContentPartProps = ContentPartState &
+  ImageContentPart & {
+    /**
+     * @deprecated You can directly access content part fields in the state. Replace `.part.type` with `.type` etc. This will be removed in 0.6.0.
+     */
+    part: ImageContentPart;
+  };
+export type ImageContentPartComponent = ComponentType<ImageContentPartProps>;
+
+export type Unstable_AudioContentPartProps = ContentPartState &
+  Unstable_AudioContentPart & {
+    /**
+     * @deprecated You can directly access content part fields in the state. Replace `.part.type` with `.type` etc. This will be removed in 0.6.0.
+     */
+    part: Unstable_AudioContentPart;
+  };
+export type Unstable_AudioContentPartComponent =
+  ComponentType<Unstable_AudioContentPartProps>;
+
+export type UIContentPartProps = ContentPartState &
+  UIContentPart & {
+    /**
+     * @deprecated You can directly access content part fields in the state. Replace `.part.type` with `.type` etc. This will be removed in 0.6.0.
+     */
+    part: UIContentPart;
+  };
+export type UIContentPartComponent = ComponentType<UIContentPartProps>;
+
+export type ToolCallContentPartProps<
+  TArgs extends Record<string, unknown> = any,
+  TResult = unknown,
+> = ContentPartState &
+  ToolCallContentPart<TArgs, TResult> & {
+    /**
+     * @deprecated You can directly access content part fields in the state. Replace `.part.type` with `.type` etc. This will be removed in 0.6.0.
+     */
+    part: ToolCallContentPart<TArgs, TResult>;
+    addResult: (result: any) => void;
+  };
+
+export type ToolCallContentPartComponent<
+  TArgs extends Record<string, unknown> = any,
+  TResult = any,
+> = ComponentType<ToolCallContentPartProps<TArgs, TResult>>;

package/src/types/ModelConfigTypes.ts

@@ -0,0 +1,97 @@
+import { z } from "zod";
+import type { JSONSchema7 } from "json-schema";
+import { Unsubscribe } from "./Unsubscribe";
+
+export const LanguageModelV1CallSettingsSchema = z.object({
+  maxTokens: z.number().int().positive().optional(),
+  temperature: z.number().optional(),
+  topP: z.number().optional(),
+  presencePenalty: z.number().optional(),
+  frequencyPenalty: z.number().optional(),
+  seed: z.number().int().optional(),
+  headers: z.record(z.string().optional()).optional(),
+});
+
+export type LanguageModelV1CallSettings = z.infer<
+  typeof LanguageModelV1CallSettingsSchema
+>;
+
+export const LanguageModelConfigSchema = z.object({
+  apiKey: z.string().optional(),
+  baseUrl: z.string().optional(),
+  modelName: z.string().optional(),
+});
+
+export type LanguageModelConfig = z.infer<typeof LanguageModelConfigSchema>;
+
+type ToolExecuteFunction<TArgs, TResult> = (
+  args: TArgs,
+  context: {
+    abortSignal: AbortSignal;
+  },
+) => TResult | Promise<TResult>;
+
+export type Tool<
+  TArgs extends Record<string, unknown> = Record<string | number, unknown>,
+  TResult = unknown,
+> = {
+  description?: string | undefined;
+  parameters: z.ZodSchema<TArgs> | JSONSchema7;
+  execute?: ToolExecuteFunction<TArgs, TResult>;
+};
+
+export type ModelConfig = {
+  priority?: number | undefined;
+  system?: string | undefined;
+  tools?: Record<string, Tool<any, any>> | undefined;
+  callSettings?: LanguageModelV1CallSettings | undefined;
+  config?: LanguageModelConfig | undefined;
+};
+
+export type ModelConfigProvider = {
+  getModelConfig: () => ModelConfig;
+  subscribe?: (callback: () => void) => Unsubscribe;
+};
+
+export const mergeModelConfigs = (
+  configSet: Set<ModelConfigProvider>,
+): ModelConfig => {
+  const configs = Array.from(configSet)
+    .map((c) => c.getModelConfig())
+    .sort((a, b) => (b.priority ?? 0) - (a.priority ?? 0));
+
+  return configs.reduce((acc, config) => {
+    if (config.system) {
+      if (acc.system) {
+        // TODO should the separator be configurable?
+        acc.system += `\n\n${config.system}`;
+      } else {
+        acc.system = config.system;
+      }
+    }
+    if (config.tools) {
+      for (const [name, tool] of Object.entries(config.tools)) {
+        if (acc.tools?.[name]) {
+          throw new Error(
+            `You tried to define a tool with the name ${name}, but it already exists.`,
+          );
+        }
+        if (!acc.tools) acc.tools = {};
+        acc.tools[name] = tool;
+      }
+    }
+    if (config.config) {
+      acc.config = {
+        ...acc.config,
+        ...config.config,
+      };
+    }
+    if (config.callSettings) {
+      acc.callSettings = {
+        ...acc.callSettings,
+        ...config.callSettings,
+      };
+    }
+    return acc;
+  }, {} as ModelConfig);
+};

package/src/types/Unsubscribe.tsx

@@ -0,0 +1 @@
+export type Unsubscribe = () => void;

package/src/types/index.ts

@@ -0,0 +1,57 @@
+export type {
+  Attachment,
+  PendingAttachment,
+  CompleteAttachment,
+  AttachmentStatus,
+} from "./AttachmentTypes";
+
+export type {
+  AppendMessage,
+  TextContentPart,
+  ImageContentPart,
+  ToolCallContentPart,
+  UIContentPart,
+  MessageStatus,
+
+  // thread message types
+  ThreadUserContentPart,
+  ThreadAssistantContentPart,
+  ThreadSystemMessage,
+  ThreadAssistantMessage,
+  ThreadUserMessage,
+  ThreadMessage,
+
+  // core message types
+  CoreUserContentPart,
+  CoreAssistantContentPart,
+  CoreSystemMessage,
+  CoreUserMessage,
+  CoreAssistantMessage,
+  CoreMessage,
+
+  // TODO
+  Unstable_AudioContentPart,
+} from "./AssistantTypes";
+
+export type {
+  EmptyContentPartProps,
+  EmptyContentPartComponent,
+  TextContentPartProps,
+  TextContentPartComponent,
+  ImageContentPartProps,
+  ImageContentPartComponent,
+  UIContentPartProps,
+  UIContentPartComponent,
+  ToolCallContentPartProps,
+  ToolCallContentPartComponent,
+  Unstable_AudioContentPartProps,
+  Unstable_AudioContentPartComponent,
+} from "./ContentPartComponentTypes";
+
+export type {
+  ModelConfig,
+  ModelConfigProvider,
+  Tool,
+} from "./ModelConfigTypes";
+
+export type { Unsubscribe } from "./Unsubscribe";