@meshagent/meshagent-tailwind 0.41.4 → 0.41.6

package/dist/esm/chat/new-chat-thread.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { JsonContent } from "@meshagent/meshagent";
+import { MessagingChatClient } from "@meshagent/meshagent-agents";
 import { ChatInput } from "./chat-input";
 import { MeshagentFileUpload, fileToAsyncIterable } from "./file-attachment";
 import { Toaster } from "../components/ui/sonner";
@@ -15,7 +15,7 @@ function normalizeThreadPath(path) {
   return normalizedPath ? normalizedPath : null;
 }
 function getParticipantName(participant) {
-  const name = participant.getAttribute("name");
+  const name = participant?.getAttribute("name");
   return typeof name === "string" ? name.trim() : "";
 }
 function displayParticipantName(name) {
@@ -46,53 +46,6 @@ function ensureOperationActive(operationId, activeOperationRef) {
     throw new NewThreadCancelledError();
   }
 }
-function delay(milliseconds) {
-  return new Promise((resolve) => {
-    window.setTimeout(resolve, milliseconds);
-  });
-}
-async function waitForTargetAgent(params) {
-  const { room, agentName, operationId, activeOperationRef } = params;
-  while (true) {
-    ensureOperationActive(operationId, activeOperationRef);
-    const targetAgent = findTargetAgent(room, agentName);
-    if (targetAgent) {
-      return targetAgent;
-    }
-    await delay(250);
-  }
-}
-async function waitForToolkitAvailable(params) {
-  const {
-    room,
-    participantId,
-    toolkit,
-    operationId,
-    activeOperationRef
-  } = params;
-  while (true) {
-    ensureOperationActive(operationId, activeOperationRef);
-    try {
-      const toolkits = await room.agents.listToolkits({ participantId, timeout: 1e3 });
-      if (toolkits.some((toolkitDescription) => toolkitDescription.name === toolkit)) {
-        return;
-      }
-    } catch {
-    }
-    await delay(250);
-  }
-}
-function getStringField(record, key) {
-  const value = record[key];
-  return typeof value === "string" && value.trim() !== "" ? value.trim() : null;
-}
-function parseThreadToolResult(toolkit, tool, content) {
-  const path = getStringField(content.json, "path");
-  if (!path) {
-    throw new Error(`${toolkit}.${tool} response missing path`);
-  }
-  return [path, getStringField(content.json, "name")];
-}
 function describeError(error) {
   if (error instanceof Error && error.message.trim() !== "") {
     return error.message;
@@ -113,10 +66,10 @@ function ErrorBanner({ message }) {
 }
 function NewChatThread({
   room,
+  chatClient,
+  disposeChatClient = false,
   agentName,
   builder,
-  toolkit = "chat",
-  tool = "new_thread",
   selectedThreadPath,
   onThreadPathChanged,
   onThreadResolved,
@@ -133,11 +86,30 @@ function NewChatThread({
   const activeOperationRef = useRef(0);
   const controlledThreadPath = selectedThreadPath !== void 0 ? normalizeThreadPath(selectedThreadPath) : void 0;
   const activePath = controlledThreadPath ?? internalThreadPath;
+  const ownsChatClient = chatClient == null;
+  const activeChatClient = useMemo(
+    () => chatClient ?? new MessagingChatClient({ room, agentName }),
+    [agentName, chatClient, room]
+  );
+  const [clientVersion, setClientVersion] = useState(0);
   useEffect(() => {
     return () => {
       activeOperationRef.current += 1;
     };
   }, []);
+  useEffect(() => {
+    void activeChatClient.start();
+    const handleChange = () => {
+      setClientVersion((current) => current + 1);
+    };
+    activeChatClient.addListener(handleChange);
+    return () => {
+      activeChatClient.removeListener(handleChange);
+      if (ownsChatClient || disposeChatClient) {
+        void activeChatClient.stop();
+      }
+    };
+  }, [activeChatClient, disposeChatClient, ownsChatClient]);
   useEffect(() => {
     if (controlledThreadPath === void 0) {
       return;
@@ -179,46 +151,30 @@ function NewChatThread({
     }
     const operationId = activeOperationRef.current + 1;
     activeOperationRef.current = operationId;
-    const initialTargetAgent = findTargetAgent(room, agentName);
-    setWaitingForAgent(initialTargetAgent === null);
-    setCreatingNewThread(initialTargetAgent !== null);
+    const initialTargetAgent = activeChatClient.agentParticipant() ?? findTargetAgent(room, agentName);
+    setWaitingForAgent(initialTargetAgent === null && chatClient == null);
+    setCreatingNewThread(initialTargetAgent !== null || chatClient != null);
     setNewThreadError(null);
     try {
-      const targetAgent = initialTargetAgent ?? await waitForTargetAgent({
-        room,
-        agentName,
-        operationId,
-        activeOperationRef
-      });
+      if (initialTargetAgent === null && chatClient == null) {
+        if (!(activeChatClient instanceof MessagingChatClient)) {
+          throw new Error("No online agent supports agent messages.");
+        }
+        await activeChatClient.waitForAgentParticipant({ waitKey: String(operationId) });
+      }
       ensureOperationActive(operationId, activeOperationRef);
-      if (initialTargetAgent === null) {
+      if (initialTargetAgent === null && chatClient == null) {
         setWaitingForAgent(false);
         setCreatingNewThread(true);
       }
-      await waitForToolkitAvailable({
-        room,
-        participantId: targetAgent.id,
-        toolkit,
-        operationId,
-        activeOperationRef
-      });
-      ensureOperationActive(operationId, activeOperationRef);
-      const response = await room.invoke({
-        participantId: targetAgent.id,
-        toolkit,
-        tool,
-        arguments: {
-          message: {
-            text,
-            attachments: newThreadAttachments.map((attachment) => ({ path: attachment.path }))
-          }
-        }
+      const result = await activeChatClient.startThread({
+        message: text,
+        attachments: newThreadAttachments.map((attachment) => attachment.path),
+        senderName: getParticipantName(room.localParticipant) || void 0
       });
       ensureOperationActive(operationId, activeOperationRef);
-      if (!(response instanceof JsonContent)) {
-        throw new Error(`${toolkit}.${tool} returned non-JSON content`);
-      }
-      const [threadPath, displayName] = parseThreadToolResult(toolkit, tool, response);
+      const threadPath = result.threadPath;
+      const displayName = null;
       const normalizedPath = normalizeThreadPath(threadPath);
       if (controlledThreadPath === void 0) {
         setInternalThreadPath(normalizedPath);
@@ -239,7 +195,9 @@ function NewChatThread({
       setNewThreadError(describeError(error));
     }
   }, [
+    activeChatClient,
     agentName,
+    chatClient,
     controlledThreadPath,
     creatingNewThread,
     newThreadAttachments,
@@ -247,8 +205,6 @@ function NewChatThread({
     onThreadPathChanged,
     onThreadResolved,
     room,
-    toolkit,
-    tool,
     waitingForAgent
   ]);
   const targetAgentLabel = useMemo(() => {
@@ -256,9 +212,9 @@ function NewChatThread({
     if (knownAgentName) {
       return displayParticipantName(knownAgentName);
     }
-    const targetAgent = findTargetAgent(room);
+    const targetAgent = activeChatClient.agentParticipant() ?? findTargetAgent(room);
     return displayParticipantName(targetAgent ? getParticipantName(targetAgent) : null);
-  }, [agentName, room]);
+  }, [activeChatClient, agentName, clientVersion, room]);
   const pendingStatusText = waitingForAgent ? `Waiting for ${targetAgentLabel} to be ready.` : creatingNewThread ? `Starting a thread with ${targetAgentLabel}.` : null;
   if (activePath !== null) {
     return builder(activePath);

package/dist/esm/file-preview/file-preview.d.ts

@@ -4,6 +4,8 @@ export declare enum FileKind {
     Image = "image",
     Video = "video",
     Pdf = "pdf",
+    Source = "source",
+    Thread = "thread",
     Unknown = "unknown"
 }
 export declare function filePreviewName(path: string): string;
@@ -22,6 +24,10 @@ export declare function PdfPreview({ room, path }: {
     room: RoomClient;
     path: string;
 }): ReactElement;
+export declare function SourcePreview({ room, path }: {
+    room: RoomClient;
+    path: string;
+}): ReactElement;
 export declare function FilePreview({ room, path }: {
     room: RoomClient;
     path: string;

package/dist/esm/file-preview/file-preview.js

@@ -2,6 +2,8 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useMemo, useRef, useState } from "react";
 import { Download, FileText } from "lucide-react";
 import { Document, Page, pdfjs } from "react-pdf";
+import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
+import { oneLight } from "react-syntax-highlighter/dist/esm/styles/prism";
 import {
   Dialog,
   DialogContent,
@@ -13,11 +15,14 @@ import {
 import { Button } from "../components/ui/button";
 import { Spinner } from "../components/ui/spinner";
 import { cn } from "../lib/utils";
+import { ChatThread } from "../chat/chat-thread";
 pdfjs.GlobalWorkerOptions.workerSrc = `https://unpkg.com/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.mjs`;
 var FileKind = /* @__PURE__ */ ((FileKind2) => {
   FileKind2["Image"] = "image";
   FileKind2["Video"] = "video";
   FileKind2["Pdf"] = "pdf";
+  FileKind2["Source"] = "source";
+  FileKind2["Thread"] = "thread";
   FileKind2["Unknown"] = "unknown";
   return FileKind2;
 })(FileKind || {});
@@ -39,6 +44,123 @@ const imageExtensions = /* @__PURE__ */ new Set([
 ]);
 const videoExtensions = /* @__PURE__ */ new Set(["m4v", "mkv", "mov", "mp4", "webm"]);
 const pdfExtensions = /* @__PURE__ */ new Set(["pdf"]);
+const sourceExtensions = /* @__PURE__ */ new Set([
+  "bash",
+  "c",
+  "cc",
+  "cfg",
+  "cmake",
+  "cpp",
+  "cs",
+  "css",
+  "csv",
+  "dart",
+  "diff",
+  "dockerfile",
+  "env",
+  "fish",
+  "go",
+  "gradle",
+  "graphql",
+  "h",
+  "hpp",
+  "htm",
+  "html",
+  "ini",
+  "java",
+  "js",
+  "json",
+  "jsx",
+  "kt",
+  "kts",
+  "lua",
+  "md",
+  "mjs",
+  "patch",
+  "php",
+  "proto",
+  "py",
+  "rb",
+  "rs",
+  "scss",
+  "sh",
+  "sql",
+  "swift",
+  "toml",
+  "ts",
+  "tsx",
+  "txt",
+  "xml",
+  "yaml",
+  "yml",
+  "zsh"
+]);
+const sourceFilenames = /* @__PURE__ */ new Set([
+  ".dockerignore",
+  ".env",
+  ".gitignore",
+  "dockerfile",
+  "makefile"
+]);
+const sourceLanguagesByExtension = /* @__PURE__ */ new Map([
+  ["bash", "bash"],
+  ["c", "c"],
+  ["cc", "cpp"],
+  ["cfg", "ini"],
+  ["cmake", "cmake"],
+  ["cpp", "cpp"],
+  ["cs", "csharp"],
+  ["css", "css"],
+  ["csv", "csv"],
+  ["dart", "dart"],
+  ["diff", "diff"],
+  ["dockerfile", "docker"],
+  ["env", "ini"],
+  ["fish", "fish"],
+  ["go", "go"],
+  ["gradle", "gradle"],
+  ["graphql", "graphql"],
+  ["h", "c"],
+  ["hpp", "cpp"],
+  ["htm", "html"],
+  ["html", "html"],
+  ["ini", "ini"],
+  ["java", "java"],
+  ["js", "javascript"],
+  ["json", "json"],
+  ["jsx", "jsx"],
+  ["kt", "kotlin"],
+  ["kts", "kotlin"],
+  ["lua", "lua"],
+  ["md", "markdown"],
+  ["mjs", "javascript"],
+  ["patch", "diff"],
+  ["php", "php"],
+  ["proto", "protobuf"],
+  ["py", "python"],
+  ["rb", "ruby"],
+  ["rs", "rust"],
+  ["scss", "scss"],
+  ["sh", "bash"],
+  ["sql", "sql"],
+  ["swift", "swift"],
+  ["toml", "toml"],
+  ["ts", "typescript"],
+  ["tsx", "tsx"],
+  ["txt", "text"],
+  ["xml", "xml"],
+  ["yaml", "yaml"],
+  ["yml", "yaml"],
+  ["zsh", "bash"]
+]);
+const sourceLanguagesByFilename = /* @__PURE__ */ new Map([
+  [".dockerignore", "docker"],
+  [".env", "ini"],
+  [".gitignore", "git"],
+  ["dockerfile", "docker"],
+  ["makefile", "makefile"]
+]);
+const threadExtensions = /* @__PURE__ */ new Set(["thread"]);
 function basename(path) {
   const withoutQuery = path.split("?")[0] ?? path;
   const withoutHash = withoutQuery.split("#")[0] ?? withoutQuery;
@@ -70,6 +192,12 @@ function classifyFile(path) {
   if (pdfExtensions.has(ext)) {
     return "pdf" /* Pdf */;
   }
+  if (sourceExtensions.has(ext) || sourceFilenames.has(filePreviewName(path).toLowerCase())) {
+    return "source" /* Source */;
+  }
+  if (threadExtensions.has(ext)) {
+    return "thread" /* Thread */;
+  }
   return "unknown" /* Unknown */;
 }
 function isImagePath(path) {
@@ -141,6 +269,55 @@ function usePdfUrl(room, path) {
   }, [path, room]);
   return { url, error };
 }
+function sourceLanguage(path) {
+  const name = filePreviewName(path).toLowerCase();
+  const byFilename = sourceLanguagesByFilename.get(name);
+  if (byFilename != null) {
+    return byFilename;
+  }
+  return sourceLanguagesByExtension.get(extension(path)) ?? "text";
+}
+function useSourceText(room, path) {
+  const [text, setText] = useState(null);
+  const [error, setError] = useState(null);
+  useEffect(() => {
+    let cancelled = false;
+    const controller = new AbortController();
+    const normalizedPath = path.trim();
+    setText(null);
+    setError(null);
+    if (normalizedPath === "") {
+      return () => {
+        controller.abort();
+      };
+    }
+    const loadText = async () => {
+      if (isHttpUrl(normalizedPath)) {
+        const response = await fetch(normalizedPath, { signal: controller.signal });
+        if (!response.ok) {
+          throw new Error(`HTTP ${response.status}`);
+        }
+        return await response.text();
+      }
+      const content = await room.storage.download(normalizedPath);
+      return new TextDecoder().decode(content.data);
+    };
+    void loadText().then((nextText) => {
+      if (!cancelled) {
+        setText(nextText);
+      }
+    }).catch((nextError) => {
+      if (!cancelled) {
+        setError(nextError);
+      }
+    });
+    return () => {
+      cancelled = true;
+      controller.abort();
+    };
+  }, [path, room]);
+  return { text, error };
+}
 function ErrorPreview({ message }) {
   return /* @__PURE__ */ jsx("div", { className: "flex h-full min-h-48 items-center justify-center p-6 text-center text-sm text-destructive", children: message });
 }
@@ -252,6 +429,44 @@ function PdfPreview({ room, path }) {
     }
   ) });
 }
+function SourcePreview({ room, path }) {
+  const { text, error } = useSourceText(room, path);
+  const language = useMemo(() => sourceLanguage(path), [path]);
+  if (error != null) {
+    return /* @__PURE__ */ jsx(ErrorPreview, { message: `Unable to load source preview: ${String(error)}` });
+  }
+  if (text == null) {
+    return /* @__PURE__ */ jsx(LoadingPreview, {});
+  }
+  return /* @__PURE__ */ jsx("div", { className: "h-full overflow-auto bg-[#fafafa] text-sm", children: /* @__PURE__ */ jsx(
+    SyntaxHighlighter,
+    {
+      language,
+      style: oneLight,
+      showLineNumbers: true,
+      wrapLongLines: true,
+      customStyle: {
+        margin: 0,
+        minHeight: "100%",
+        background: "transparent",
+        padding: "1rem"
+      },
+      codeTagProps: {
+        style: {
+          fontFamily: "ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace"
+        }
+      },
+      lineNumberStyle: {
+        minWidth: "2.75em",
+        paddingRight: "1em",
+        color: "var(--muted-foreground)",
+        textAlign: "right",
+        userSelect: "none"
+      },
+      children: text
+    }
+  ) });
+}
 function UnsupportedPreview({ room, path }) {
   const filename = filePreviewName(path);
   return /* @__PURE__ */ jsxs("div", { className: "flex h-full min-h-64 flex-col items-center justify-center gap-4 p-8 text-center", children: [
@@ -272,6 +487,10 @@ function FilePreview({ room, path }) {
       return /* @__PURE__ */ jsx(VideoPreview, { room, path });
     case "pdf" /* Pdf */:
       return /* @__PURE__ */ jsx(PdfPreview, { room, path });
+    case "source" /* Source */:
+      return /* @__PURE__ */ jsx(SourcePreview, { room, path });
+    case "thread" /* Thread */:
+      return /* @__PURE__ */ jsx(ChatThread, { room, path });
     case "unknown" /* Unknown */:
       return /* @__PURE__ */ jsx(UnsupportedPreview, { room, path });
   }
@@ -309,6 +528,7 @@ export {
   FilePreviewDialog,
   ImagePreview,
   PdfPreview,
+  SourcePreview,
   VideoPreview,
   classifyFile,
   filePreviewName,

package/dist/esm/meetings/camera-grid.d.ts

@@ -0,0 +1,46 @@
+import { ReactNode } from "react";
+import { Track } from "livekit-client";
+import type { Participant, TrackPublication, VideoTrack } from "livekit-client";
+export declare const TrackSource: {
+    readonly Camera: Track.Source.Camera;
+    readonly ScreenShareVideo: Track.Source.ScreenShare;
+};
+export type TrackSource = (typeof TrackSource)[keyof typeof TrackSource];
+export interface CameraGridFrameArgs {
+    participant: Participant;
+    publication: TrackPublication | null;
+    trackNode: ReactNode;
+    showName: boolean;
+}
+export interface CameraGridProps {
+    participants: Participant[];
+    room?: unknown | null;
+    spacing?: number;
+    showNames?: boolean;
+    showAllVideos?: boolean;
+    preferredSource?: TrackSource;
+    rowsDesired?: number;
+    columnsDesired?: number;
+    tryFill?: boolean;
+    /** Equivalent to activeVideoPublicationForSource(p, source). */
+    activeVideoPublicationForSource: (participant: Participant, source: TrackSource) => TrackPublication | null | undefined;
+    /** Equivalent to activeVideoPublications(p, { source? }). */
+    activeVideoPublications: (participant: Participant, options?: {
+        source?: TrackSource;
+    }) => TrackPublication[];
+    /** Equivalent to VideoTrackRenderer. */
+    renderVideoTrack: (args: {
+        track: VideoTrack;
+        fit: "contain" | "cover";
+        publication: TrackPublication;
+        participant: Participant;
+    }) => ReactNode;
+    /** Equivalent to AudioStats. Used only for `.agent` camera placeholders. */
+    renderAudioStats?: (args: {
+        room: unknown;
+        participant: Participant;
+    }) => ReactNode;
+    /** Equivalent to frameBuilder. */
+    frameBuilder: (args: CameraGridFrameArgs) => ReactNode;
+}
+export declare function CameraGrid({ participants, room, spacing, showNames, showAllVideos, preferredSource, rowsDesired, columnsDesired, tryFill, activeVideoPublicationForSource, activeVideoPublications, renderVideoTrack, renderAudioStats, frameBuilder, }: CameraGridProps): import("react/jsx-runtime").JSX.Element | null;