Thinking

Expandable traces — steps, reasoning, search, coding.

Installation

bun add elia

@import "tailwindcss";
@import "@aile.sh/elia/styles/elia.css";
@source "../node_modules/@aile.sh/elia";

Usage

import { ThinkingState, type ThinkingRow } from "@aile.sh/elia";

const steps: ThinkingRow[] = [
  { primary: "Read", secondary: "invoices.ts", mono: true },
  { primary: "Edit", secondary: "BillingTable.tsx", mono: true, add: 32, del: 9 },
  { primary: "Run", secondary: "npm test", mono: true },
];

export function Example() {
  return (
    <ThinkingState
      variant="Coding"
      rows={steps}
      activeLabel="Running tools"
      doneLabel="Ran 3 tools"
      working={false}          // controlled — no scripted timeline
      defaultExpanded
      onRowClick={(row) => console.log("open", row.secondary)}
    />
  );
}

— elia design system · MIT · primitives · https://github.com/aile-sh/elia