Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/teammaestro/pdf-viewer
PDF viewer web component built in StencilJS. Reusable in Angular, Ionic, React, Vue.JS, etc.
https://github.com/teammaestro/pdf-viewer
angular ionic pdf pdf-viewer reactjs stencil stenciljs stenciljs-components
Last synced: 22 days ago
JSON representation
PDF viewer web component built in StencilJS. Reusable in Angular, Ionic, React, Vue.JS, etc.
- Host: GitHub
- URL: https://github.com/teammaestro/pdf-viewer
- Owner: TeamMaestro
- License: mit
- Created: 2018-05-25T13:18:57.000Z (over 6 years ago)
- Default Branch: main
- Last Pushed: 2024-02-04T17:08:55.000Z (9 months ago)
- Last Synced: 2024-10-15T01:06:38.540Z (22 days ago)
- Topics: angular, ionic, pdf, pdf-viewer, reactjs, stencil, stenciljs, stenciljs-components
- Language: TypeScript
- Homepage:
- Size: 1.66 MB
- Stars: 78
- Watchers: 14
- Forks: 12
- Open Issues: 10
-
Metadata Files:
- Readme: readme.md
- License: LICENSE
Awesome Lists containing this project
README
# Hive PDF Viewer
This web component allows you to add PDF rendering support to your web applications.
## Features
- Rendering PDFs on web (Angular, Ionic, React, Stencil, etc.)
- Search
- Fit to Page / Fit to Width
- Side panel for quick thumbnail navigation
## Installation
- `npm i @teamhive/pdf-viewer`
## Usage
```
```
Somewhere in your project (e.g. `main.ts`):
```
import { defineCustomElements } from '@teamhive/pdf-viewer/dist/loader';
defineCustomElements(window);
```
### Angular
Add viewer assets to `angular.json` assets block:
```
{
"projects": {
"app": {
"architect": {
"build": {
"options": {
"assets": [
{
"glob": "**/*",
"input": "node_modules/@teamhive/pdf-viewer/dist/pdf-viewer/pdf-viewer-assets",
"output": "pdf-viewer-assets"
}
```
Follow the [Stencil JS Framework Integration](https://stenciljs.com/docs/overview) guide for more info.
## Properties
|Property|Default|Description
:---:|:---:|:---:
|`src`||The PDF web address location (http, https)|
|`page`|`1`|The default page index.|
|`enableToolbar`|`true`|If the toolbar is available for display.|
|`enableSideDrawer`|`true`|If the side drawer UI (and button) is available for display.|
|`enableSearch`|`true`|If the document can be searched through. Hides the button when false.|
### Events
|Event|Description|
:---:|:---:
|`linkClick(href: string)`|Emits the `href` clicked when it's not an internal document annotation.|
|`pageChange(currentPage: number)`|Emits the current page number when the current page changes.|
---
## Contributors
[
](https://github.com/sbannigan) | [
](https://github.com/sean-perkins) |[
](https://github.com/bbjdt2224) |
:---:|:---:|:---:
|[Sean Bannigan](https://github.com/sean-perkins)|[Sean Perkins](https://github.com/sean-perkins)|[Justin True](https://github.com/bbjdt2224)