@railtownai/railtracks-visualizer 0.0.1

package/dist/components/VerticalTimeline.js

@@ -0,0 +1,156 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { PanelLeft } from "lucide-react";
+const VerticalTimeline = ({ stamps, currentStep, onStepChange, onToggle }) => {
+    const maxStep = stamps.length > 0 ? Math.max(...stamps.map((s) => s.step)) : 0;
+    const minStep = stamps.length > 0 ? Math.min(...stamps.map((s) => s.step)) : 0;
+    const totalSteps = maxStep - minStep + 1;
+    // Calculate latency for each step
+    const getStepLatency = (step) => {
+        const stepStamps = stamps.filter((s) => s.step === step);
+        if (stepStamps.length === 0)
+            return null;
+        // Calculate time difference from previous step
+        const prevStep = step - 1;
+        const prevStepStamps = stamps.filter((s) => s.step === prevStep);
+        if (prevStepStamps.length === 0)
+            return null;
+        const currentTime = Math.min(...stepStamps.map((s) => s.time));
+        const prevTime = Math.max(...prevStepStamps.map((s) => s.time));
+        return currentTime - prevTime;
+    };
+    // Get step label
+    const getStepLabel = (step) => {
+        const stepStamps = stamps.filter((s) => s.step === step);
+        if (stepStamps.length === 0)
+            return `Step ${step}`;
+        // Get the first identifier for this step
+        const identifier = stepStamps[0]?.identifier || "";
+        return identifier || `Step ${step}`;
+    };
+    // Format latency
+    const formatLatency = (latency) => {
+        if (latency < 1000) {
+            return `${latency.toFixed(0)}ms`;
+        }
+        else if (latency < 60000) {
+            return `${(latency / 1000).toFixed(1)}s`;
+        }
+        else {
+            return `${(latency / 60000).toFixed(1)}m`;
+        }
+    };
+    return (_jsxs("div", { style: {
+            width: "100%",
+            height: "100%",
+            backgroundColor: "white",
+            display: "flex",
+            flexDirection: "column",
+            overflow: "hidden"
+        }, children: [_jsxs("div", { style: {
+                    padding: "16px",
+                    borderBottom: "1px solid #e5e7eb",
+                    backgroundColor: "#f9fafb",
+                    display: "flex",
+                    justifyContent: "space-between",
+                    alignItems: "flex-start"
+                }, children: [_jsxs("div", { children: [_jsx("h3", { style: {
+                                    margin: 0,
+                                    fontSize: "16px",
+                                    fontWeight: 600,
+                                    color: "#1f2937"
+                                }, children: "Timeline" }), _jsx("p", { style: {
+                                    margin: "4px 0 0 0",
+                                    fontSize: "12px",
+                                    color: "#6b7280"
+                                }, children: "Click to jump to step" })] }), onToggle && (_jsx("button", { onClick: onToggle, style: {
+                            border: "none",
+                            background: "none",
+                            cursor: "pointer",
+                            color: "#6b7280",
+                            padding: "4px",
+                            display: "flex",
+                            alignItems: "center",
+                            justifyContent: "center",
+                            transition: "color 0.2s ease"
+                        }, title: "Collapse Panel", children: _jsx(PanelLeft, { size: 16 }) }))] }), _jsx("div", { style: {
+                    flex: 1,
+                    overflowY: "auto",
+                    padding: "8px 0 16px 0" // Add bottom padding
+                }, children: Array.from({ length: totalSteps }, (_, index) => {
+                    const step = minStep + index;
+                    const isActive = step === currentStep;
+                    const isPast = step < currentStep;
+                    const hasStep = stamps.some((s) => s.step === step);
+                    const latency = getStepLatency(step);
+                    const label = getStepLabel(step);
+                    return (_jsxs("div", { onClick: () => hasStep && onStepChange(step), style: {
+                            padding: "12px 16px",
+                            borderBottom: "1px solid #f3f4f6",
+                            cursor: hasStep ? "pointer" : "default",
+                            backgroundColor: isActive ? "#f0f9ff" : "transparent",
+                            borderLeft: isActive ? "4px solid #6366f1" : "4px solid transparent",
+                            transition: "all 0.2s ease",
+                            position: "relative"
+                        }, onMouseEnter: (e) => {
+                            if (hasStep && !isActive) {
+                                e.currentTarget.style.backgroundColor = "#f8fafc";
+                            }
+                        }, onMouseLeave: (e) => {
+                            if (hasStep && !isActive) {
+                                e.currentTarget.style.backgroundColor = "transparent";
+                            }
+                        }, children: [_jsxs("div", { style: {
+                                    display: "flex",
+                                    alignItems: "center",
+                                    gap: "8px",
+                                    marginBottom: "4px"
+                                }, children: [_jsx("div", { style: {
+                                            width: "12px",
+                                            height: "12px",
+                                            borderRadius: "50%",
+                                            backgroundColor: isActive ? "#6366f1" : isPast ? "#fbbf24" : hasStep ? "#9ca3af" : "#e5e7eb",
+                                            border: isActive ? "2px solid #6366f1" : "1px solid #d1d5db",
+                                            flexShrink: 0
+                                        } }), _jsxs("span", { style: {
+                                            fontSize: "14px",
+                                            fontWeight: isActive ? 600 : 500,
+                                            color: isActive ? "#1f2937" : "#6b7280"
+                                        }, children: ["Step ", step] }), latency && (_jsx("span", { style: {
+                                            fontSize: "11px",
+                                            color: "#9ca3af",
+                                            backgroundColor: "#f3f4f6",
+                                            padding: "2px 6px",
+                                            borderRadius: "4px",
+                                            marginLeft: "auto"
+                                        }, children: formatLatency(latency) }))] }), _jsx("div", { style: {
+                                    fontSize: "13px",
+                                    color: hasStep ? "#1f2937" : "#9ca3af",
+                                    lineHeight: "1.4",
+                                    wordBreak: "break-word",
+                                    fontStyle: hasStep ? "normal" : "italic"
+                                }, children: hasStep ? label : "No activity" }), isActive && (_jsx("div", { style: {
+                                    position: "absolute",
+                                    right: "8px",
+                                    top: "50%",
+                                    transform: "translateY(-50%)",
+                                    width: "6px",
+                                    height: "6px",
+                                    borderRadius: "50%",
+                                    backgroundColor: "#6366f1",
+                                    animation: "pulse 2s infinite"
+                                } }))] }, step));
+                }) }), _jsx("style", { children: `
+          @keyframes pulse {
+            0% {
+              opacity: 1;
+            }
+            50% {
+              opacity: 0.5;
+            }
+            100% {
+              opacity: 1;
+            }
+          }
+        ` })] }));
+};
+export { VerticalTimeline };

package/dist/hooks/index.d.ts

@@ -0,0 +1,5 @@
+export { useApi } from "./useApi";
+export { useFlowData } from "./useFlowData";
+export type { JsonFile, ApiError } from "./useApi";
+export type { FlowDataState, DataJsonNode, DataJsonEdge, DataJsonStructure } from "./useFlowData";
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACnD,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC"}

package/dist/hooks/index.js

@@ -0,0 +1,2 @@
+export { useApi } from "./useApi";
+export { useFlowData } from "./useFlowData";

package/dist/hooks/useApi.d.ts

@@ -0,0 +1,17 @@
+export interface JsonFile {
+    name: string;
+    size?: number;
+    modified?: string;
+}
+export interface ApiError {
+    message: string;
+    status?: number;
+}
+export declare const useApi: () => {
+    loading: boolean;
+    error: ApiError | null;
+    listJsonFiles: () => Promise<JsonFile[]>;
+    loadJsonFile: (filename: string) => Promise<any>;
+    triggerRefresh: () => Promise<any>;
+};
+//# sourceMappingURL=useApi.d.ts.map

package/dist/hooks/useApi.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useApi.d.ts","sourceRoot":"","sources":["../../src/hooks/useApi.ts"],"names":[],"mappings":"AAKA,MAAM,WAAW,QAAQ;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,QAAQ;IACvB,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,MAAM;;;yBAK2B,OAAO,CAAC,QAAQ,EAAE,CAAC;6BA6Bb,MAAM,KAAG,OAAO,CAAC,GAAG,CAAC;0BAyB1B,OAAO,CAAC,GAAG,CAAC;CAiC1D,CAAC"}

package/dist/hooks/useApi.js

@@ -0,0 +1,95 @@
+import { useState, useCallback } from "react";
+// Base URL for the API
+const API_BASE = "/api";
+export const useApi = () => {
+    const [loading, setLoading] = useState(false);
+    const [error, setError] = useState(null);
+    // Function to list all JSON files in the .railtracks directory
+    const listJsonFiles = useCallback(async () => {
+        setLoading(true);
+        setError(null);
+        try {
+            console.log("Fetching files from:", `${API_BASE}/files`);
+            const response = await fetch(`${API_BASE}/files`);
+            console.log("Response status:", response.status);
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            const files = await response.json();
+            console.log("Files received:", files);
+            return files;
+        }
+        catch (err) {
+            console.error("Error fetching files:", err);
+            const errorMessage = err instanceof Error ? err.message : "Unknown error occurred";
+            const apiError = {
+                message: errorMessage,
+                status: err instanceof Error && "status" in err ? err.status : undefined
+            };
+            setError(apiError);
+            return [];
+        }
+        finally {
+            setLoading(false);
+        }
+    }, []);
+    // Function to load a specific JSON file
+    const loadJsonFile = useCallback(async (filename) => {
+        setLoading(true);
+        setError(null);
+        try {
+            const response = await fetch(`${API_BASE}/json/${filename}`);
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            const data = await response.json();
+            return data;
+        }
+        catch (err) {
+            const errorMessage = err instanceof Error ? err.message : "Unknown error occurred";
+            const apiError = {
+                message: errorMessage,
+                status: err instanceof Error && "status" in err ? err.status : undefined
+            };
+            setError(apiError);
+            return null;
+        }
+        finally {
+            setLoading(false);
+        }
+    }, []);
+    // Function to trigger a frontend refresh
+    const triggerRefresh = useCallback(async () => {
+        setLoading(true);
+        setError(null);
+        try {
+            const response = await fetch(`${API_BASE}/refresh`, {
+                method: "POST"
+            });
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            const result = await response.json();
+            return result;
+        }
+        catch (err) {
+            const errorMessage = err instanceof Error ? err.message : "Unknown error occurred";
+            const apiError = {
+                message: errorMessage,
+                status: err instanceof Error && "status" in err ? err.status : undefined
+            };
+            setError(apiError);
+            return null;
+        }
+        finally {
+            setLoading(false);
+        }
+    }, []);
+    return {
+        loading,
+        error,
+        listJsonFiles,
+        loadJsonFile,
+        triggerRefresh
+    };
+};

package/dist/hooks/useFlowData.d.ts

@@ -0,0 +1,82 @@
+import { JsonFile } from "./useApi";
+export interface DataJsonNode {
+    identifier: string;
+    node_type: string;
+    stamp: {
+        step: number;
+        time: number;
+        identifier: string;
+    };
+    details: {
+        internals?: {
+            llm_details?: Array<{
+                model_name: string;
+                model_provider: string;
+                input: Array<{
+                    role: string;
+                    content: any;
+                }>;
+                output: {
+                    role: string;
+                    content: any;
+                };
+                input_tokens: number | null;
+                output_tokens: number | null;
+                total_cost: number | null;
+                system_fingerprint: string | null;
+            }>;
+            latency?: {
+                total_time: number;
+            };
+        };
+    };
+    parent: DataJsonNode | null;
+}
+export interface DataJsonEdge {
+    identifier: string;
+    source: string | null;
+    target: string;
+    stamp: {
+        step: number;
+        time: number;
+        identifier: string;
+    };
+    details: {
+        state?: string;
+        input_args?: any[];
+        input_kwargs?: any;
+        output?: any;
+    };
+    parent: DataJsonEdge | null;
+}
+export interface DataJsonStructure {
+    nodes: DataJsonNode[];
+    edges?: DataJsonEdge[];
+    stamps?: Array<{
+        step: number;
+        time: number;
+        identifier: string;
+    }>;
+    steps?: Array<{
+        step: number;
+        time: number;
+        identifier: string;
+    }>;
+}
+export interface FlowDataState {
+    availableFiles: JsonFile[];
+    currentFile: string | null;
+    flowData: DataJsonStructure | null;
+    loading: boolean;
+    error: string | null;
+}
+export declare const useFlowData: () => {
+    loading: boolean;
+    error: string | null;
+    loadFile: (filename: string) => Promise<void>;
+    refreshFiles: () => Promise<void>;
+    availableFiles: JsonFile[];
+    currentFile: string | null;
+    flowData: DataJsonStructure | null;
+};
+//# sourceMappingURL=useFlowData.d.ts.map

package/dist/hooks/useFlowData.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFlowData.d.ts","sourceRoot":"","sources":["../../src/hooks/useFlowData.ts"],"names":[],"mappings":"AACA,OAAO,EAAU,QAAQ,EAAE,MAAM,UAAU,CAAC;AAG5C,MAAM,WAAW,YAAY;IAC3B,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE;QACL,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;QACb,UAAU,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,OAAO,EAAE;QACP,SAAS,CAAC,EAAE;YACV,WAAW,CAAC,EAAE,KAAK,CAAC;gBAClB,UAAU,EAAE,MAAM,CAAC;gBACnB,cAAc,EAAE,MAAM,CAAC;gBACvB,KAAK,EAAE,KAAK,CAAC;oBACX,IAAI,EAAE,MAAM,CAAC;oBACb,OAAO,EAAE,GAAG,CAAC;iBACd,CAAC,CAAC;gBACH,MAAM,EAAE;oBACN,IAAI,EAAE,MAAM,CAAC;oBACb,OAAO,EAAE,GAAG,CAAC;iBACd,CAAC;gBACF,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;gBAC5B,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;gBAC7B,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;gBAC1B,kBAAkB,EAAE,MAAM,GAAG,IAAI,CAAC;aACnC,CAAC,CAAC;YACH,OAAO,CAAC,EAAE;gBACR,UAAU,EAAE,MAAM,CAAC;aACpB,CAAC;SACH,CAAC;KACH,CAAC;IACF,MAAM,EAAE,YAAY,GAAG,IAAI,CAAC;CAC7B;AAED,MAAM,WAAW,YAAY;IAC3B,UAAU,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE;QACL,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;QACb,UAAU,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,OAAO,EAAE;QACP,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,UAAU,CAAC,EAAE,GAAG,EAAE,CAAC;QACnB,YAAY,CAAC,EAAE,GAAG,CAAC;QACnB,MAAM,CAAC,EAAE,GAAG,CAAC;KACd,CAAC;IACF,MAAM,EAAE,YAAY,GAAG,IAAI,CAAC;CAC7B;AAED,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB,MAAM,CAAC,EAAE,KAAK,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;QACb,UAAU,EAAE,MAAM,CAAC;KACpB,CAAC,CAAC;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;QACZ,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;QACb,UAAU,EAAE,MAAM,CAAC;KACpB,CAAC,CAAC;CACJ;AAED,MAAM,WAAW,aAAa;IAC5B,cAAc,EAAE,QAAQ,EAAE,CAAC;IAC3B,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAC;IACnC,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB;AAED,eAAO,MAAM,WAAW;;;yBAyBH,MAAM;;oBAhCT,QAAQ,EAAE;iBACb,MAAM,GAAG,IAAI;cAChB,iBAAiB,GAAG,IAAI;CA4EnC,CAAC"}

package/dist/hooks/useFlowData.js

@@ -0,0 +1,66 @@
+import { useState, useEffect, useCallback } from "react";
+import { useApi } from "./useApi";
+export const useFlowData = () => {
+    const { listJsonFiles, loadJsonFile, loading: apiLoading, error: apiError } = useApi();
+    const [state, setState] = useState({
+        availableFiles: [],
+        currentFile: null,
+        flowData: null,
+        loading: false,
+        error: null
+    });
+    // Load available files on mount
+    useEffect(() => {
+        loadAvailableFiles();
+    }, []);
+    const loadAvailableFiles = useCallback(async () => {
+        const files = await listJsonFiles();
+        setState((prev) => ({
+            ...prev,
+            availableFiles: files
+        }));
+    }, [listJsonFiles]);
+    const loadFile = useCallback(async (filename) => {
+        setState((prev) => ({
+            ...prev,
+            loading: true,
+            error: null
+        }));
+        try {
+            const data = await loadJsonFile(filename);
+            if (data) {
+                setState((prev) => ({
+                    ...prev,
+                    currentFile: filename,
+                    flowData: data,
+                    loading: false,
+                    error: null
+                }));
+            }
+            else {
+                setState((prev) => ({
+                    ...prev,
+                    loading: false,
+                    error: "Failed to load file data"
+                }));
+            }
+        }
+        catch (err) {
+            setState((prev) => ({
+                ...prev,
+                loading: false,
+                error: err instanceof Error ? err.message : "Unknown error occurred"
+            }));
+        }
+    }, [loadJsonFile]);
+    const refreshFiles = useCallback(async () => {
+        await loadAvailableFiles();
+    }, [loadAvailableFiles]);
+    return {
+        ...state,
+        loading: state.loading || apiLoading,
+        error: state.error || apiError?.message || null,
+        loadFile,
+        refreshFiles
+    };
+};

package/dist/index.d.ts

@@ -0,0 +1,10 @@
+export { default as AgenticFlowVisualizer } from "./AgenticFlowVisualizer";
+export { default as App } from "./App";
+export { Edge } from "./components/Edge";
+export { FileSelector } from "./components/FileSelector";
+export { Node } from "./components/Node";
+export { Timeline } from "./components/Timeline";
+export { VerticalTimeline } from "./components/VerticalTimeline";
+export * from "./hooks";
+export * from "./types";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAGjE,cAAc,SAAS,CAAC;AAGxB,cAAc,SAAS,CAAC"}

package/dist/index.js

@@ -0,0 +1,13 @@
+// Library entry point for npm package
+export { default as AgenticFlowVisualizer } from "./AgenticFlowVisualizer";
+export { default as App } from "./App";
+// Export components
+export { Edge } from "./components/Edge";
+export { FileSelector } from "./components/FileSelector";
+export { Node } from "./components/Node";
+export { Timeline } from "./components/Timeline";
+export { VerticalTimeline } from "./components/VerticalTimeline";
+// Export hooks
+export * from "./hooks";
+// Export types
+export * from "./types";

package/dist/test/setup.d.ts

@@ -0,0 +1,2 @@
+import "@testing-library/jest-dom";
+//# sourceMappingURL=setup.d.ts.map

package/dist/test/setup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"setup.d.ts","sourceRoot":"","sources":["../../src/test/setup.ts"],"names":[],"mappings":"AAAA,OAAO,2BAA2B,CAAC"}

package/dist/test/setup.js

@@ -0,0 +1,22 @@
+import "@testing-library/jest-dom";
+import { vi } from "vitest";
+// Mock ResizeObserver for React Flow components
+global.ResizeObserver = class ResizeObserver {
+    observe() { }
+    unobserve() { }
+    disconnect() { }
+};
+// Mock window.matchMedia
+Object.defineProperty(window, "matchMedia", {
+    writable: true,
+    value: vi.fn().mockImplementation((query) => ({
+        matches: false,
+        media: query,
+        onchange: null,
+        addListener: vi.fn(), // deprecated
+        removeListener: vi.fn(), // deprecated
+        addEventListener: vi.fn(),
+        removeEventListener: vi.fn(),
+        dispatchEvent: vi.fn()
+    }))
+});

package/package.json

@@ -0,0 +1,78 @@
+{
+  "name": "@railtownai/railtracks-visualizer",
+  "version": "0.0.1",
+  "type": "module",
+  "license": "Apache-2.0",
+  "author": "Railtown AI",
+  "description": "A visualizer for RailTracks agentic flows",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/railtownai/railtracks-visualizer.git"
+  },
+  "keywords": [
+    "agents",
+    "visualizer",
+    "railtracks",
+    "agentic-flow",
+    "react",
+    "typescript"
+  ],
+  "dependencies": {
+    "lucide-react": "0.525.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
+    "reactflow": "11.11.4"
+  },
+  "scripts": {
+    "start": "vite",
+    "dev": "vite",
+    "lint": "prettier --check \"src/**/*.{js,jsx,ts,tsx,json,css,md}\"",
+    "lint:fix": "prettier --write \"src/**/*.{js,jsx,ts,tsx,json,css,md}\"",
+    "build": "tsc && vite build",
+    "build:lib": "tsc --project tsconfig.lib.json",
+    "publish:dry": "npm publish --dry-run",
+    "test": "vitest",
+    "test:run": "vitest run",
+    "test:ui": "vitest --ui",
+    "up": "ncu -u -x react -x react-dom -x @types/react -x @types/react-dom && npm install"
+  },
+  "devDependencies": {
+    "@testing-library/jest-dom": "6.6.3",
+    "@testing-library/react": "16.3.0",
+    "@types/react": "18.3.23",
+    "@types/react-dom": "18.3.7",
+    "@vitejs/plugin-react-swc": "3.10.2",
+    "jsdom": "26.1.0",
+    "npm-check-updates": "18.0.1",
+    "prettier": "3.6.2",
+    "typescript": "5.8.3",
+    "vite": "7.0.5",
+    "vitest": "3.2.4"
+  },
+  "prettier": {
+    "singleQuote": false,
+    "trailingComma": "none",
+    "arrowParens": "always",
+    "printWidth": 120,
+    "tabWidth": 2,
+    "useTabs": false,
+    "semi": true,
+    "bracketSpacing": true
+  }
+}