`frameDidMount` is equivalent to using iframe.addEventListener('load');
Let's not add a new listener and just use the existing event we already have. Functionality still works.
Bad commit here with too much stuff. I apologize.
This sets up two Intersection Observers: the first captures every page that is at least 30% visible inside the `.pages` container, and the second captures every page that has at least one pixel on the horizontal center line of `.pages`. Both can be arrays of integers (page index).
The "visiblePages" array is duplicated and formatted into a "formattedPages" state, which gets displayed in the toolbar.
The toolbar displays that, unless the user clicks into the page input and enters their own integer (only a single integer, no range), which can then jump the preview to that page on Enter or blur().
The Arrow 'change page' buttons jump the preview back and forth by a 'full set'.
If one page is viewed at a time, this is moved on page a time, and if 10 pages are viewed at a time it jumps the pages by 10.
Left to do: adapt the "jump editor to match preview" divider button to work with new "centerPage".
If there were two inputs sending styles to the same target (ie row and column gap), they would override each other.
This change fixes that by deepening the merges. Admittedly, I turned to cGPT to help me with this as the nesting was throwing me for a loop. It works, though, and I understand it now that I can read it.
Adds a new AnchoredBox component that is functionally a clone of the "saving error" notifications, but drops a lot of the JS in favor of the new (chrome-only!) CSS Anchor Positioning API. In subsequent commits, either alternate styling or a polyfill will be added non-supported browsers.
The box contains a few inputs that modify the CSS applied to `.pages`, most critically a "start on right" toggle for the Facing Pages mode.
Trevor Buckner