yagnikbarasiya2306@gmail.com

Web · Agent run timeline

Trace

Show the work, not a spinner.

A timeline for AI agents: reasoning streams in and folds away, tool calls show their input and output, parallel calls run side by side and failures offer a retry. Reads OpenAI, Anthropic and AI SDK streams.

View on GitHub Live demo
Platform
Any modern browser · any framework
Size
5.7 KB gzip
Dependencies
None
Licence
MIT · free for client work

Demo

A recording of the demo. Open it in a new tab

What it does

  1. 01

    Streaming reasoning that collapses to “Reasoned for 1.3s”

  2. 02

    Tools that start together are grouped into parallel lanes with progress

  3. 03

    Adapters for OpenAI Responses, Anthropic Messages and the Vercel AI SDK

  4. 04

    Scroll-aware auto-follow, live-region announcements and reduced motion

Use it

Get the filesbash
git clone https://github.com/YagnikBarasiya23/trace-agent-timeline.git
# copy trace.js and trace.css into your project
Examplejs
import Trace from './trace.js';

const trace = new Trace(document.querySelector('#trace'));

// From a model stream…
await trace.fromEvents(stream, { format: 'anthropic', runTool: (name, args) => tools[name](args) });

// …or by hand
const call = trace.tool('analytics.summary', { args: { days: 30 } });
call.done({ result: { reach: 7200 } });
trace.finish('Post scheduled');

Every option, the technique behind the motion and the accessibility notes are in the README on GitHub

More components

All 15
  • Web

    08 · Prompt composer

    Vanish

    Messages that turn to particles and rebuild.

    • 4.5 KB gzip
    • No dependencies
    • Free · MIT
  • Flutter

    09 · Arc gauge

    Arcline

    Progress that springs, not ticks.

    • Single Dart file
    • No dependencies
    • Free · MIT

Get in touch

Open for freelance projects, contract roles and collaborations — mobile apps and full-stack products in particular. WhatsApp gets the fastest reply.

Message on WhatsApp Send an email
Based in
Rajkot, Gujarat, India
Elsewhere