Release: scrolled reading, vertical layout and Chromium 156 line layout

.changeset/annotations-start-from-controller.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/react': patch
+---
+
+`useAnnotations` starts from the records the controller already holds: those its annotation storage loaded before the hook listened were told by no event, so a book opened again listed no annotations until the next change (a scrolled view, which draws them from that list, showed none).

.changeset/atom-line-annotation-space.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A ruby line after a line holding only an image (an illustration paragraph) reaches only into the space under the image, as Chromium measures that line's content by the image, instead of half the image line's height.

.changeset/atom-vertical-align-middle.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+An image or inline-block styled `vertical-align: middle` centres on its line as Chromium places it: its box moves by half its ascent less its descent, less half its parent's x-height, so its middle sits half the parent's x-height above the parent's baseline, down a vertical line too. calibre's centred plate pages, a page-wide spacer and a full-height block both aligned middle, now stand where Chromium draws them.

.changeset/block-sizes-on-layout-grid.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A box's fixed, minimum and maximum block size sits on the LayoutUnit grid, truncated as Chromium stores a used size: paragraphs held to `min-width: 1.6em` down a vertical page stack 25.59375px apart instead of 25.6, so their excess no longer piles up over a page and moves where the next page's lines start.

.changeset/box-edges-as-tags.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+An inline element's start and end margin, border and padding take their width as Chromium's open and close tags do: a line that breaks where the element opens sends that start to the next line with the element's content, instead of leaving it on the line above or pushing the character before it down; nested elements each add their own, an empty element takes its width, vertical text reads the top and bottom sides, and percentage padding resolves against the containing block.

.changeset/break-before-past-page-end.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A block whose start lands past the end of the page, after a line or plate taller than the page, opens the next page however small it is, as Chromium breaks before it: a page-break `<div>` after an over-wide plate no longer hangs off the bottom of the plate's page.

.changeset/broken-box-keeps-the-page.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A box that breaks across pages paints as Chromium slices it: the fragment that breaks before or inside a child (or between a paragraph's lines) keeps the rest of the page, and no fragment strokes a border on an edge the break cut. A bordered box whose illustration moves to the next page draws its side borders down to the page bottom above it, with no bottom border there and no top border where it resumes.

.changeset/broken-image-without-alt.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A missing image with no `alt` attribute lays out as Chromium's 16px broken-image icon, as one with alt text does; only an empty `alt` collapses. A missing image in a short line no longer leaves every line after it a pixel high.

.changeset/canvas-image-formats.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+The browser reader decodes GIF, WebP and BMP images as well as PNG and JPEG — every format Core sizes — instead of painting their placeholder.

.changeset/chromium-line-breaking.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+Lines break where Chromium breaks them in every language. Each text item reads the ICU line rules its content language (`lang`) and `line-break` value select, as Chromium's ICU does: Chinese text, and Japanese and Korean text under `line-break: normal` or `loose`, reads the curly double quotes as brackets and may start a line with 〜 or ゠ (Japanese breaks only by default otherwise); `loose` also breaks before iteration marks and centered punctuation and between inseparables; a quotation mark breaks only between East Asian characters; and a number keeps its prefix and postfix together only as a number does. `word-break: break-all` and `keep-all` add and withhold breaks per text item as Blink does, and `line-break: anywhere` applies only to its own text. A line broken before spaces ends after them (a space followed by an ideographic space ends the line after the space), and a no-break space never hangs past the line's end. `-webkit-line-break` and `-epub-word-break` (and `-epub-text-transform` and `-epub-caption-side`) reach the engine as the properties Chromium aliases them to.

.changeset/clearing-block-keeps-its-margin.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A block with content that clears the floats before it keeps its top margin inside its container, as Chromium settles the container's position above a block cleared past adjoining floats: floats opening a box no longer move down by the margin of the paragraph that clears them.

.changeset/closers-before-a-break.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A chapter written as one long `<br>`-broken paragraph no longer has its text shaped again for every wrapped line that ends in a closing bracket or quote before a `<br>`; what is laid out is unchanged.

.changeset/closers-trim-across-elements.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A closing bracket or quote that overflows a line by half its width is trimmed to keep it on the line when the line crosses an element boundary and when the closer ends its element, as Chromium does since version 153: such a line no longer sends a whole note or the run after an annotated name down to the next line, and a trimmed closer keeps the end padding of the box it closes.

.changeset/column-images-snap.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+An image in a vertical line paints placed by its `object-fit` and snapped to whole CSS pixels, as an image in a horizontal line does: a plate centred down a column no longer lands a pixel off.

.changeset/contain-snaps-after-placement.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+An image letterboxed by `object-fit: contain` is placed in its unsnapped box and the placed rect snaps to whole pixels, as Chromium snaps it: a thin rule image scaled into a fractional box now rasters on the one row the browser draws it on instead of smearing across two. A raster placed under a pixel tall or wide keeps one pixel where its start rounds, as the browser keeps it, instead of reaching the hosts as an empty image they reject; only one thinner than four LayoutUnits paints nothing.

.changeset/han-kerning-classes.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+Adjacent CJK punctuation trims by Chromium's punctuation classes for every bracket and quote: the CJK double prime quotes (`〝〞〟`) and any other fullwidth bracket trim like `「」`, a fullwidth opener after a narrow one (`(「`) and a fullwidth closer before a narrow one (`」)`) trim, the middle dots `·` and `‧` make their neighbours trim as `・` does, and each of these closers can trim at a line end.

.changeset/inline-block-margin-box.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+An inline block stands on its line by its margin box, as Chromium lays it out: its margins, borders and padding surround its content, take their room along the line and push its last line's baseline down, so the line it rides grows by them (a translation wrapped in `display: inline-block; margin: 8px 0` sits 8px clear of the text above and below it).

.changeset/inline-blocks-as-atomic-inlines.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+An element styled `display: inline-block` lays out as Chromium's atomic inline whatever its tag: it takes its own `width` and `height` (a percentage across a vertical line resolving against the page when the line's own size is open, as Chromium's orthogonal fallback does), an empty one still stands on its line at its size, and one holding blocks lays them out inside it. calibre's centred-plate pages now land on the page Chromium shows them on, with the plate centred across it.

.changeset/inline-box-after-forced-break.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+An inline-block right after a forced break starts the next line when a box measures its content's widest line, as Chromium measures it: a shrink-to-fit table column holding `text<br><inline-block>` takes the wider of the two lines instead of their sum, and an inline box opening there brings its padding along.

.changeset/inline-table-monolithic.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+An inline table (`display: inline-table`) moves to the next page whole when it does not fit what is left of the page, as Chromium fragments an atomic inline, instead of breaking between its rows like a block table.

.changeset/justified-item-exact-advance.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+On a justified line, each inline item (a ruby pair, a styled span, the text between them) ends at the 1/64px ceiling of its exact advance, its glyphs' fixed-point advances plus its justification shares, as Chromium snaps an item's width; a share that lifts an item only slightly past a grid point no longer leaves it on the point below.

.changeset/justify-no-break-space.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A justified line spreads the gap after a no-break space with the other word gaps, as Chromium treats the no-break space as a space when it justifies (a numbered item such as "2. Particular care…" with a no-break space after its number no longer keeps that gap narrow), and a no-break space ending a justified line counts as content instead of hanging.

.changeset/ligature-joins.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A ligature paints as one cluster from its start, and the cluster after it joins when the whole ligature steps by its glyph's advance, so the GPU pen and the canvas pen both draw the ligature the font forms: an embedded face's contextual pair of em dashes no longer paints as two isolated dashes a pixel above the browser's joined bar.

.changeset/line-breaker-defects.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A `<br>` breaks the line under `line-break: anywhere` and after a preserved space, a paragraph shaped as one run longer than 64 KiB lays out instead of failing, a ligature is measured by its own glyphs in any run, a line rewound to the start of an item keeps an inline image that comes before it, an ideographic space (or another space separator) that overflows a line hangs past its end where the line may break after it, as Chromium hangs it, and a short ruby (a base of at most four glyphs under an annotation of at most eight) moves to the next line whole instead of breaking inside its base, as Chromium keeps it.

.changeset/line-end-reshape.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A line's last glyph is measured as Chromium reshapes a line's end: where the shaper marks the break after it unsafe (a kern pair with the space that hangs after it, as Tinos kerns "A" and "’" against the space, or with the next line's first character), the glyph takes the advance it shapes to alone. A line that fits only with that kerning breaks before the glyph, as Chromium breaks it, and a justified line spreads the slack its unkerned end leaves, in Latin text as in CJK.

.changeset/lines-decided-as-broken.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A paragraph's line edges (a closer trimmed to fit, a punctuation pair a break separates, a ruby base split across lines) are decided one line at a time as the line is broken, so a paragraph is built at most twice however many lines decide; a pair trim a later line moved away from its break is applied again, as Chromium applies it.

.changeset/margin-sets-through-wrappers.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+Margins collapsing through several plain wrappers join as one set, the largest positive plus the most negative, as CSS collapses adjoining margins: a negative margin deep in a chain of wrappers no longer cancels against only the nearest one, which left a title page's heading lower than in the browser.

.changeset/one-reader-paged-and-scrolled.md

@@ -0,0 +1,6 @@
+---
+'@ritojs/kit': minor
+'@ritojs/react': minor
+---
+
+A book read in pages and scrolled is one reader: switching between them lays the open book out again instead of opening it a second time. The page controller's `suspend()` hands its reader to another view (its canvas off the page, its page buffers let go, no painting, turns, keys or layouts answered, while its annotations, search and stored position stay and its layout calls still lay the reader out), `resume()` takes it back as laid out then, and `suspended` says which. `useRitoScrollView(controller, { active, paged, scroll })` in `@ritojs/react` runs the switch: the reader laid out scrolled and shown from where the pages were, then paged again from where the view was read. A scroll view has its windows as soon as it is made, so it can be moved before it is mounted, and through every new layout it stays on the window the reader reads, which a chapter laid out alone and the whole book number differently (switching to scrolled used to land at the book's start once the whole book was laid out).

.changeset/ruby-line-edge-alignment.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+In a justified paragraph, a ruby whose annotation is wider than its base sets its base against the line's start when it opens a line, and against the line's end when it ends a justified line, as Chromium aligns ruby at line edges; elsewhere the base stays centered under its annotation.

.changeset/ruby-overhang-at-line-edges.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A ruby whose annotation is wider than its base overhangs the text before it only when that text is on its own line, as Chromium lays it out: a ruby opening a line starts its annotation at the line's start. A justified, centered or right-aligned line that ends where the next element's first character did not fit aligns as Chromium aligns it, counting each ruby on it at its full width, so such a line ending at a ruby is not stretched.

.changeset/ruby-reaches-above-the-line.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A paragraph's first-line ruby reaches into the space above the line before the line grows, as Chromium lays it out: the collapsed margin above the paragraph and the space under the previous paragraph's last line, not across a top border or out of a paragraph that is its own formatting context; a ruby line that opens a page takes its whole height there.

.changeset/scroll-highlight-hits.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/kit': minor
+---
+
+A scroll view says which of the app's highlights the pointer is on, the one drawn on top: its `tap` event carries `highlight` (the highlight's `id` and its `bounds` in screen coordinates), and the new `highlightHover` event tells the one under a resting mouse each time it changes or the strip moves it, null once the mouse leaves or presses, so an app opens an annotation's editor on a tap and shows its tooltip on hover in a scrolled view as a page view's `annotationClick` and `annotationHover` let it.

.changeset/scroll-page-length.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/kit': minor
+---
+
+A scroll view's `pageLength` says how far a page moves its strip, as PageDown and PageUp move it (the view's length along the axis less two lines), so an app's own page commands — a menu's Previous and Next Page — move it as the keys do.

.changeset/scroll-selection-handles-hook.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/react': minor
+---
+
+`useScrollSelectionHandles(controller)` gives a scrolled view's selection ends where the view shows them, following the strip as it moves, with `focusEdge` naming the focus: what a toolbar over a scrolled selection stands on, as `useSelection`'s `focusRect` is for pages. `ScrollSelectionHandles` is built on it.

.changeset/scroll-view-selects-in-the-app.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/kit': patch
+---
+
+Text selection works in a scroll view a React host mounts through a ref: mounting the view again where it already is no longer lays the strip out again, which ended every drag and double press and, with each rest re-rendering the host, laid the strip out on every frame. While a selection is being made the whole-book layout waits, as it does for the page controller, so a layout landing mid-drag does not end the gesture.

.changeset/scrolled-reading.md

@@ -0,0 +1,7 @@
+---
+'@ritojs/core': minor
+'@ritojs/kit': minor
+'@ritojs/react': minor
+---
+
+Scrolled reading: a reader created with `spread: 'scrolled'` lays each chapter out as one continuous strip read through windows the size of the viewport, one window a spread, down the screen, or leftwards for a book whose spine's `page-progression-direction` is `rtl` (its vertical-rl chapters run leftwards as strips; a chapter whose text runs across the book's axis is paginated, each page one window). `getScrollLayout()` gives the windows end to end (axis, window length, each chapter's first spread, window count and extent), a located page's `blockOffset` says where the locator's line starts in its window, and a target the size of a window paints that window alone. The kit's `createScrollController(reader, canvas, { physics, input })` shows the windows end to end on one canvas at whole device pixels, keeps each window's picture while it is near, tells the reader which window is under the reading line, reports where the reader reads at rest and what a tap is on, and moves by `defaultScrollPhysics` or any `ScrollPhysics` an app gives; an app drives it itself with `grab`, `follow`, `release`, `scrollTo`, `scrollBy`, `scrollToSpread` and `scrollToLocator`. The view selects text with a mouse drag or a touch held still across windows (word and paragraph presses, scrolling on near the ends) and moves the selection's focus with Shift chords, following it off screen, draws the selection over each window and finds it again in a new layout (`selection` event, `selectionRects`, `clearSelection`), and `setHighlights` draws an app's search matches or annotations as page rects over the same windows (`viewRects` maps page rects onto the view, `canvas` is what it draws on); with `a11y` it mirrors the text on screen for screen readers once the strip rests. Its `scroll` event says how far through the book the strip is (`progress`, with the view's own length as `viewport`). `useRitoScrollReader` in `@ritojs/react` owns a scrolled reader and its view for a component (`containerRef`, `load`, `unload`, and `progress`, `position` and `selection` as state), and `ScrollSelectionHandles` draws its selection handles for touch input; the kit view gives the handles (`selectionHandles`, `beginSelectionHandleDrag`) in the page controller's shapes.

.changeset/software-webgl-canvas-pen.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+Where WebGL is a software rasterizer (SwiftShader, llvmpipe — a machine with no GPU), the canvas pen paints every page and the GPU only copies it in, as it already did where the browser refused WebGL for a performance caveat: Chromium creates a context on SwiftShader all the same, and the GPU pen there blended text a level or two off the canvas.

.changeset/text-emphasis.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': minor
+---
+
+Emphasis marks paint as Chromium paints them. `text-emphasis-style`, `text-emphasis-color`, `text-emphasis-position` and the `text-emphasis` shorthand (with their `-webkit-` spellings, and the `-epub-` spellings of all but the position) reach the engine; a character that takes a mark gets one, set in its face at half its size, outside its em box on the side the position names (a vertical line's right unless it says left), an upright mark centred on it down the column. Marks over a line push it down by what the room under the previous line's text does not absorb, marks under one grow its box, and the next line rises into that growth by the room above its own text.

.changeset/unlinked-stylesheets.md

@@ -0,0 +1,5 @@
+---
+'@ritojs/core': patch
+---
+
+A chapter lays out under the stylesheets it links and embeds and no others, as a browser applies them: a chapter without a `<link>` no longer takes every stylesheet the package lists (a book's unlinked note and plate pages keep their default paragraphs and image layout where its stylesheet indents and frames the other chapters).

.changeset/vertical-records.md

@@ -0,0 +1,7 @@
+---
+'@ritojs/core': minor
+'@ritojs/kit': minor
+'@ritojs/react': minor
+---
+
+A vertical-rl page's targets, outline, range rectangles and carets are where its columns are drawn, in the same page-content space as a horizontal page's, paged or scrolled; a scrolled window's records move with its pixels by the device rows it is drawn from. A caret's `geometry` gains `width`: it is the segment across its line, `width` 0 on a horizontal line and `height` 0 down a vertical one, and the kit projects it with that shape. `ReaderTextCaret.writingMode` (`ReaderWritingMode`) is the mode of the caret's line, and the kit's keyboard selection reads an arrow key on a `vertical-rl` focus as the key a quarter turn from it, as the browser does (down moves along the line, left to the next line). The React selection handles hang their knobs off the right and left ends of a caret across a vertical line, as they hang them over and under one across a horizontal line.