@railtownai/railtracks-visualizer 0.0.23 → 0.0.25

package/dist/types/components/nodes/AgentNode.d.ts

@@ -1,8 +1,9 @@
 import React from "react";
+import { LLMDetails, NodeDetails } from "../../dto/AgentRunNode";
 interface NodeData {
     label: string;
     nodeType?: "Tool" | "Agent" | "Coordinator";
-    details?: any;
+    details?: NodeDetails;
     id?: string;
     edges?: any[];
     edgeDetails?: {
@@ -18,5 +19,10 @@ interface AgentNodeProps {
     id: string;
     onInspect?: (nodeData: NodeData) => void;
 }
+export declare const getOverviewLlmDetails: (llmDetails: LLMDetails[]) => LLMDetails | null;
+export declare const sumTotalCost: (llmDetails: LLMDetails[]) => number;
+export declare const sumTotalInputTokens: (llmDetails: LLMDetails[]) => number;
+export declare const sumTotalOutputTokens: (llmDetails: LLMDetails[]) => number;
+export declare const sumTotalLatency: (llmDetails: LLMDetails[]) => number;
 export declare const AgentNode: React.FC<AgentNodeProps>;
 export {};

package/dist/types/components/nodes/AgentNodeInputRenderer.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { LLMContent } from "../../dto/AgentRunNode";
+interface InputArrayRendererProps {
+    input: LLMContent[];
+}
+export declare const InputArrayRenderer: React.FC<InputArrayRendererProps>;
+export {};

package/dist/types/components/nodes/CodeBlock.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+interface CodeBlockProps {
+    content: string;
+    language?: string;
+    showHeader?: boolean;
+}
+export declare const CodeBlock: React.FC<CodeBlockProps>;
+export {};

package/dist/types/components/nodes/OutputRenderer.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+interface OutputRendererProps {
+    data: {
+        role: string;
+        content: any;
+    };
+}
+export declare const OutputRenderer: React.FC<OutputRendererProps>;
+export {};

package/dist/types/components/ui/header.d.ts

@@ -18,6 +18,8 @@ interface HeaderProps {
     onAgentRunSelect: (runIndex: number) => void;
     showTimeline: boolean;
     onTimelineToggle: (checked: boolean) => void;
+    sseConnected?: boolean;
+    sseConnecting?: boolean;
 }
 export declare const Header: React.FC<HeaderProps>;
 export {};

package/dist/types/components/ui/json-tree.d.ts

@@ -3,8 +3,10 @@ interface JsonTreeViewerProps {
     data: any;
     maxDepth?: number;
     initialExpanded?: boolean;
+    expanded?: boolean;
     className?: string;
     priorityKeys?: string[];
+    excludeKeys?: string[];
 }
 declare const JsonTreeViewer: React.FC<JsonTreeViewerProps>;
 export { JsonTreeViewer };

package/dist/types/dto/AgentRunEdge.d.ts

@@ -1,29 +1,5 @@
-/**
- * Represents a timestamped event for an edge
- */
-export interface EdgeStamp {
-    /** The sequential step number in the agent execution */
-    step: number;
-    /** Unix timestamp when this event occurred */
-    time: number;
-    /** Unique identifier for this stamp */
-    identifier: string;
-}
-/**
- * Represents detailed information about an edge
- */
-export interface EdgeDetails {
-    /** Optional state of the edge (e.g., "pending", "completed", "failed") */
-    state?: string;
-    /** Optional status information for the edge */
-    status?: string;
-    /** Optional array of input arguments passed to the target node */
-    input_args?: any[];
-    /** Optional object of input keyword arguments passed to the target node */
-    input_kwargs?: any;
-    /** Optional output data from the source node */
-    output?: any;
-}
+import { EdgeStamp } from "./AgentRunEdgeStamp";
+import { EdgeDetails } from "./AgentRunEdgeDetails";
 /**
  * Represents an edge connecting nodes in the agent execution flow
  *

package/dist/types/dto/AgentRunEdgeDetails.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Represents detailed information about an edge
+ */
+export interface EdgeDetails {
+    /** Optional status information for the edge */
+    status?: string;
+    /** Optional array of input arguments passed to the target node */
+    input_args?: any[];
+    /** Optional object of input keyword arguments passed to the target node */
+    input_kwargs?: any;
+    /** Optional output data from the source node */
+    output?: any;
+}

package/dist/types/dto/AgentRunEdgeStamp.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Represents a timestamped event for an edge
+ */
+export interface EdgeStamp {
+    /** The sequential step number in the agent execution */
+    step: number;
+    /** Unix timestamp when this event occurred */
+    time: number;
+    /** Unique identifier for this stamp */
+    identifier: string;
+}

package/dist/types/dto/AgentRunNode.d.ts

@@ -15,7 +15,10 @@ export interface NodeStamp {
 export interface LLMContent {
     /** Role of the message sender (e.g., "user", "assistant", "system") */
     role: string;
-    /** The actual content of the message */
+    /** The actual content of the message.
+     * For tool calls, they can be a function call.
+     * For tool responses, it can be json.
+     * For LLM responses, it can be a string or a json object. */
     content: any;
 }
 /**
@@ -38,12 +41,16 @@ export interface LLMDetails {
     total_cost: number | null;
     /** System fingerprint for the model (null if not available) */
     system_fingerprint: string | null;
+    /** Total time taken for the node to execute in SECONDS.
+     * Older agent runs (backwards compatible) won't have latency parameter
+     * so we need to make it optional. */
+    latency?: number | null;
 }
 /**
  * Represents latency information for a node execution
  */
 export interface NodeLatency {
-    /** Total time taken for the node to execute in milliseconds */
+    /** Total time taken for the node to execute in SECONDS */
     total_time: number;
 }
 /**
@@ -113,3 +120,29 @@ export interface AgentRunNode {
     /** Reference to the parent node, or null if this is a root node */
     parent: AgentRunNode | null;
 }
+/**
+ * Represents a tool call with identifier, name, and arguments
+ */
+export interface ToolCall {
+    /** Unique identifier for this tool call */
+    identifier: string;
+    /** Name of the tool being called */
+    name: string;
+    /** Arguments passed to the tool */
+    arguments: Record<string, any>;
+}
+/**
+ * Represents a tool response with identifier, name, and result
+ */
+export interface ToolResponse {
+    /** Unique identifier for this tool response */
+    identifier: string;
+    /** Name of the tool that generated this response */
+    name: string;
+    /** The result of the tool call */
+    result: any;
+}
+/**
+ * Union type for different content types that can be rendered
+ */
+export type Content = string | ToolCall[] | ToolResponse | any;

package/dist/types/hooks/index.d.ts

@@ -1,5 +1,6 @@
 export { useApi } from "./useApi";
 export { useFlowData } from "./useFlowData";
+export { useRailtracksStream } from "./useRailtracksStream";
 export type { JsonFile, ApiError } from "./useApi";
 export type { FlowDataState } from "./useFlowData";
 export type { AgentRunNode } from "../dto/AgentRunNode";

package/dist/types/hooks/useRailtracksStream.d.ts

@@ -0,0 +1,14 @@
+interface StreamMessage {
+    type: "connected" | "file_updated" | "keepalive";
+    filename?: string;
+    timestamp?: number;
+    [key: string]: any;
+}
+declare const useRailtracksStream: (onMessage?: (data: StreamMessage) => void) => {
+    isConnected: boolean;
+    isConnecting: boolean;
+    error: string | null;
+    reconnect: () => Promise<void>;
+    disconnect: () => void;
+};
+export { useRailtracksStream };

package/dist/types/lib/theme.d.ts

@@ -16,6 +16,8 @@ export interface Theme {
         accentForeground: string;
         destructive: string;
         destructiveForeground: string;
+        success: string;
+        successForeground: string;
         border: string;
         mutedBorder: string;
         input: string;

package/dist/types/lib/utils.d.ts

@@ -1,4 +1,5 @@
 import { type ClassValue } from "clsx";
+import { ToolCall } from "../dto/AgentRunNode";
 export declare function cn(...inputs: ClassValue[]): string;
 /**
  * Converts a string to title case
@@ -77,3 +78,14 @@ export declare function getSafeThemeValue(theme: any, path: string, fallback: an
  * @returns A safe theme object with fallbacks
  */
 export declare function createSafeTheme(theme?: any): any;
+/**
+ * Detects the type of content for rendering
+ */
+export declare const detectContentType: (output: {
+    role: string;
+    content: any;
+}) => "string" | "toolResponse" | "toolCallList" | "other";
+/**
+ * Formats tool calls for display in a code block
+ */
+export declare const formatToolCalls: (toolCalls: ToolCall[]) => string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@railtownai/railtracks-visualizer",
-  "version": "0.0.23",
+  "version": "0.0.25",
   "license": "Apache-2.0",
   "author": "Railtown AI",
   "description": "A visualizer for RailTracks agentic flows",
@@ -48,6 +48,7 @@
     "lucide-react": "0.525.0",
     "moment": "2.30.1",
     "react-countup": "6.5.3",
+    "react-textarea-autosize": "8.5.9",
     "vaul": "1.1.2"
   },
   "scripts": {
@@ -57,7 +58,7 @@
     "build:size": "npm pack --dry-run",
     "build": "npm run build:types && npm run build:lib && npm run build:spa",
     "clean": "rm -rf dist build test-results .railtracks/ui/*",
-    "dev:spa": "rm -rf .railtracks/ui/* && vite build && cp -r build/* .railtracks/ui",
+    "dev": "rm -rf .railtracks/ui/* && vite build && cp -r build/* .railtracks/ui",
     "lint:fix": "prettier --write \"src/**/*.{js,jsx,ts,tsx,json,css,md}\"",
     "lint": "prettier --check \"src/**/*.{js,jsx,ts,tsx,json,css,md}\"",
     "start": "storybook dev -p 6006",