Movement Leaderboard Stats Block for React

Edit CLUBS: a name, the distance this week (km) and last week's place (before, or null for a club that was not in the table). The module sorts by distance, ranks the rows, works out each move from the two places, and picks the biggest climber and faller. Change the unit by editing the km text in the row and the header line.

A change is told by its glyph and its words, so it reads the same for everyone and in every theme: an up arrow and "Up 4", a down arrow and "Down 3", a dash and "Level". There is no colour to decode, and the theme's foreground stays the only text colour.

They are the entries with the largest gain and the largest loss, among clubs that were in last week's table. A new entry has a shift of zero and never counts. If two clubs tie, the one higher in the table wins. If nobody gained a place the "climber" shows the first club with a shift of zero ("Level"), so you may want to hide the fact in that case.

The table is an ordered list named for the week. Each move is words, not a picture: "Up 4, 7 to 3" is read out, and the arrows are decorative. The two facts are a description list with the label first. Movements sit in bdi elements so the whole phrase keeps its order on right-to-left pages, and the rows never rely on colour.

The header and the two facts come first, then a hairline, then the rows. Each row keeps its rank, name, distance and move on one line; a long club name is truncated and the movement column keeps a fixed width so the rows line up. Nothing scrolls sideways at 320 pixels.