Glossary

Glossary

These pages use a small vocabulary of their own. Every term is defined here, so a page reached from a search can be read on its own.

glyph is one rendered unit of the value, in its own span. A grapheme, not a character: 👋 is one glyph made of two code units, and é typed as e plus a combining accent is one glyph made of two code points. Splitting either would roll the accent away on its own.

host is the <scritto-text> element itself, used when talking about its box, its layout or its styling. "The element" is the same thing seen as an API object you hold a reference to.

ghost is the copy of a glyph that is leaving. It holds the position it was drawn in while the box moves away underneath it, then fades. Ghosts are what the edge fade exists to cover, and they are deliberately never cancelled by the next update, so a digit halfway out of a fast counter finishes leaving rather than popping.

exits layer is .exits, the absolutely positioned layer that holds the ghosts. It is positioned by transform from the host's start edge rather than by layout, which is how the box can resize without dragging the ghosts along.

word is the span the glyphs of one word share, along with the spaces that follow it. It is the box a kept run's slide moves and the only place a wrapped value is allowed to break, which is why nothing ever breaks mid-word.

kept run is the glyphs that survive a change and slide to a new position instead of re-rolling. A run can be anchored to the start of the value, anchored to the end, or flush with neither end, and the last of those is the case SwiftUI does not handle.

band is the linear-gradient mask that dissolves ink at a travelling edge, 0.3em of ramp. Worn by the exits layer, never by the host, so the live value is never dimmed.

slack is extra room outside the content, given to the box so the band has somewhere to fade across that is not on top of a live glyph. The end side carries 0.4em, handed back to the line with a negative margin so nothing shifts.

room is --scritto-exit-room, set per transition, how far past the content the exits layer's own box extends. Measured from how far the edge actually travels, plus blur, because a mask paints no further than its own border box.

blockified is what the host becomes for the length of a transition: an inline host is switched to inline-block so its width can animate, with vertical padding and border cancelled by matching negative margins so the line keeps its height.

indent is the compensating text-indent applied while the box resizes, so content holds where it will land instead of drifting into place. It travels the distance the start edge has to move and eases to nothing alongside the width.

stagger is the wave of delays across the glyphs that changed, spanning at most 30% of the duration. A glyph's delay comes from where it sits along the changed stretch, not from its index, so a glyph leaving and the glyph replacing it move together.

trend is the direction the motion reads as. 1 up, -1 down, 0 reads it off the numbers in the value.

flow is <scritto-flow>, the wrapper that makes the words beside a value move on the same clock as the roll instead of jumping when the browser reflows the line.