react-pdf-highlighter - Set of React components for PDF annotation

  •        76

react-pdf-highlighter is a React library that provides annotation experience for PDF documents on web. It is built on top of PDF.js by Mozilla. Text and rectangular highlights are supported. Highlight data format is independent of the viewport, making it suitable for saving on the server. For online demo check https://agentcooper.github.io/react-pdf-highlighter/.

https://github.com/agentcooper/react-pdf-highlighter#readme
https://github.com/agentcooper/react-pdf-highlighter

Dependencies:

lodash : ^4.17.10
pdfjs-dist : 2.0.489
react-pointable : ^1.1.1
react-rnd : ^7.1.5

Tags
Implementation
License
Platform

   




Related Projects

react-pdf-js - A React component to wrap PDF.js

  •    Javascript

react-pdf-js provides a component for rendering PDF documents using PDF.js. Written for React 15/16 and ES2015 using the Airbnb style guide.

react-native-pdf-view - React Native PDF View

  •    Objective-C

React native 0.40 moved iOS headers, thus all iOS react import statements has been changed. Use version 0.4.* for react native >=0.40. For earlier version see below breaking change. React native 0.19 changed the ReactProps class which led to problems with updating native view properties (see https://github.com/facebook/react-native/issues/5649). These errors are corrected in react-native-pdf-view version 0.2.0. Use version 0.2.* for react native >=0.19 and for earlier react native versions use version 0.1.3.

react-native-doc-viewer - React Native Doc Viewer (Supports file formats: xls,ppt,doc,xlsx,pptx,csv,docx,png,jpg,pdf,xml,binary

  •    Objective-C

React Native Native Module Bridge Quicklock Document Viewer for IOS + Android supports pdf, png, jpg, xls, ppt, doc, docx, pptx, xlx + Video Player mp4 supported

react-syntax-highlighter - syntax highlighting component for react with prismjs or highlightjs ast using inline styles

  •    Javascript

Check out a small demo here and see the component in action highlighting the generated test code here. There are other syntax highlighters for React out there so why use this one? The biggest reason is that all the others rely on triggering calls in componentDidMount and componentDidUpdate to highlight the code block and then insert it in the render function using dangerouslySetInnerHTML or just manually altering the DOM with native javascript. This utilizes a syntax tree to dynamically build the virtual dom which allows for updating only the changing DOM instead of completely overwriting it on any change, and because of this it is also using more idiomatic React and allows the use of pure function components brought into React as of 0.14.

react-pdf - Display PDFs in your React app as easily as if they were images.

  •    Javascript

Display PDFs in your React app as easily as if they were images. Minimal demo page is included in sample directory.


react-highlight - React component for syntax highlighting

  •    Javascript

The styles will most likely be in node_modules/highlight.js/styles folder. Code snippet that requires syntax highlighting should be passed as children to Highlight component in string format. Language name of code snippet should be specified as className.

vue-pdf - vue.js pdf viewer

  •    Javascript

since v2.x, the script is exported as esm. The url of the pdf file. src may also be a string|TypedArray|DocumentInitParameters|PDFDataRangeTransport for more details, see PDFJS.getDocument().

MuPDF - A Lightweight PDF, XPS and E-book viewer

  •    C

MuPDF is a lightweight PDF, XPS, and E-book viewer. It renders text with metrics and spacing accurate to within fractions of a pixel for the highest fidelity in reproducing the look of a printed page on screen. It supports PDF 1.7 with transparency, encryption, hyperlinks, annotations, searching and more. The viewer is small, fast, yet complete. It supports many document formats, such as PDF, XPS, OpenXPS, CBZ, EPUB, and FictionBook 2. You can annotate PDF documents and fill out forms with the mobile viewers (this feature is coming soon to the desktop viewer as well).

Manta - ๐ŸŽ‰ Flexible invoicing desktop app with beautiful & customizable templates.

  •    Javascript

A desktop application for creating invoices with beautiful and customizable templates. If you're interested in translating Manta, please see the detailed instruction here. The following languages are currently being translated, if you would like to Manta to support another language, please submit your request here.

resumake.io - ๐Ÿ“‹ A website for automatically generating elegant LaTeX resumes.

  •    Javascript

A website for automatically generating elegant LaTeX resumes without the need to write any TeX code yourself. Simply choose a template, fill in as much (or as little) info as you want, and then press Make to see your output. You can change your template at any point to see how your resume looks with different designs.

react-json-tree - React JSON Viewer Component, Extracted from redux-devtools

  •    Javascript

React JSON Viewer Component, Extracted from redux-devtools. Supports iterable objects, such as Immutable.js. Check out examples directory for more details.

Android PDF Viewer

  •    Java

Andorid PDF Viewer is a viewer for PDF-Files on ANDROID mobiles. The implementation will be a port of the pdf-renderer which is published by SUN under the LGPL: https://pdf-renderer.dev.java.net/. The first version will be very slow, so do not hurry...

PDFEdit

  •    C++

PDFedit is a free open source pdf editor and a library for manipulating PDF documents. It includes PDF manipulating library based on xpdf, GUI, set of command line tools and a pdf editor. You can use it to read, change and extract information from a PDF file. It is based on xpdf library.

react-native-button-component - A Beautiful, Customizable React Native Button component for iOS & Android

  •    Javascript

React Native Button component for iOS & Android. CircleButton, RoundButton, RectangleButton is on top of ButtonComponent. So I recommend you should use CircleButton, RoundButton, RectangleButton, rather than directly use ButtonComponent because those button components may have preset some options.

kalendaryo - An unopinionated React date component :atom_symbol: + :date:fns

  •    Javascript

Kalendaryo is an unopinionated React component for building calendars. It has no opinions about what your calendar component should look or function like but rather only helps you deal with those unique constraints by providing various variables your calendar component needs such as the calendar's state data and methods for getting(i.e. all the days in a month) and setting(i.e. selecting the date from a day) plus many more! See the Basic Usage section to see how you can build a basic calendar component with Kalendaryo, or see the Examples section to see more examples built with Kalendaryo. Is the state for the current date the component is in. By convention, this should only change when the calendar changes its current date, i.e. moving to and from a month or year on the calendar.

react-remarkable - A React component for rendering Markdown with remarkable

  •    Javascript

A React component for rendering Markdown with remarkable. Shortly you'll see that markdown syntax highlighting is enabled.

PDF.js - PDF Reader in JavaScript

  •    Javascript

PDF.js is a Portable Document Format (PDF) viewer that is built with HTML5. PDF.js is community-driven and supported by Mozilla Labs. Our goal is to create a general-purpose, web standards-based platform for parsing and rendering PDFs.

react-hint - Tooltip component for React, Preact, Inferno

  •    Javascript

React-hint is a small tooltip component for React which is developed with simplicity and performance in mind. It also plays nicely with Preact and Inferno. You don't need to include ReactHint in every component which uses tooltips, just include it once in the topmost container component. In case you need to define multiple instances of ReactHint, you can customise the attribute name per instance. ReactHint also supports custom tooltip content with attached event handlers by overriding the content renderer and returning a react node.