Build Passed Success Block for React

Nothing ran. The stages, every log line, the test counts and the artifact sizes are typed sample data, and Deploy this build only says it was queued in this demo. To wire it, build STAGES from your pipeline's run (each stage with its seconds, its printed lines with their offsets and a summary) and ARTIFACTS from the files it produced; the total time, the shares, the stage start times, the test total and the artifact total are all worked out from them.

Because a terminal is dark by nature: it carries the dark scope on purpose, with a comment in the file, while the window, the stage bar and the table follow the active theme in light and dark. Its text and its times keep their contrast in both.

It is a group of four buttons with one always on. From the small breakpoint each is as wide as its share of the run (13, 16, 43 and 28 percent here), so the bar is the run drawn to scale; on a phone they are two by two over a thin bar with the same shares, the chosen one solid. Choosing a stage swaps the log and says its time and summary in the status line, and the window keeps its height.

Every line is real text with its time since the start, in a focusable scroll region named for the stage, so the keyboard can scroll it. It never moves on its own: Replay prints the chosen stage's lines once more with a short staggered fade, and with reduced motion they appear at once. Nothing loops. On a phone the lines never wrap; the region scrolls sideways inside itself.

It says in the status line that the build was queued in this demo and nothing was deployed, then stays pressed in a quiet style so a second press only says it was already queued. On a phone the button reads Deploy and keeps its full name for assistive technology.

Deploy this build is a Shine Button with a click handler that sets the local result, not a link. The handler is the framework's own click handler. Replace its body with your deploy call and say what it did in the status line.