Attributes
| Attribute | Type | Default | Description |
|---|---|---|---|
src | string | "" | URL of the PDF document |
page | number | 1 | Current page (1-based) |
zoom | string | "fit-width" | Zoom level or mode (fit-width, fit-page, auto, or a number) |
mode | string | auto | Color scheme: light or dark. Omit for auto-detection |
view | string | "single" | View mode: single or continuous |
show-toolbar | boolean | true | Show/hide the toolbar |
show-thumbnails | boolean | false | Show the thumbnail sidebar |
show-search | boolean | false | Show the search bar |
no-download | boolean | false | Hide the download button |
no-print | boolean | false | Hide the print button |
title | string | "" | Title shown in the toolbar |
lazy | boolean | false | Defer loading until visible |
Properties
| Property | Type | Description |
|---|---|---|
src | string | Get/set PDF URL |
page | number | Get/set current page number |
zoom | string | Get/set zoom level |
mode | string | Get/set color mode |
view | string | Get/set view mode |
showToolbar | boolean | Whether toolbar is visible (read-only) |
showThumbnails | boolean | Whether thumbnails are shown (read-only) |
showSearch | boolean | Whether search is open (read-only) |
noDownload | boolean | Whether download is disabled (read-only) |
noPrint | boolean | Whether print is disabled (read-only) |
viewerTitle | string | Title text (read-only) |
lazy | boolean | Whether lazy loading is on (read-only) |
Methods
| Method | Returns | Description |
|---|---|---|
nextPage() | void | Navigate to next page |
prevPage() | void | Navigate to previous page |
goToPage(n) | void | Navigate to page n |
getPageCount() | number | Get total page count |
getCurrentPage() | number | Get current page number |
zoomIn() | void | Zoom in one step |
zoomOut() | void | Zoom out one step |
setZoom(level) | void | Set zoom level or mode |
setData(source) | Promise | Load from ArrayBuffer, Uint8Array, or File |
openFile() | void | Open file picker dialog |
download() | Promise | Download the PDF |
print() | Promise | Print the PDF |
search(query) | Promise | Search for text |
clearSearch() | void | Clear search results |
toggleFullscreen() | void | Toggle fullscreen mode |
toggleThumbnails() | void | Toggle thumbnail sidebar |
toggleSearch() | void | Toggle search bar |
Events
| Event | Detail | Description |
|---|---|---|
pdf-loaded | { url, pageCount, title } | PDF document loaded successfully |
pdf-load-error | { url, error } | PDF failed to load |
page-change | { page, previousPage, pageCount } | Page navigation occurred |
zoom-change | { zoom, previousZoom } | Zoom level changed |
view-change | { view } | View mode changed |
file-opened | { name, size } | File opened via drag-drop or picker |
CSS Custom Properties
| Property | Default (light) | Description |
|---|---|---|
--pdf-viewer-bg | #ffffff | Component background |
--pdf-viewer-toolbar-bg | #f6f8fa | Toolbar background |
--pdf-viewer-border-color | #d1d5da | Border color |
--pdf-viewer-text-color | #24292e | Primary text color |
--pdf-viewer-text-muted | #586069 | Secondary text color |
--pdf-viewer-accent-color | #2563eb | Accent/interactive color |
--pdf-viewer-hover-bg | #f3f4f6 | Hover background |
--pdf-viewer-content-bg | #e8e8e8 | Viewport background |
--pdf-viewer-sidebar-bg | #f0f0f0 | Sidebar background |
--pdf-viewer-sidebar-width | 200px | Sidebar width |
--pdf-viewer-toolbar-height | 40px | Toolbar height |
--pdf-viewer-font-family | system-ui | Font family |
--pdf-viewer-shadow | subtle shadow | Page shadow |
CSS Parts
| Part | Description |
|---|---|
toolbar | The toolbar area |
content | The PDF viewport/content area |
sidebar | The thumbnail sidebar |
search | The search bar |
Keyboard Shortcuts
| Key | Action |
|---|---|
Left / Up / PageUp | Previous page |
Right / Down / PageDown | Next page |
Home | First page |
End | Last page |
+ / = | Zoom in |
- | Zoom out |
0 | Reset to fit-width |
Ctrl+F / Cmd+F | Toggle search |
Escape | Close search / exit fullscreen |