Paper Viewer About Block for React

The papers are PAPERS at the top of the file: a short name, a title, a venue, the length, the authors, an abstract and a plot. A plot has a kind (line, bars or scatter), two series between 0 and 1 and two keys; the sentence under the figure is figure. The line series in the example are generated from the index by series(), so the same numbers render on the server and in the browser.

The drawing is hidden from assistive technology and the finding is the figure's caption, which says what the chart shows in a sentence, so no information is only in the picture. The keys under the drawing say which line or bar is which.

They are the library's tabs in a vertical list: one tab stop, the up and down arrows move between papers, and the open paper's page follows. The panel is a labelled region you can reach with Tab. Every page is the same height, so nothing below the block moves. Base UI selects a tab as it takes focus.

Papers have different amounts of text. An unseen copy of all of them sits in the same grid cell as the live one, hidden from assistive technology and the keyboard (inert), so the cell is always as tall as the tallest page.

The list becomes a row of chips that scrolls sideways above the page; choosing one scrolls it into view, which block-review reports as a sideways shift. The page drops its outer frame and stacks its parts. Nothing scrolls the page sideways at 320 pixels.

The header, the list and the page fade up once on load and again as each paper opens, with CSS transitions. With reduced motion the entrance is off and the block simply appears.