1"use client";23import data from "./fixture.json";4import { css } from "styled-system/css";5import {6 Card,7 CardHeader,8 CardTitle,9 CardBody,10 Stack, Table,
Violations
14 counted, under 7 rules. “Not counted” marks a compiler error that restates a design-system violation, “Ignored” one the agent silenced with a comment.
page.tsx:49:24 · <Stack direction>`direction` is not a layout prop of `Stack`: how it looks belongs to the component. Use one of its variants, or a layout prop (`marginInlineStart`, `flexGrow`, `width`…).
page.tsx:52:26 · <Stack direction>`direction` is not a layout prop of `Stack`: how it looks belongs to the component. Use one of its variants, or a layout prop (`marginInlineStart`, `flexGrow`, `width`…).
page.tsx:53:31 · <Heading flex>`flex` is not a layout prop of `Heading`: how it looks belongs to the component. Use one of its variants, or a layout prop (`marginInlineStart`, `flexGrow`, `width`…).
page.tsx:56:32 · <Badge flex>`flex` is not a layout prop of `Badge`: how it looks belongs to the component. Use one of its variants, or a layout prop (`marginInlineStart`, `flexGrow`, `width`…).
page.tsx:61:26 · <Stack direction>`direction` is not a layout prop of `Stack`: how it looks belongs to the component. Use one of its variants, or a layout prop (`marginInlineStart`, `flexGrow`, `width`…).
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
read_file
1,202
45
$0.0000
1
list_components
1,812
360
$0.0000
2
write_file
4,621
950
$0.0000
3
cdb5d9e77633
Output cap
20,000 tokens a step
11
12 TableHead,
13 TableBody,
14 TableRow,
15 TableHeader,
16 TableCell,
17 Badge,
18 Heading,
19 Progress,
20} from "@vektos/ds";
21
22const { order, lines } = data;
23
24 // Sort lines by location, aisle first (by first character of location string, then full string)
25 const sortedLines = [...lines].sort((a, b) => {
26 const locA = a.location;
27 const locB = b.location;
28 // primary sort by first letter (aisle)
29 const firstA = locA[0].toUpperCase();
30 const firstB = locB[0].toUpperCase();
31 if (firstA !== firstB) return firstA.localeCompare(firstB);