feat(document-viewer): add PDF text search with highlight overlay#2159
Open
mx-kshitij wants to merge 1 commit intomendix:mainfrom
Open
feat(document-viewer): add PDF text search with highlight overlay#2159mx-kshitij wants to merge 1 commit intomendix:mainfrom
mx-kshitij wants to merge 1 commit intomendix:mainfrom
Conversation
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
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.
Pull request type
Description
Adds in-document text search to the PDF viewer in
document-viewer-web.What changed:
PDFViewer.tsx— A search toggle button (magnifier icon) is added to the control bar. When activated, a secondary search bar appears below the controls with:"N of M"/"No results"/"Searching…"counter (aria-live).usePDFSearch.ts(new) — Custom hook that iterates all pages of the loadedPDFDocumentProxy, collects all case-insensitive substring matches asSearchMatchrecords (page, item index, char offsets), and exposesgoToNextMatch/goToPrevMatchwith automatic page navigation.usePDFHighlightPositions.ts(new) — Custom hook that convertsSearchMatchrecords on the current page into absolutely-positionedHighlightRectobjects. Usespage.getViewport()+ acanvascontext for proportional glyph-width measurement scaled to the actual rendered item width. Async effects are guarded with anactiveflag to prevent state updates after unmount/query change.BaseViewer.tsx— Added optionalSecondaryControlprop slot rendered between the toolbar and the page content.documentViewer.scss— Styles for.widget-document-viewer-search-bar,.widget-document-viewer-highlight-layer, and.widget-document-viewer-highlight(yellow for all matches, orange + outline for the current match). Uses Atlas UI tokens (--spacing-*,--border-color-default, etc.).documentViewerIcons.scss— AddedSearchicon (\e905) to theDocViewericon font map; broadened font-family scope so search-bar nav buttons also pick up the icon font.DocViewer.woff2— Updated to include the new search glyph.Why:
Users viewing multi-page PDFs had no way to locate specific text without scrolling manually. This brings standard Ctrl+F-style search behaviour to the widget, matching expectations from native PDF viewers.
What should be covered while testing?
"1 of N"."No results", no highlights.spanusesaria-live="polite").aria-pressed="true"when open.