Runs / statement 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, read_file 137 69 $0.0000 1 list_files 3,429 42 $0.0000 2 read_file, read_file, read_file 3,613 109 $0.0000 3
Output cap The provider's default 4 Card,
5 CardBody,
6 CardDescription,
7 CardHeader,
8 CardTitle,
9 Clipboard,
10 DataList,
11 FormatDate,
12 FormatNumber,
13 Heading,
14 LocaleProvider,
15 Stack,
16 Table,
17 TableBody,
18 TableCell,
19 TableHead,
20 TableHeader,
21 TableRow,
22 Text,
23 } from "@vektos/ds";
24
25 export default function Page() {
26 const { account, transactions } = data;
27
28 return (
29 <LocaleProvider locale="it-IT">
30 <div className="vektos">
31 <Stack gap="6" margin="6" maxWidth="page" marginInline="auto">
32 <Heading level={1}>October statement</Heading>
33
34 <Card accent>
35 <CardHeader>
36 <CardTitle>Current account</CardTitle>
37 <CardDescription>
38 {account.period.from} to {account.period.to}
39 </CardDescription>
40 </CardHeader>
41 <CardBody>
42 <DataList
43 items={[
44 { label: "Account holder", value: account.holder },
45 {
46 label: "IBAN",
47 value: <Clipboard label="IBAN" value={account.iban} />,
48 },
49 {
50 label: "Current balance",
51 value: (
52 <FormatNumber
53 value={account.balance}
54 format="currency"
55 currency={account.currency}
56 />
57 ),
58 },
59 ]}
60 />
61 </CardBody>
62 </Card>
63
64 <Card>
65 <CardHeader>
66 <CardTitle>Transactions</CardTitle>
67 <CardDescription>
68 {transactions.length} movements in the period.
69 </CardDescription>
70 </CardHeader>
71 <Table aria-label="Transactions">
72 <TableHead>
73 <TableRow>
74 <TableHeader>Date</TableHeader>
75 <TableHeader>Description</TableHeader>
76 <TableHeader>Category</TableHeader>
77 <TableHeader>Status</TableHeader>
78 <TableHeader numeric>Amount ({account.currency})</TableHeader>
79 </TableRow>
80 </TableHead>
81 <TableBody>
82 {transactions.map((tx) => (
83 <TableRow key={tx.id}>
84 <TableCell>
85 <FormatDate value={tx.date} dateStyle="medium" />
86 </TableCell>
87 <TableCell>{tx.description}</TableCell>
88 <TableCell>
89 <Text as="span" size="sm" tone="muted">
90 {tx.category}
91 </Text>
92 </TableCell>
93 <TableCell>
94 {tx.status === "pending" ? (
95 <Badge tone="warning">Pending</Badge>
96 ) : (
97 <Badge tone="neutral">Booked</Badge>
98 )}
99 </TableCell>
100 <TableCell numeric>
101 <FormatNumber
102 value={tx.amount}
103 format="currency"
104 currency={account.currency}
105 signDisplay="exceptZero"
106 />
107 </TableCell>
108 </TableRow>
109 ))}
110 </TableBody>
111 </Table>
112 </Card>
113 </Stack>
114 </div>
115 </LocaleProvider>
116 );
117 }
118
4 get_component, get_component, get_component, get_component, get_component, get_component 2,450 145 $0.0000
5 get_component, get_component, get_component, get_component, get_component 5,550 115 $0.0000
6 list_tokens 4,295 42 $0.0000
7 list_tokens, list_tokens 1,034 990 $0.0000
8 write_file 1,429 2,810 $0.0000
9 check_code 2,855 764 $0.0000
10 write_file 854 906 $0.0000
11 check_code 952 689 $0.0000
12 write_file 769 1,100 $0.0000
13 check_code 1,125 688 $0.0000
14 write_file 749 878 $0.0000
15 check_code 947 686 $0.0000