Linear Stats Integration Block for React

Edit TEAMS at the top of the file: each team has a name, an issue-key prefix (key), a first issue number and the list of days its finished issues took, from started to completed. The medians, the dot rows, the headline's slowest issue, the highest and lowest medians in the sentence and the hidden table are all worked out from those lists. Change AXIS and TICKS together if your times run longer than 14 days.

One finished issue: the days between it being started and being completed. In Linear an issue carries both dates, so a real product can compute the same number per issue and group it by team. The median is the middle value of a lane (the mean of the two middle values when a lane has an even number of issues). Nothing here is read from Linear: the days are example data.

The plot is decorative and hidden from assistive technology. The figure's caption names it, each team's median is in the text beside its name ("Median 6.5 days") and the headline names the slowest issue. An unseen table inside the figure lists every issue with its team and days, and the table follows the plot as the figure's last child.

Teams are what Linear groups issues by, and a lane's dots are comparable because they share one axis. A priority or a label would need its own lanes: replace TEAMS with your own groups and the layout adapts. Keep the lane count to a handful so the figure stays inside the section's height on a phone.

On a phone each lane puts the team and its median on one line with the plot under it, the dots shrink and the axis keeps every other label. Time runs from the start in every language, so the plots and the axis stay left to right (dir="ltr") inside a right-to-left layout while the team names flip. The header fades up once on load and nothing else moves; with reduced motion it simply appears.