Recent components found new uses as staff-facing trucking reached five screens
/truck-plCaptured at a 375px viewport. Long pages scroll inside the frame.
The screenshots stay in Japanese. Every round is a real screen for a real Japanese industry, so an English re-render would no longer be the screen the agent actually produced.
Write-up
Recent components found new uses as staff-facing trucking reached five screens
Build log series: I give an AI that has never seen Gunjo (
@gunjo/ui) only the public npm package and the gunjo.jp docs, then ask it to build a real screen. This fifth and final staff-facing trucking round covered a data-driven transport cost and profitability dashboard: results by vehicle and shipper, cost composition, loaded-distance and cost ratios, and comparison with standard freight rates.
Result: 4/5, with recent builds independently validated
The dense desktop screen driven by live data passed tsc. The agent reported:
The library was unusually complete for Japanese administrative finance. A new adopter built nearly the entire accessible profit-and-loss console from existing components. The one-point deduction came from missing semantics for inverted KPIs.
The first core observation: recent components worked in trucking finance
This session had produced Leaderboard in #155 and LimitMonitor in #161. Another agent independently found both here:
-
Leaderboard fit top and bottom profitability. The caller controlled order,valueLabelformatted yen, row tone marked concerns, anddeltaTonestreated an increase as bad where required. -
LimitMonitor compared actual freight rates against standard rates.direction="floor"plus a signed difference mapped cleanly to over and under. A component built for hours on duty generalized to price comparison. StatGroup,LineChart,LabeledDonutCard, andDeltakept the analytics live, with no static mockups.
A component is not proven generic when it is built. A later agent has to find it in another domain. Trucking finance showed that the two recent components were shaped around reusable patterns, not their first industries.
The second core observation: inverted Statistic semantics reached two of three
A cost ratio is better when lower, while loaded-distance ratio is better when higher. The agent reported:
StatisticandStatGrouphave nogoodWhenor direction. Tone defaults from trend, so an upward arrow is always green. I manually separated trend, the actual direction of change, from tone, whether that change is good.DeltaandLeaderboardalready support tone by sign, so the omission inStatisticlooks accidental. Its most valuable addition would be good-direction semantics.
I added the second focused case to issue #412, after operating ratio in #154. One more financial or operational KPI screen would trigger goodWhen="high" | "low", with an explicit tone still taking precedence. The severe-count color cases in #155 and #157 are a different feature, so I did not inflate the count.
What I took away: unexpected cross-industry reuse is the strongest validation
Component validation had deepened in three stages:
- A later screen in the same domain independently finds the component.
- Another mode finds it in its natural job.
- Another industry finds an unanticipated use because the structural pattern matches.
The third is strongest. LimitMonitor was built for regulated hours but worked for freight rates because both are a value against a named limit. A mature foundation produces fewer new components and more surprising reuse. Staff-facing trucking reached five screens without another build; instead, recent work was validated in new contexts.
What it flagged
- 🟡
Statistic.goodWhenremained at two of three. - 🟡
ChartLegendlackedformatValue, unlike neighboring chart components, although its value accepts a React node. - 🟡 The
LimitMonitordocs call it server-safe, but a function passed throughformatValuefrom a server component can still fail in the Next.js build. The safety claim describes internal hooks, not arbitrary function props, and needs a note. - ✅
Deltafit profit, loss, and standard-rate differences through per-sign tones, whileLabeledDonutCardfit cost composition directly.
Nothing new was added under src this round. The 4/5 completed five staff trucking screens, validated Leaderboard and LimitMonitor across industries, and left Statistic.goodWhen at two of three.
📊 Component scoreboard (20 built)
Three of the six components added this session: LineChip / LimitMonitor / SectionList. In progress: Statistic goodWhen at two of three, MatchCard at one of three, and ValidityTimer at one of three.
📋 Mode progress
- ✈️ Air ✅ / 🚆 Rail ✅ / 🚕 Taxi ✅ / 🚌 Bus ✅
- 🚚 Trucking: five staff screens (dispatch, matching, fleet and labor, billing, profitability), staff coverage complete; customer-facing screens come next
Next up: build log #164
- Open customer-facing trucking with a shipper pickup-request and freight-tracking screen, then deepen it toward symmetry.
The run
- gunjo.jp / Leaderboard / LimitMonitor / LineChart / Delta / npm
@gunjo/ui/ GitHub / previous rounds #1 through #162 - GunjoUI by UIXHERO
Staff-facing trucking finished as recent components found new uses. Unexpected reuse across industries is the strongest evidence that a component captured a shared pattern.
This series is co-created with AI (Claude and Codex). A human designs the experiments, makes the calls, and fact-checks before publishing; the AI does the hands-on work and drafting.
Components from @gunjo/ui
The components this screen's source imports directly.
The code the agent actually wrote
Click a file to expand its source.