Team Contributions Changelog Block for React

Edit TEAMS at the top of the file: a team has an id, a name, its members (two-letter initials) and its changes, each with a kind and a title. The header's total, each cell's count, the "+N" beside the initials and both orderings are computed from that list.

It reorders the four cells, in the page itself and not just visually: "Most changes" puts the busiest team first, with ties broken by name, and "Name" sorts alphabetically. The reading order, the tab order and the grid always agree. A polite status line says which ordering is on.

It is a Segment Group: Tab moves to it, the arrow keys move between the two choices and choose the one you reach. In a right-to-left layout the arrows follow the reading direction.

Each team draws up to three initials in a stack with a "+N" for the rest, and writes the headcount beside it ("5 people"); the stack itself is hidden from assistive technology so the count is read once. No photos are used.

Both orderings are drawn unseen in the same grid cell as the live one, so the block is always as tall as the taller of the two. The cells don't animate between positions; they simply swap.

The header and the grid fade up once on load. With reduced motion that is off, and changing the order swaps the cells at once without any motion.