Runs / account-details Batch Runs from different design-system versions should not be compared.
The page A screenshot in each theme, as the benchmark took it.
page.tsx As the agent left it; marked lines broke a rule.
Violations None. The run followed every rule that was checked.
Steps One row per model call, with the tools it asked for. An agent that reads the guidelines before writing shows it here; what a checker or submit_view answered is under its call.
Step Tools Tokens in Tokens out Cost 0 list_files, get_guidelines, list_components 397 56 $0.0000 1 read_file, list_files 4,981 46 $0.0000 2 get_component, get_component, get_component, get_component 528 141 $0.0000
Output cap The provider's default 4 Breadcrumb,
5 Card,
6 CardBody,
7 CardFooter,
8 CardHeader,
9 CardTitle,
10 Clipboard,
11 DataList,
12 FormatDate,
13 FormatNumber,
14 Heading,
15 Link,
16 Stack,
17 Table,
18 TableBody,
19 TableCell,
20 TableHead,
21 TableHeader,
22 TableRow,
23 Text,
24 Tooltip,
25 Toaster,
26 toast,
27 } from "@vektos/ds";
28 import data from "./fixture.json";
29
30 export default function Page() {
31 const { account, recent } = data;
32
33 return (
34 <Stack gap="6">
35 <Breadcrumb
36 items={[{ label: "Accounts", href: "/accounts" }, { label: account.name }]}
37 />
38 <Heading level={1}>{account.name}</Heading>
39
40 <Card>
41 <CardHeader>
42 <CardTitle>Account details</CardTitle>
43 </CardHeader>
44 <CardBody>
45 <DataList
46 items={[
47 { label: "Holder", value: account.holder },
48 {
49 label: "IBAN",
50 value: (
51 <Stack
52 flexDirection="row"
53 alignItems="center"
54 gap="2"
55 onClick={() =>
56 toast({ title: "IBAN copied", tone: "success" })
57 }
58 >
59 <Text mono>{account.iban}</Text>
60 <Tooltip content="Copy IBAN">
61 <Clipboard
62 label="IBAN"
63 value={account.iban}
64 showValue={false}
65 />
66 </Tooltip>
67 </Stack>
68 ),
69 },
70 { label: "BIC", value: account.bic },
71 {
72 label: "Balance",
73 value: (
74 <FormatNumber
75 value={account.balance}
76 format="currency"
77 currency={account.currency}
78 />
79 ),
80 },
81 {
82 label: "Available balance",
83 value: (
84 <FormatNumber
85 value={account.available}
86 format="currency"
87 currency={account.currency}
88 />
89 ),
90 },
91 ]}
92 />
93 </CardBody>
94 </Card>
95
96 <Card>
97 <CardHeader>
98 <CardTitle>Recent transactions</CardTitle>
99 </CardHeader>
100 <Table aria-label="Recent transactions">
101 <TableHead>
102 <TableRow>
103 <TableHeader>Date</TableHeader>
104 <TableHeader>Description</TableHeader>
105 <TableHeader numeric>Amount</TableHeader>
106 </TableRow>
107 </TableHead>
108 <TableBody>
109 {recent.map((tx) => (
110 <TableRow key={tx.id}>
111 <TableCell>
112 <FormatDate value={tx.date} dateStyle="short" />
113 </TableCell>
114 <TableCell>{tx.description}</TableCell>
115 <TableCell numeric>
116 <FormatNumber
117 value={tx.amount}
118 format="currency"
119 currency={account.currency}
120 signDisplay="exceptZero"
121 />
122 </TableCell>
123 </TableRow>
124 ))}
125 </TableBody>
126 </Table>
127 <CardFooter>
128 <Link href="/accounts/business/transactions">
129 View all transactions
130 </Link>
131 </CardFooter>
132 </Card>
133
134 <Toaster />
135 </Stack>
136 );
137 }
get_component, get_component, get_component, get_component
4 get_component, get_component, get_component, get_component 4,280 93 $0.0000
5 get_component, get_component, get_component, get_component 3,593 90 $0.0000
6 list_files 3,201 1,032 $0.0000
10 read_file 1,088 3,100 $0.0000
11 write_file 3,129 2,233 $0.0000
12 check_code 2,314 707 $0.0000