Web SDKv1.0.0
Get started (opens in a new tab)Changelog (opens in a new tab)Playground (opens in a new tab)JavaScript PDF viewer (opens in a new tab)Get a free key (opens in a new tab)

Loader

Controls every busy indicator the SDK shows: the veil while a tool prepares its UI (for example Manage Pages preparing the page tiles of a large document), and the full-screen document loader when you pass the same object to PDFViewer.showLoadingIndicator(container, { loader }) — it runs before the viewer exists, so it cannot read the viewer's config.
LoaderConfigconfig.loader

Example

viewer.tsTypeScript
const viewer = new PDFViewer(container, doc, {
  loader: { html: '<img src="/acme-logo.svg" width="72" alt="Loading" />' },
});

Options 2

htmlstringDefaultSDK spinner; '' an empty block
Custom loader markup (a branded logo), put into the page as HTML: your own markup only, never a user's. It is injected verbatim (it is your own trusted configuration), so a branded loader is one line.
textstringDefaultthe viewer.loading string
Label under the default spinner; ignored when html is set. text labels the document loader only; the busy veil shows no text. A text left out shows the default label; text: '' shows none.

Notes

Busy indicators are armed with a 150ms delay for regular tool activation, so fast operations never flash a loader; known-slow operations (Manage Pages on big documents) show it immediately.

The static document loader takes the same object: PDFViewer.showLoadingIndicator(container, { loader }). Pass your locale beside it — PDFViewer.showLoadingIndicator(container, { loader, locale }) — so the default label is in your users' language (see Locale).