feat(ui): render footnote sheets with native text - #205
Draft
Dustin-Kelley wants to merge 5 commits into
Draft
Dustin-Kelley wants to merge 5 commits into
Dustin-Kelley wants to merge 5 commits into
Conversation
Turn note and verse HTML into paragraphs of text runs so a native sheet can keep italics, bold locators, and superscripts. Co-authored-by: Dustin Kelley <Dustin-Kelley@users.noreply.github.com>
YPE-5832 / RNV2-5. Marker taps still open the existing native sheet. The sheet body uses themed text instead of the footnote WebView. Co-authored-by: Dustin Kelley <Dustin-Kelley@users.noreply.github.com>
The web sheet leaves reader classes plain, raises the verse marker, and uses 12px notes. Spaces on both sides of a tag now collapse so verses do not show a double space. Co-authored-by: Cursor <cursoragent@cursor.com>
System text size was scaling the sheet larger than the webview, and a nested text shift left the marker on the baseline. Lock font scaling and raise the marker with an inline view. Co-authored-by: Cursor <cursoragent@cursor.com>
The native sheet replaced it, so the DOM wrapper and the webview-only props it required are gone. Co-authored-by: Cursor <cursoragent@cursor.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Why
A footnote marker tap already opens a native sheet. The body of that sheet was a second WebView around the web
FootnoteContentcomponent. YPE-5832 / RNV2-5 asks for that body to be native when plain text can keep the formatting people actually see.Sample notes are USFM spans, not links or lists.
fqaandfqare italic alternate readings,fkandflare medium italic,fpstarts a new paragraph, and verse HTML carriessupmarkers plus words-of-Jesus and small-caps spans. The passage sanitizer already unwraps anchors. Option A ships.packages/ui/src/dom/footnote-content.tsxstays on disk and is no longer registered, so RNV2-10 can delete it. There is no runtime switch.Scope
parseFootnoteHtmlandfootnoteMarkerinpackages/ui/src/lib/footnote-html.tsFootnoteContentinpackages/ui/src/native/footnote-content.tsx, registered for the existingFootnoteContentimplBibleTextView,BibleCard, andBibleReaderstill own the sheet andonFootnotePress. Those three sheets no longer show the Android WebView loader.serifFaceinpackages/ui/src/theme/fonts.tsScripture in
BibleTextViewstays in the DOM. Highlights and the pickers are unchanged.Tradeoffs
A WebView body would have kept every browser default, including tags the fixtures never show. The run parser covers the spans in the John fixtures and the tags the sanitizer allows for emphasis, breaks, and superscripts. Tables in a note would flatten to text.
Cardis not used. Its fill would paint a second surface on the sheet.Italics use Untitled Serif. Registered Inter faces have no italic cut, and the serif fallback does. The verse quote uses that serif at the host
fontSize, or 20 when the host omits it. Notes stay at the small type step..frlocators are bold, and words of Jesus use thewjtoken. The web popup stylesheet does not apply those rules, because they live on the reader root. The quote stays closer to the chapter.When
referenceis missing, the heading is the verse number. There is no native string for the web "Verse N" label, and locale files in this repo are generated. Reader payloads includereference.A very long note sizes with the sheet and can clip at the screen. An inner scroll view would make everyday short notes tall.
Blast Radius
Anyone who taps a footnote marker in Bible Text View, Bible Card, or Bible Reader gets this body. A consumer
onFootnotePressstill replaces the sheet entirely. Public props are unchanged. The unused DOM footnote file is the only leftover for RNV2-10.Verification
pnpm exec jestinpackages/uipassed forfootnote-html.test.ts,footnote-content.test.tsx,bible-text-view.test.tsx, andbible-card.test.tsx(65 tests). One host test presses the marker and reads the word footnote from<p>footnote</p>. Component tests check light and darkwjcolor, italicunderstood, a 22px verse, and a 20px default.tsc --noEmit -p packages/ui/tsconfig.test.jsonpassed.oxlinton the touched files passed.An iOS or Android device was not run. Clipping on a very long note, and live API HTML beyond the John fixtures, are unproven on a phone.