Components

DocCentral provides production-ready React components for document viewing, form filling, and digital signatures.

Available Components

Component Architecture

All components follow a consistent architecture pattern:

• Provider Context: Components use the useSDKhook internally to access authentication and API methods.
• Controlled & Uncontrolled: Components support both patterns for flexibility in state management.
• Event Callbacks: Rich callback system for tracking user interactions and handling async operations.
• Styling: Components use neutral styling that can be customized via CSS classes and style props.

Usage Pattern

Components must be used within a DocCentralProvider:

import { DocCentralProvider, PDFViewer, SignaturePad } from '@doccentral/react';

function App() {
  return (
    <DocCentralProvider apiKey="pk_...">
      {/* Components work here */}
      <PDFViewer documentId="..." documentUrl="..." />
      <SignaturePad onComplete={handleSignature} />
    </DocCentralProvider>
  );
}

TypeScript Support

All components export their prop types for TypeScript users:

import { 
  PDFViewer, 
  type PDFViewerProps,
  SignaturePad, 
  type SignatureData,
} from '@doccentral/react';