@doc-preview/js
v1.1.2
Published
Vanilla JavaScript API for Doc Preview.
Maintainers
Readme
@doc-preview/js
Vanilla JavaScript host for Doc Preview, built on @doc-preview/core. Mount a full document viewer in any HTMLElement without React or Angular.
Current release: 1.1.2 — Depends on @doc-preview/core ^1.1.2. See monorepo CHANGELOG.
Repository: github.com/rajkishorsahu89/doc-preview
Demo: doc-preview-app.vercel.app — tool · demo · guide
Keywords: doc-preview javascript vanilla-js document-viewer pdf file-preview
Install
npm install @doc-preview/js @doc-preview/themes
# Optional enterprise / office:
npm install @doc-preview/enterprise @doc-preview/office@import "@doc-preview/themes/doc-preview.css";Supported file types
| Category | Extensions | Package |
| --- | --- | --- |
| PDF | .pdf | core |
| Images | .png, .jpg, .jpeg, .gif, .webp, .bmp, .svg, .tif, .tiff | core |
| Word | .docx, .docm, .dotx | core |
| Word (legacy) | .doc | office |
| Excel | .xlsx, .xlsm, .xltx, .xls, .ods | office |
| PowerPoint | .pptx, .pptm, .potx, .ppt, .odp | office |
| OpenDocument text | .odt | office |
| CSV / TSV | .csv, .tsv | core |
| Text & data | .txt, .md, .log, .json, .xml | core |
| HTML | .html, .htm | core |
| Video / audio | .mp4, .webm, .mov, .mp3, .wav, .m4a | core |
| Cloud embed (public URL) | .doc, .ppt, .pptx, .xlsx, .pdf, .odt, .ods, .odp | office |
Upload accept: .pdf,.doc,.docx,.docm,.dotx,.odt,.ods,.odp,.xls,.xlsx,.xlsm,.xltx,.ppt,.pptx,.pptm,.potx,.png,.jpg,.jpeg,.gif,.webp,.bmp,.svg,.tif,.tiff,.mp4,.webm,.mov,.mp3,.wav,.m4a,.txt,.md,.html,.htm,.csv,.tsv,.json,.xml,.log
Usage
import { createDocPreview } from "@doc-preview/js";
const instance = createDocPreview(document.getElementById("viewer")!, {
documents: [{ uri: "/sample.pdf", fileName: "sample.pdf" }],
onPhaseChange: (e) => console.log(e.phase)
});
// Later:
instance.refresh();
instance.destroy();Usage — headless core API
For full control, use core directly (also re-exported from this package):
import {
createPreviewApi,
mountPreviewTree,
createPreviewDocumentFromBlob
} from "@doc-preview/js";
const api = createPreviewApi({
documents: [{ uri: "/file.pdf" }]
});
await mountPreviewTree({
host: document.getElementById("viewer")!,
engine: api.engine
});Enterprise
Register a licence before mounting (via @doc-preview/enterprise):
import { registerEnterpriseLicenseFromPredefinedKey } from "@doc-preview/enterprise";
registerEnterpriseLicenseFromPredefinedKey("YOUR-LICENSE-KEY");Pass enterprise options through config.enterprise on createDocPreview.
