The pdfmergesortsplit SDK puts the PDF Merge editor — merging, sorting,
rotating, splitting — inside your own product. The editor runs in an iframe in
the visitor's browser, so no PDF ever reaches your server or ours.
Install
npm install pdfmergesortsplit
react is an optional peer dependency: the plain class does not import it.
Embed the editor
import { PDFMergeSortSplitClass } from 'pdfmergesortsplit';
const editor = new PDFMergeSortSplitClass('#editor', {
apiKey: '<licence JWT>', // without one the editor runs in test mode
});
await editor.whenReady();
const pages = await editor.getPages(); // where each page came from
const pdf = await editor.exportDocument(); // every page as one Blob
The container is filled with the iframe:
<div id="editor" style="height: 640px"></div>
React
import { PDFMergeSortSplit, usePdfMergeSortSplit } from 'pdfmergesortsplit/react';
export function PdfEditor({ onExport }) {
const { ref, exportDocument } = usePdfMergeSortSplit();
return (
<PDFMergeSortSplit
ref={ref}
config={{ apiKey: '<licence JWT>' }}
style={{ height: 640 }}
onExport={(result) => onExport(result.blob)}
/>
);
}
The iframe is created once and survives re-renders. To change the
configuration, remount the component with a key.
How it fits together
- The SDK creates an iframe pointing at the editor (
embedUrl, defaulthttps://pdfmerge.rsj.de). - The editor announces itself (
init) and the SDK answers with your configuration (initRsp) — title, icon, hidden controls, injected buttons, licence. - Your page drives the editor with promises (
loadDocument,getPages,exportDocument) and receives events (action,export,license). - Documents are parsed, edited and re-built in the browser. Nothing is uploaded.
Trying it locally
Both sample projects in the product repository point at the hosted editor and accept two query parameters:
?embed=http://localhost:4173 # use a local build of the editor
?token=<licence JWT> # supply a licence
git clone <repository>
pnpm run sdk:build
pnpm run samples:install
pnpm --dir sdksimple run dev # plain JavaScript sample
pnpm --dir sdksample run dev # React sample
Next steps
- Configuration — everything you can set.
- API reference — methods, events, types.
- Page provenance — keep track of where each page came from.
- Licensing — test mode, JWTs and what is checked.