Task Rows

Live agent task status — running, failed, completed.

Installation

bun add elia

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

Usage

import { TaskRows } from "@aile.sh/elia";

export function Example() {
  return (
    <TaskRows
      variant="List"
      rows={[
        {
          key: "sync",
          label: "Sync invoices",
          amount: "38 records",
          status: "done",
          details: [{ label: "Reconciled with ledger", meta: "38/38" }],
        },
        {
          key: "audit",
          label: "Audit tax categories",
          amount: "4 vendors",
          status: "running",
          ring: { step: 2, active: true },
          details: [{ label: "Checking VAT codes", meta: "2/4" }],
        },
        {
          key: "notify",
          label: "Notify finance team",
          amount: "1 message",
          status: "pending",
          ring: { step: 3 },
          details: [{ label: "Summary email", meta: "draft" }],
        },
      ]}
      onRowToggle={(key, open) => console.log(key, open)}
    />
  );
}

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