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 2 counted, under 1 rule. “Not counted” marks a compiler error that restates a design-system violation, “Ignored” one the agent silenced with a comment.
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 get_guidelines, list_components, list_tokens, read_file 137 80 $0.0000 1 list_files 8,127 27 $0.0000 2 read_file 104 38 $0.0000 3
Output cap 20,000 tokens a step 3 Badge,
4 Breadcrumb,
5 Card,
6 CardBody,
7 CardDescription,
8 CardHeader,
9 CardTitle,
10 Clipboard,
11 DataList,
12 FormatDate,
13 FormatNumber,
14 Heading,
15 LocaleProvider,
16 Stack,
17 Table,
18 TableBody,
19 TableCell,
20 TableHead,
21 TableHeader,
22 TableRow,
23 Text,
24 } from "@vektos/ds";
25 import { css } from "styled-system/css";
26
27 export default function Page() {
28 const { account, transactions } = data;
29
30 return (
31 <div className={`vektos ${css({ px: { base: "4", md: "6" }, py: "8" })}`}>
32 <LocaleProvider locale="it-IT">
33 <Stack maxWidth="page" marginInline="auto" gap="6">
34 <Breadcrumb
35 items={[
36 { label: "Accounts", href: "#" },
37 { label: "Current account", href: "#" },
38 { label: "Statements", href: "#" },
39 { label: "October 2026" },
40 ]}
41 />
42 <Heading level={1}>October 2026 statement</Heading>
43
44 <Card>
45 <CardHeader>
46 <CardTitle>Account details</CardTitle>
47 <CardDescription>Current account</CardDescription>
48 </CardHeader>
49 <CardBody>
50 <DataList
51 items={[
52 { label: "Account holder", value: account.holder },
53 {
54 label: "IBAN",
55 value: (
56 <Stack flexDirection="row" alignItems="center" gap="2">
57 <Text as="span" mono>
58 {account.iban}
59 </Text>
60 <Clipboard label="IBAN" value={account.iban} showValue={false} />
61 </Stack>
62 ),
63 },
64 {
65 label: "Statement period",
66 value: (
67 <Stack flexDirection="row" gap="1">
68 <FormatDate value={account.period.from} dateStyle="long" />
69 <Text as="span">–</Text>
70 <FormatDate value={account.period.to} dateStyle="long" />
71 </Stack>
72 ),
73 },
74 {
75 label: "Current balance",
76 value: (
77 <Text as="span" weight="semibold">
78 <FormatNumber
79 value={account.balance}
80 format="currency"
81 currency={account.currency}
82 />
83 </Text>
84 ),
85 },
86 ]}
87 />
88 </CardBody>
89 </Card>
90
91 <Card>
92 <CardHeader>
93 <CardTitle>Transactions</CardTitle>
94 <CardDescription>{transactions.length} transactions</CardDescription>
95 </CardHeader>
96 <Table aria-label="Transactions">
97 <TableHead>
98 <TableRow>
99 <TableHeader>Date</TableHeader>
100 <TableHeader>Description</TableHeader>
101 <TableHeader>Category</TableHeader>
102 <TableHeader numeric>Amount ({account.currency})</TableHeader>
103 <TableHeader>Status</TableHeader>
104 </TableRow>
105 </TableHead>
106 <TableBody>
107 {transactions.map((tx) => (
108 <TableRow key={tx.id}>
109 <TableCell>
110 <FormatDate value={tx.date} dateStyle="medium" />
111 </TableCell>
112 <TableCell>{tx.description}</TableCell>
113 <TableCell>{tx.category}</TableCell>
114 <TableCell numeric>
115 <FormatNumber
116 value={tx.amount}
117 format="currency"
118 currency={account.currency}
119 signDisplay="exceptZero"
120 />
121 </TableCell>
122 <TableCell>
123 {tx.status === "pending" ? (
124 <Badge tone="warning">Pending</Badge>
125 ) : null}
126 </TableCell>
127 </TableRow>
128 ))}
129 </TableBody>
130 </Table>
131 </Card>
132 </Stack>
133 </LocaleProvider>
134 </div>
135 );
136 }
5 get_component, get_component, get_component, get_component, get_component 185 182 $0.0000
6 get_component, get_component, get_component, get_component, get_component 4,512 117 $0.0000
7 get_component, get_component, get_component 4,881 78 $0.0000
8 write_file 2,217 4,538 $0.0000
9 check_code 4,603 851 $0.0000
10 write_file 1,048 1,653 $0.0000
11 check_code 1,701 857 $0.0000