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".
This was previously in the .pageInfo widget, probably not for any good reason, but I'm moving it to the popups div for probably not a good reason.
It's used to get the parent .pane div, and pull its `height` value which is then passed to the `.brewRenderer` div to set the height.
I tried alternate methods that would make this obsolete (CSS methods mostly), but due to some complexity am just ditching those alternatives and popping this sucker into `.popups` for now.
handleScroll is replaced by getCurrentPage(), which effectively does the same thing. The math is slightly different, though very similar, and result seems to be the same.
Make it so that if a user enters a page number higher than the total page count, it jumps them to last page. if lower than 1, it jumps them to first page.
putting the `pageInput - 1` modifier in the `scrollToPage` method allows for more understandable button function ('back button' is `- 1` and 'forward button' is `+ 1`).
Moved onChange handler function to a component method and simplified it a smidge.
Must use parseInt now because the input type will change to 'text' rather than 'number'
The website UI should stay out of the iframe if possible. Otherwise, users can style the UI on their brew which may or may not be a pain, and it's simple enough to avoid it.
The makeZoom function is redundant if we just insert the style a little further down when the `.pages` div is initialized, as a `style` attribute on the tag.
Themes contain both CSS and Snippets. The brewRenderer only cares about the CSS, but other components need the Snippets. Better to have the parent "editPage", etc. load the theme bundles and pass them down to each child that needs it, rather than trying to pass from the child up.
This also fixes the `metadataEditor.jsx` not being able to change themes live; A new theme bundle is now loaded when a new theme is selected, instead of only the first time the BrewRenderer mounts.
Also renamed to "fetchThemeBundle"
