Oak Flats UI Primitives Catalogue

One tile per runtime. Glyph + label, drift chip (Pinned / Behind pin / Ahead of pin) and a Current / Pinned / Latest version dl. The current row is rendered in display type and the tone colour; pinned + latest sit smaller below.

Production answer

Runtime version tile is a reusable Oak Flats Muffler Men UI primitive with documented states, accessibility expectations, theme behavior, and implementation evidence.

Primary CTAReview Runtime version tile states

Generative search brief

Runtime version tile: One tile per runtime. Glyph + label, drift chip (Pinned / Behind pin / Ahead of pin) and a Current / Pinned / Latest version dl. The current row is rendered in display type and the tone colour; pinned + latest sit smaller below.

State A · full runtime grid · all 6 services

Runtime

Node.js

Pinned

Current: 22.11.0
Pinned: 22.11.0
Latest: 22.12.0

Runtime

Next.js

Pinned

Current: 16.0.4
Pinned: 16.0.4
Latest: 16.1.0

Runtime

pnpm

Pinned

Current: 9.12.3
Pinned: 9.12.3
Latest: 10.0.0

Runtime

Docker engine

Pinned

Current: 27.4.0
Pinned: 27.4.0
Latest: 27.4.1

Runtime

Postgres

Behind pin

Current: 16.5
Pinned: 16.6
Latest: 17.0

Runtime

Redis

Ahead of pin

Current: 7.4.2
Pinned: 7.2.5
Latest: 7.4.2

State B · matched · Node LTS pinned

Runtime

Node.js

Pinned

Current: 22.11.0
Pinned: 22.11.0
Latest: 22.12.0

State C · drift · Postgres behind pin, Redis ahead

Runtime

Postgres

Behind pin

Current: 16.5
Pinned: 16.6
Latest: 17.0

Runtime

Redis

Ahead of pin

Current: 7.4.2
Pinned: 7.2.5
Latest: 7.4.2