API reference

@apertura/vue

Vue bindings for the Apertura viewer

9 exported symbols · 3 declared here · 6 re-exported

Classes

Viewerfrom @apertura/viewer

class Viewer

A framework-independent document viewer. The single place that knows the full path from bytes to format to document to DOM. The React, Vue and Angular wrappers are thin adapters over this class, so their behaviour is identical by construction rather than by convention.

state

ViewerState

container

HTMLElement

view

DocumentView | undefined

The live view, for reaching format-specific APIs such as page navigation.

(listener: (state: ViewerState) => void) => () => void

Subscribes to state changes. Returns an unsubscribe function.

open

(input: ByteSourceInput, options?: ViewerOptions) => Promise<void>

Opens a file and mounts its view. Calling it again before the previous call settles is correct: the older result is discarded. That is the normal case when a user picks files in quick succession.

refresh

() => void

Re-renders the current view.

() => void

Closes the document and clears the container.

destroy

() => void

Releases every resource. The instance must not be used afterwards.

Functions

createDefaultRegistryfrom @apertura/viewer

function createDefaultRegistry(): FormatRegistry

A registry with every supported format registered. The convenient entry point for an application that just needs to open a file. When bundle size matters, build a {@link FormatRegistry} by hand so only the parsers actually used are included.

createViewerfrom @apertura/viewer

function createViewer(container: HTMLElement, options?: ViewerOptions): Viewer

Creates a viewer mounted into the given element.

useApertura

function useApertura(options?: ViewerOptions): UseAperturaResult

Binds a {@link Viewer} to a Vue component's lifecycle. The viewer is created when `containerRef` receives an element rather than on setup: there is no DOM node before the component mounts, and the viewer needs one in its constructor.

Interfaces

UseAperturaResult

interface UseAperturaResult

containerRef

Ref<HTMLElement | null, HTMLElement | null>

Bind this to the container element with `ref`.

state

Ref<ViewerState, ViewerState>

open

(input: ByteSourceInput) => Promise<void>

() => void

viewer

ShallowRef<Viewer | undefined>

ViewerOptionsfrom @apertura/viewer

interface ViewerOptions extends ViewOptions, OpenOptions

registry?

FormatRegistry | undefined

The plugin set to use. Defaults to every supported format. Pass a custom registry to keep unused parsers out of the bundle.

renderOptions?

Record<string, unknown> | undefined

Extra options forwarded to the format renderer.

ViewerStatefrom @apertura/viewer

interface ViewerState

status

ViewerStatus

document

AperturaDocument | undefined

detection

DetectionResult | undefined

error

Error | undefined

progress

number

Parse progress, 0..1.

Type aliases

ViewerStatusfrom @apertura/viewer

type ViewerStatus = 'idle' | 'loading' | 'ready' | 'error'

Viewer state; UI wrappers render indicators from it.

Values

AperturaViewer

AperturaViewer: import("/repo/node_modules/.pnpm/vue@3.5.40_typescript@5.9.3/node_modules/vue/dist/vue").DefineComponent<import("/repo/node_modules/.pnpm/vue@3.5.40_typescript@5.9.3/node_modules/vue/dist/vue").ExtractPropTypes<{ file: { type: PropType<ByteSourceInput | undefined>; default: undefined; }; options: { type: PropType<ViewerOptions>; default: () => {}; }; }>, () => import("/repo/node_modules/.pnpm/vue@3.5.40_typescript@5.9.3/node_modules/vue/dist/vue").VNode<import("/repo/node_modules/.pnpm/vue@3.5.40_typescript@5.9.3/node_modules/vue/dist/vue").RendererNode, import("/repo/node_modules/.pnpm/vue@3.5.40_typescript@5.9.3/node_modules/vue/dist/vue").RendererElement, { [key: string]: any; }>, {}, {}, {}, import("/repo/node_modules/.pnpm/vue@3.5.40_typescript@5.9.3/node_modules/vue/dist/vue").ComponentOptionsMixin, import("/repo/node_modules/.pnpm/vue@3.5.40_typescript@5.9.3/node_modules/vue/dist/vue").ComponentOptionsMixin, { stateChange: (_state: ViewerState) => true; }, string, import("/repo/node_modules/.pnpm/vue@3.5.40_typescript@5.9.3/node_modules/vue/dist/vue").PublicProps, Readonly<import("/repo/node_modules/.pnpm/vue@3.5.40_typescript@5.9.3/node_modules/vue/dist/vue").ExtractPropTypes<{ file: { type: PropType<ByteSourceInput | undefined>; default: undefined; }; options: { type: PropType<ViewerOptions>; default: () => {}; }; }>> & Readonly<{ onStateChange?: ((_state: ViewerState) => any) | undefined; }>, { file: ByteSourceInput | undefined; options: ViewerOptions; }, {}, {}, {}, string, import("/repo/node_modules/.pnpm/vue@3.5.40_typescript@5.9.3/node_modules/vue/dist/vue").ComponentProvideOptions, true, {}, any>

A document viewer component for Vue 3. Written with a render function rather than as a single-file component: the package is built with the monorepo's shared toolchain, and this avoids adding a separate SFC compilation step for what amounts to one container element.