@agents24/chat-react 0.5.34 → 0.5.36

package/dist/ui/message-code.d.ts

@@ -0,0 +1,21 @@
+import * as React from "react";
+type CodeNode = {
+    position?: {
+        start?: {
+            line?: number;
+        };
+        end?: {
+            line?: number;
+        };
+    };
+};
+export declare function MessageCodeBlock({ code, language }: {
+    code: string;
+    language?: string;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function MessageMarkdownCode({ children, className, node, ...props }: React.ComponentProps<"code"> & {
+    node?: CodeNode;
+    "data-block"?: string;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function formatMessageJson(text: string): string | null;
+export {};

package/dist/ui/use-highlighted-code.d.ts

@@ -0,0 +1,2 @@
+import * as React from "react";
+export declare function useHighlightedCode(value: string, language: string): (string | number | bigint | boolean | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element[] | null | undefined)[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agents24/chat-react",
-  "version": "0.5.34",
+  "version": "0.5.36",
   "description": "Accessible web UI and complete default layout for Agents24 chat applications.",
   "license": "MIT",
   "repository": {
@@ -64,8 +64,8 @@
   },
   "dependencies": {
     "@untitledui/file-icons": "0.0.9",
-    "@agents24/client": "0.2.17",
-    "@agents24/react": "0.2.21",
+    "@agents24/client": "0.2.18",
+    "@agents24/react": "0.2.23",
     "@fontsource-variable/inter": "^5.3.0",
     "@fontsource-variable/jetbrains-mono": "^5.3.0",
     "@fontsource-variable/merriweather": "^5.3.0",
@@ -75,6 +75,7 @@
     "clsx": "^2.1.1",
     "lucide-react": "0.542.0",
     "radix-ui": "1.4.3",
+    "shiki": "3.23.0",
     "streamdown": "^2.5.0",
     "tailwind-merge": "^3.6.0",
     "tailwindcss": "^4.1.16",

package/scaffold/src/components/chat/thread-sidebar.tsx

@@ -1,5 +1,5 @@
 import { getThreadActivity, type StoredChatThread } from "@agents24/react"
-import { LoaderCircle, SquarePen, Trash2 } from "lucide-react"
+import { LoaderCircle, Pause, SquarePen, Trash2 } from "lucide-react"
 import type { Agents24ChatIdentity } from "../../identity"
 import { IdentityControl } from "./identity-control"
 
@@ -34,20 +34,21 @@ type Props = {
 
 function ThreadStatus({ thread }: { thread: StoredChatThread }) {
   const activity = getThreadActivity(thread)
-  if (!activity.isSpinning) return null
-  const label = activity.status === "cancelling"
+  const waiting = ["paused", "waiting", "interrupted"].includes(activity.status || "")
+  if (!activity.isSpinning && !waiting) return null
+  const label = waiting ? "Waiting" : activity.status === "cancelling"
     ? "Cancelling"
     : activity.status === "queued"
       ? "Queued"
       : "Running"
   return (
     <span
-      className="pointer-events-none absolute end-1 top-1/2 hidden size-5 -translate-y-1/2 items-center justify-center text-muted-foreground transition-opacity group-hover/menu-item:opacity-0 md:flex"
+      className="pointer-events-none absolute end-1 top-1/2 flex size-5 -translate-y-1/2 items-center justify-center text-muted-foreground transition-opacity group-hover/menu-item:opacity-0"
       role="status"
       aria-label={label}
       title={label}
     >
-      <LoaderCircle className="size-3.5 animate-spin" />
+      {waiting ? <Pause className="size-3.5 text-amber-600" /> : <LoaderCircle className="size-3.5 animate-spin" />}
     </span>
   )
 }