Rating and Laurels Trust Bar Awards Block for React

From SOURCES, an array of four review sites with a count and a rating. The count is their sum, the score their average weighted by count and rounded to one decimal, and the stars are drawn to the nearest half. Change the array and every figure follows.

No. The stars are a read-only drawing hidden from assistive technology and taken out of the tab order; the words beside them say the score.

To #: point it at your recognition page. It is a ghost button with an arrow that turns around in a right-to-left page. The button renders the link it's given with render, with nativeButton={false}.

No. The programmes are invented for the example. Each laurel is a drawing hidden from assistive technology, and the award, programme and year are text.

The awards are h3 headings, so the block carries an h2, "Reviews and recognition", that only screen readers see, which keeps the heading outline in order without adding a title to a one-line bar.

The rating comes first and the laurels stack under it, one per line, then the link. The dividers are hidden below lg, and nothing scrolls sideways at 320 pixels.