@open-secure-viewer/react

React 17/18 components and hooks for the Open Secure Viewer SDK. Drop-in replacement for Apryse/PDFTron WebViewer React integration — zero license fees.

Install

npm i @open-secure-viewer/react @open-secure-viewer/core

Serve pdfium.wasm from your public folder (copy from node_modules/@hyzyla/pdfium/dist/pdfium.wasm).

Components

| Component | Description | |-----------|-------------| | SecureViewer | Single-document viewer with toolbar, thumbnails, annotations | | MultiTabViewer | Open multiple documents in tabs | | ComparisonViewer | Side-by-side document comparison |

Hooks

| Hook | Description | |------|-------------| | useOsvViewer | Core viewer state + controls | | useIrmLoader | IRM key exchange flow (requires @open-secure-viewer/irm) |

Quick Start

import { SecureViewer } from '@open-secure-viewer/react';

export default function App() {
  return (
    <SecureViewer
      src="https://example.com/document.pdf"
      wasmUrl="/pdfium.wasm"
      security={{
        disablePrint: true,
        disableCopy: true,
        watermark: { text: 'CONFIDENTIAL', opacity: 0.15 },
      }}
      style={{ width: '100%', height: '100vh' }}
    />
  );
}

Links

• Full documentation
• Core SDK → @open-secure-viewer/core
• GitHub

License

Apache-2.0