@prose-reader/core 1.57.0 → 1.59.0

package/dist/index.d.ts

@@ -1,4263 +1,10 @@
-import { BehaviorSubject } from 'rxjs';
-import { Manifest } from '@prose-reader/shared';
-import { Observable } from 'rxjs';
-import { Subject } from 'rxjs';
-
-declare type Api = {
-    zoom: {
-        enter: (imgElement?: HTMLImageElement) => void;
-        exit: () => void;
-        move: (position: {
-            x: number;
-            y: number;
-        } | undefined, details: {
-            isFirst: boolean;
-            isLast: boolean;
-        }) => void;
-        isZooming: () => boolean;
-        isUsingScrollableZoom: () => boolean;
-        getScaleValue: () => number;
-        scale: (scale: number) => void;
-        setCurrentScaleAsBase: () => void;
-        $: {
-            isZooming$: Observable<boolean>;
-        };
-    };
-};
-
-declare type CfiLocator = ReturnType<typeof createCfiLocator>;
-
-declare type ChapterInfo = {
-    title: string;
-    subChapter?: {
-        title: string;
-        subChapter?: {
-            title: string;
-            subChapter?: {
-                title: string;
-                path: string;
-            };
-            path: string;
-        };
-        path: string;
-    };
-    path: string;
-};
-
-declare type ComputedSettings = Settings & {
-    computedPageTurnMode: Settings[`pageTurnMode`];
-    computedPageTurnDirection: Settings[`pageTurnDirection`];
-    computedPageTurnAnimation: Settings[`pageTurnAnimation`];
-    computedPageTurnAnimationDuration: number;
-    computedSnapAnimationDuration: number;
-};
-
-declare class Context {
-    _stateSubject: BehaviorSubject<State>;
-    destroy$: Subject<void>;
-    state$: Observable<Partial<Pick<LoadOptions, "containerElement">> & {
-    manifest?: Manifest | undefined;
-    hasVerticalWriting?: boolean | undefined;
-    isUsingSpreadMode?: boolean | undefined;
-    isFullyPrePaginated?: boolean | undefined;
-    forceSinglePageMode?: boolean | undefined;
-    areAllItemsPrePaginated?: boolean | undefined;
-    calculatedInnerMargin: number;
-    marginTop: number;
-    marginBottom: number;
-    visibleAreaRect: {
-    width: number;
-    height: number;
-    x: number;
-    y: number;
-    };
-    }>;
-    manifest$: Observable<Manifest>;
-    containerElement$: Observable<HTMLElement>;
-    hasVerticalWriting$: Observable<boolean>;
-    isUsingSpreadMode$: Observable<boolean | undefined>;
-    update(newState: {
-        manifest?: Manifest;
-        forceSinglePageMode?: boolean;
-        visibleAreaRect?: State["visibleAreaRect"];
-        marginTop?: number;
-        marginBottom?: number;
-        hasVerticalWriting?: boolean;
-    }): void;
-    isRTL: () => boolean;
-    get state(): State;
-    get manifest(): Manifest | undefined;
-    get readingDirection(): "ltr" | "rtl" | undefined;
-    getPageSize(): {
-        width: number;
-        height: number;
-    };
-    destroy: () => void;
-}
-
-declare type ContextSettings = Partial<Settings>;
-
-declare const createCfiLocator: ({ spineItemManager, spineItemLocator, }: {
-    spineItemManager: SpineItemManager;
-    context: Context;
-    spineItemLocator: ReturnType<typeof createLocationResolver_2>;
-}) => {
-    getSpineItemFromCfi: (cfi: string) => {
-        layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-            blankPagePosition: "after" | "before" | "none";
-            minimumWidth: number;
-            spreadPosition: "none" | "right" | "left";
-        }) => {
-            width: number;
-            height: number;
-        };
-        item: {
-            id: string;
-            href: string;
-            renditionLayout: "reflowable" | "pre-paginated";
-            progressionWeight: number;
-            pageSpreadLeft: true | undefined;
-            pageSpreadRight: true | undefined;
-            mediaType?: string | undefined;
-        };
-        load: () => void;
-        adjustPositionOfElement: ({ right, left, top }: {
-            right?: number | undefined;
-            left?: number | undefined;
-            top?: number | undefined;
-        }) => void;
-        getElementDimensions: () => {
-            width: number;
-            height: number;
-        };
-        getHtmlFromResource: (response: Response) => Promise<string>;
-        getResource: () => Promise<Response>;
-        translateFramePositionIntoPage: (position: {
-            clientX: number;
-            clientY: number;
-        }) => {
-            clientX: number;
-            clientY: number;
-        };
-        setLayoutDirty: () => void;
-        injectStyle: (cssText: string) => void;
-        loadContent: () => void;
-        unloadContent: () => void;
-        spineItemFrame: {
-            getIsLoaded: () => boolean;
-            getIsReady: () => boolean;
-            getViewportDimensions: () => {
-                width: number;
-                height: number;
-            } | undefined;
-            getFrameElement: () => HTMLIFrameElement | undefined;
-            getHtmlFromResource: (response: Response) => Promise<string>;
-            load: () => void;
-            unload: () => void;
-            staticLayout: (size: {
-                width: number;
-                height: number;
-            }) => void;
-            getManipulableFrame: () => {
-                frame: HTMLIFrameElement;
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: string, prepend?: boolean) => void;
-            } | undefined;
-            getReadingDirection: () => "ltr" | "rtl" | undefined;
-            isUsingVerticalWriting: () => boolean;
-            getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-            destroy: () => void;
-            $: {
-                unload$: Observable<void>;
-                unloaded$: Observable<void>;
-                loaded$: Observable<HTMLIFrameElement>;
-                ready$: Observable<FontFaceSet | undefined>;
-                isReady$: Observable<boolean>;
-                contentLayoutChange$: Observable<    {
-                isFirstLayout: boolean;
-                } | {
-                isFirstLayout: boolean;
-                }>;
-            };
-        };
-        element: HTMLElement;
-        getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-        getViewPortInformation: () => {
-            computedScale: number;
-            computedWidthScale: number;
-            viewportDimensions: {
-                width: number;
-                height: number;
-            };
-        } | undefined;
-        isImageType: () => boolean;
-        isReady: () => boolean;
-        destroy: () => void;
-        isUsingVerticalWriting: () => boolean | undefined;
-        getReadingDirection: () => "ltr" | "rtl" | undefined;
-        manipulateSpineItem: (cb: (options: {
-            container: HTMLElement;
-            item: {
-                id: string;
-                href: string;
-                renditionLayout: "reflowable" | "pre-paginated";
-                progressionWeight: number;
-                pageSpreadLeft: true | undefined;
-                pageSpreadRight: true | undefined;
-                mediaType?: string | undefined;
-            };
-            overlayElement: HTMLDivElement;
-        } & ({
-            frame: HTMLIFrameElement;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string, prepend?: boolean) => void;
-        } | {
-            frame: undefined;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string) => void;
-        })) => boolean) => boolean;
-        executeOnLayoutBeforeMeasurementHook: (options: {
-            minimumWidth: number;
-        }) => Observable<[void | Observable<void>]>;
-        selectionTracker: {
-            track: (frameToTrack: HTMLIFrameElement) => void;
-            destroy: () => void;
-            isSelecting: () => boolean;
-            getSelection: () => Selection | undefined;
-            $: Observable<    {
-            event: "selectionchange";
-            data: Selection | null;
-            } | {
-            event: "selectstart";
-            data: Selection | null;
-            } | {
-            event: "selectend";
-            data: Selection | null;
-            }>;
-        };
-        fingerTracker: {
-            track: (frame: HTMLIFrameElement) => void;
-            getFingerPositionInIframe(): {
-                x: number | undefined;
-                y: number | undefined;
-            } | undefined;
-            destroy: () => void;
-            $: Observable<    {
-            event: "fingermove";
-            data: {
-            x: number;
-            y: number;
-            };
-            } | {
-            event: "fingerout";
-            data: undefined;
-            }>;
-        };
-        getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-            columnHeight: number;
-            columnWidth: number;
-            width: number;
-        };
-        getDimensionsForPaginatedContent: () => {
-            columnHeight: number;
-            columnWidth: number;
-        };
-        $: {
-            contentLayout$: Observable<    {
-            isFirstLayout: boolean;
-            isReady: boolean;
-            }>;
-            loaded$: Observable<HTMLIFrameElement>;
-            isReady$: Observable<boolean>;
-        };
-    } | undefined;
-    getCfiMetaInformation: (cfi: string) => {
-        spineItemIndex: number | undefined;
-    } | undefined;
-    getCfi: ((pageIndex: number, spineItem: SpineItem) => string) | ((pageIndex: number, spineItem: {
-        layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-            blankPagePosition: "after" | "before" | "none";
-            minimumWidth: number;
-            spreadPosition: "none" | "right" | "left";
-        }) => {
-            width: number;
-            height: number;
-        };
-        item: {
-            id: string;
-            href: string;
-            renditionLayout: "reflowable" | "pre-paginated";
-            progressionWeight: number;
-            pageSpreadLeft: true | undefined;
-            pageSpreadRight: true | undefined;
-            mediaType?: string | undefined;
-        };
-        load: () => void;
-        adjustPositionOfElement: ({ right, left, top }: {
-            right?: number | undefined;
-            left?: number | undefined;
-            top?: number | undefined;
-        }) => void;
-        getElementDimensions: () => {
-            width: number;
-            height: number;
-        };
-        getHtmlFromResource: (response: Response) => Promise<string>;
-        getResource: () => Promise<Response>;
-        translateFramePositionIntoPage: (position: {
-            clientX: number;
-            clientY: number;
-        }) => {
-            clientX: number;
-            clientY: number;
-        };
-        setLayoutDirty: () => void;
-        injectStyle: (cssText: string) => void;
-        loadContent: () => void;
-        unloadContent: () => void;
-        spineItemFrame: {
-            getIsLoaded: () => boolean;
-            getIsReady: () => boolean;
-            getViewportDimensions: () => {
-                width: number;
-                height: number;
-            } | undefined;
-            getFrameElement: () => HTMLIFrameElement | undefined;
-            getHtmlFromResource: (response: Response) => Promise<string>;
-            load: () => void;
-            unload: () => void;
-            staticLayout: (size: {
-                width: number;
-                height: number;
-            }) => void;
-            getManipulableFrame: () => {
-                frame: HTMLIFrameElement;
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: string, prepend?: boolean) => void;
-            } | undefined;
-            getReadingDirection: () => "ltr" | "rtl" | undefined;
-            isUsingVerticalWriting: () => boolean;
-            getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-            destroy: () => void;
-            $: {
-                unload$: Observable<void>;
-                unloaded$: Observable<void>;
-                loaded$: Observable<HTMLIFrameElement>;
-                ready$: Observable<FontFaceSet | undefined>;
-                isReady$: Observable<boolean>;
-                contentLayoutChange$: Observable<    {
-                isFirstLayout: boolean;
-                } | {
-                isFirstLayout: boolean;
-                }>;
-            };
-        };
-        element: HTMLElement;
-        getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-        getViewPortInformation: () => {
-            computedScale: number;
-            computedWidthScale: number;
-            viewportDimensions: {
-                width: number;
-                height: number;
-            };
-        } | undefined;
-        isImageType: () => boolean;
-        isReady: () => boolean;
-        destroy: () => void;
-        isUsingVerticalWriting: () => boolean | undefined;
-        getReadingDirection: () => "ltr" | "rtl" | undefined;
-        manipulateSpineItem: (cb: (options: {
-            container: HTMLElement;
-            item: {
-                id: string;
-                href: string;
-                renditionLayout: "reflowable" | "pre-paginated";
-                progressionWeight: number;
-                pageSpreadLeft: true | undefined;
-                pageSpreadRight: true | undefined;
-                mediaType?: string | undefined;
-            };
-            overlayElement: HTMLDivElement;
-        } & ({
-            frame: HTMLIFrameElement;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string, prepend?: boolean) => void;
-        } | {
-            frame: undefined;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string) => void;
-        })) => boolean) => boolean;
-        executeOnLayoutBeforeMeasurementHook: (options: {
-            minimumWidth: number;
-        }) => Observable<[void | Observable<void>]>;
-        selectionTracker: {
-            track: (frameToTrack: HTMLIFrameElement) => void;
-            destroy: () => void;
-            isSelecting: () => boolean;
-            getSelection: () => Selection | undefined;
-            $: Observable<    {
-            event: "selectionchange";
-            data: Selection | null;
-            } | {
-            event: "selectstart";
-            data: Selection | null;
-            } | {
-            event: "selectend";
-            data: Selection | null;
-            }>;
-        };
-        fingerTracker: {
-            track: (frame: HTMLIFrameElement) => void;
-            getFingerPositionInIframe(): {
-                x: number | undefined;
-                y: number | undefined;
-            } | undefined;
-            destroy: () => void;
-            $: Observable<    {
-            event: "fingermove";
-            data: {
-            x: number;
-            y: number;
-            };
-            } | {
-            event: "fingerout";
-            data: undefined;
-            }>;
-        };
-        getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-            columnHeight: number;
-            columnWidth: number;
-            width: number;
-        };
-        getDimensionsForPaginatedContent: () => {
-            columnHeight: number;
-            columnWidth: number;
-        };
-        $: {
-            contentLayout$: Observable<    {
-            isFirstLayout: boolean;
-            isReady: boolean;
-            }>;
-            loaded$: Observable<HTMLIFrameElement>;
-            isReady$: Observable<boolean>;
-        };
-    }) => string);
-    getRootCfi: (spineItem: SpineItem) => string;
-    resolveCfi: (cfiString: string) => {
-        node: Node | undefined;
-        offset: number | undefined;
-        spineItemIndex: number;
-    } | {
-        spineItemIndex: number;
-        node?: undefined;
-        offset?: undefined;
-    } | undefined;
-    generateFromRange: ({ startNode, start, end, endNode }: {
-        startNode: Node;
-        start: number;
-        endNode: Node;
-        end: number;
-    }, item: Manifest[`spineItems`][number]) => {
-        start: string;
-        end: string;
-    };
-};
-
-declare const createLocationResolver: ({ spineItemManager, context, spineItemLocator, settings }: {
-    spineItemManager: SpineItemManager;
-    context: Context;
-    spineItemLocator: ReturnType<typeof createLocationResolver_2>;
-    settings: SettingsManager;
-}) => {
-    getSpinePositionFromSpineItemPosition: (spineItemPosition: SpineItemNavigationPosition | SpineItemPosition, spineItem: SpineItem) => SpinePosition;
-    getSpinePositionFromSpineItem: (spineItem: SpineItem) => SpinePosition;
-    getSpinePositionFromSpineItemAnchor: (anchor: string, spineItem: SpineItem) => SpinePosition;
-    getSpineItemPositionFromSpinePosition: ((position: UnsafeSpinePosition, spineItem: SpineItem) => UnsafeSpineItemPosition) | ((position: UnsafeSpinePosition, spineItem: {
-        layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-            blankPagePosition: "after" | "before" | "none";
-            minimumWidth: number;
-            spreadPosition: "none" | "right" | "left";
-        }) => {
-            width: number;
-            height: number;
-        };
-        item: {
-            id: string;
-            href: string;
-            renditionLayout: "reflowable" | "pre-paginated";
-            progressionWeight: number;
-            pageSpreadLeft: true | undefined;
-            pageSpreadRight: true | undefined;
-            mediaType?: string | undefined;
-        };
-        load: () => void;
-        adjustPositionOfElement: ({ right, left, top }: {
-            right?: number | undefined;
-            left?: number | undefined;
-            top?: number | undefined;
-        }) => void;
-        getElementDimensions: () => {
-            width: number;
-            height: number;
-        };
-        getHtmlFromResource: (response: Response) => Promise<string>;
-        getResource: () => Promise<Response>;
-        translateFramePositionIntoPage: (position: {
-            clientX: number;
-            clientY: number;
-        }) => {
-            clientX: number;
-            clientY: number;
-        };
-        setLayoutDirty: () => void;
-        injectStyle: (cssText: string) => void;
-        loadContent: () => void;
-        unloadContent: () => void;
-        spineItemFrame: {
-            getIsLoaded: () => boolean;
-            getIsReady: () => boolean;
-            getViewportDimensions: () => {
-                width: number;
-                height: number;
-            } | undefined;
-            getFrameElement: () => HTMLIFrameElement | undefined;
-            getHtmlFromResource: (response: Response) => Promise<string>;
-            load: () => void;
-            unload: () => void;
-            staticLayout: (size: {
-                width: number;
-                height: number;
-            }) => void;
-            getManipulableFrame: () => {
-                frame: HTMLIFrameElement;
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: string, prepend?: boolean) => void;
-            } | undefined;
-            getReadingDirection: () => "ltr" | "rtl" | undefined;
-            isUsingVerticalWriting: () => boolean;
-            getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-            destroy: () => void;
-            $: {
-                unload$: Observable<void>;
-                unloaded$: Observable<void>;
-                loaded$: Observable<HTMLIFrameElement>;
-                ready$: Observable<FontFaceSet | undefined>;
-                isReady$: Observable<boolean>;
-                contentLayoutChange$: Observable<    {
-                isFirstLayout: boolean;
-                } | {
-                isFirstLayout: boolean;
-                }>;
-            };
-        };
-        element: HTMLElement;
-        getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-        getViewPortInformation: () => {
-            computedScale: number;
-            computedWidthScale: number;
-            viewportDimensions: {
-                width: number;
-                height: number;
-            };
-        } | undefined;
-        isImageType: () => boolean;
-        isReady: () => boolean;
-        destroy: () => void;
-        isUsingVerticalWriting: () => boolean | undefined;
-        getReadingDirection: () => "ltr" | "rtl" | undefined;
-        manipulateSpineItem: (cb: (options: {
-            container: HTMLElement;
-            item: {
-                id: string;
-                href: string;
-                renditionLayout: "reflowable" | "pre-paginated";
-                progressionWeight: number;
-                pageSpreadLeft: true | undefined;
-                pageSpreadRight: true | undefined;
-                mediaType?: string | undefined;
-            };
-            overlayElement: HTMLDivElement;
-        } & ({
-            frame: HTMLIFrameElement;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string, prepend?: boolean) => void;
-        } | {
-            frame: undefined;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string) => void;
-        })) => boolean) => boolean;
-        executeOnLayoutBeforeMeasurementHook: (options: {
-            minimumWidth: number;
-        }) => Observable<[void | Observable<void>]>;
-        selectionTracker: {
-            track: (frameToTrack: HTMLIFrameElement) => void;
-            destroy: () => void;
-            isSelecting: () => boolean;
-            getSelection: () => Selection | undefined;
-            $: Observable<    {
-            event: "selectionchange";
-            data: Selection | null;
-            } | {
-            event: "selectstart";
-            data: Selection | null;
-            } | {
-            event: "selectend";
-            data: Selection | null;
-            }>;
-        };
-        fingerTracker: {
-            track: (frame: HTMLIFrameElement) => void;
-            getFingerPositionInIframe(): {
-                x: number | undefined;
-                y: number | undefined;
-            } | undefined;
-            destroy: () => void;
-            $: Observable<    {
-            event: "fingermove";
-            data: {
-            x: number;
-            y: number;
-            };
-            } | {
-            event: "fingerout";
-            data: undefined;
-            }>;
-        };
-        getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-            columnHeight: number;
-            columnWidth: number;
-            width: number;
-        };
-        getDimensionsForPaginatedContent: () => {
-            columnHeight: number;
-            columnWidth: number;
-        };
-        $: {
-            contentLayout$: Observable<    {
-            isFirstLayout: boolean;
-            isReady: boolean;
-            }>;
-            loaded$: Observable<HTMLIFrameElement>;
-            isReady$: Observable<boolean>;
-        };
-    }) => UnsafeSpineItemPosition);
-    getSpineItemFromPosition: ((position: UnsafeSpinePosition) => {
-        layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-            blankPagePosition: "after" | "before" | "none";
-            minimumWidth: number;
-            spreadPosition: "none" | "right" | "left";
-        }) => {
-            width: number;
-            height: number;
-        };
-        item: {
-            id: string;
-            href: string;
-            renditionLayout: "reflowable" | "pre-paginated";
-            progressionWeight: number;
-            pageSpreadLeft: true | undefined;
-            pageSpreadRight: true | undefined;
-            mediaType?: string | undefined;
-        };
-        load: () => void;
-        adjustPositionOfElement: ({ right, left, top }: {
-            right?: number | undefined;
-            left?: number | undefined;
-            top?: number | undefined;
-        }) => void;
-        getElementDimensions: () => {
-            width: number;
-            height: number;
-        };
-        getHtmlFromResource: (response: Response) => Promise<string>;
-        getResource: () => Promise<Response>;
-        translateFramePositionIntoPage: (position: {
-            clientX: number;
-            clientY: number;
-        }) => {
-            clientX: number;
-            clientY: number;
-        };
-        setLayoutDirty: () => void;
-        injectStyle: (cssText: string) => void;
-        loadContent: () => void;
-        unloadContent: () => void;
-        spineItemFrame: {
-            getIsLoaded: () => boolean;
-            getIsReady: () => boolean;
-            getViewportDimensions: () => {
-                width: number;
-                height: number;
-            } | undefined;
-            getFrameElement: () => HTMLIFrameElement | undefined;
-            getHtmlFromResource: (response: Response) => Promise<string>;
-            load: () => void;
-            unload: () => void;
-            staticLayout: (size: {
-                width: number;
-                height: number;
-            }) => void;
-            getManipulableFrame: () => {
-                frame: HTMLIFrameElement;
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: string, prepend?: boolean) => void;
-            } | undefined;
-            getReadingDirection: () => "ltr" | "rtl" | undefined;
-            isUsingVerticalWriting: () => boolean;
-            getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-            destroy: () => void;
-            $: {
-                unload$: Observable<void>;
-                unloaded$: Observable<void>;
-                loaded$: Observable<HTMLIFrameElement>;
-                ready$: Observable<FontFaceSet | undefined>;
-                isReady$: Observable<boolean>;
-                contentLayoutChange$: Observable<    {
-                isFirstLayout: boolean;
-                } | {
-                isFirstLayout: boolean;
-                }>;
-            };
-        };
-        element: HTMLElement;
-        getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-        getViewPortInformation: () => {
-            computedScale: number;
-            computedWidthScale: number;
-            viewportDimensions: {
-                width: number;
-                height: number;
-            };
-        } | undefined;
-        isImageType: () => boolean;
-        isReady: () => boolean;
-        destroy: () => void;
-        isUsingVerticalWriting: () => boolean | undefined;
-        getReadingDirection: () => "ltr" | "rtl" | undefined;
-        manipulateSpineItem: (cb: (options: {
-            container: HTMLElement;
-            item: {
-                id: string;
-                href: string;
-                renditionLayout: "reflowable" | "pre-paginated";
-                progressionWeight: number;
-                pageSpreadLeft: true | undefined;
-                pageSpreadRight: true | undefined;
-                mediaType?: string | undefined;
-            };
-            overlayElement: HTMLDivElement;
-        } & ({
-            frame: HTMLIFrameElement;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string, prepend?: boolean) => void;
-        } | {
-            frame: undefined;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string) => void;
-        })) => boolean) => boolean;
-        executeOnLayoutBeforeMeasurementHook: (options: {
-            minimumWidth: number;
-        }) => Observable<[void | Observable<void>]>;
-        selectionTracker: {
-            track: (frameToTrack: HTMLIFrameElement) => void;
-            destroy: () => void;
-            isSelecting: () => boolean;
-            getSelection: () => Selection | undefined;
-            $: Observable<    {
-            event: "selectionchange";
-            data: Selection | null;
-            } | {
-            event: "selectstart";
-            data: Selection | null;
-            } | {
-            event: "selectend";
-            data: Selection | null;
-            }>;
-        };
-        fingerTracker: {
-            track: (frame: HTMLIFrameElement) => void;
-            getFingerPositionInIframe(): {
-                x: number | undefined;
-                y: number | undefined;
-            } | undefined;
-            destroy: () => void;
-            $: Observable<    {
-            event: "fingermove";
-            data: {
-            x: number;
-            y: number;
-            };
-            } | {
-            event: "fingerout";
-            data: undefined;
-            }>;
-        };
-        getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-            columnHeight: number;
-            columnWidth: number;
-            width: number;
-        };
-        getDimensionsForPaginatedContent: () => {
-            columnHeight: number;
-            columnWidth: number;
-        };
-        $: {
-            contentLayout$: Observable<    {
-            isFirstLayout: boolean;
-            isReady: boolean;
-            }>;
-            loaded$: Observable<HTMLIFrameElement>;
-            isReady$: Observable<boolean>;
-        };
-    } | undefined) | ((position: UnsafeSpinePosition) => {
-        layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-            blankPagePosition: "after" | "before" | "none";
-            minimumWidth: number;
-            spreadPosition: "none" | "right" | "left";
-        }) => {
-            width: number;
-            height: number;
-        };
-        item: {
-            id: string;
-            href: string;
-            renditionLayout: "reflowable" | "pre-paginated";
-            progressionWeight: number;
-            pageSpreadLeft: true | undefined;
-            pageSpreadRight: true | undefined;
-            mediaType?: string | undefined;
-        };
-        load: () => void;
-        adjustPositionOfElement: ({ right, left, top }: {
-            right?: number | undefined;
-            left?: number | undefined;
-            top?: number | undefined;
-        }) => void;
-        getElementDimensions: () => {
-            width: number;
-            height: number;
-        };
-        getHtmlFromResource: (response: Response) => Promise<string>;
-        getResource: () => Promise<Response>;
-        translateFramePositionIntoPage: (position: {
-            clientX: number;
-            clientY: number;
-        }) => {
-            clientX: number;
-            clientY: number;
-        };
-        setLayoutDirty: () => void;
-        injectStyle: (cssText: string) => void;
-        loadContent: () => void;
-        unloadContent: () => void;
-        spineItemFrame: {
-            getIsLoaded: () => boolean;
-            getIsReady: () => boolean;
-            getViewportDimensions: () => {
-                width: number;
-                height: number;
-            } | undefined;
-            getFrameElement: () => HTMLIFrameElement | undefined;
-            getHtmlFromResource: (response: Response) => Promise<string>;
-            load: () => void;
-            unload: () => void;
-            staticLayout: (size: {
-                width: number;
-                height: number;
-            }) => void;
-            getManipulableFrame: () => {
-                frame: HTMLIFrameElement;
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: string, prepend?: boolean) => void;
-            } | undefined;
-            getReadingDirection: () => "ltr" | "rtl" | undefined;
-            isUsingVerticalWriting: () => boolean;
-            getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-            destroy: () => void;
-            $: {
-                unload$: Observable<void>;
-                unloaded$: Observable<void>;
-                loaded$: Observable<HTMLIFrameElement>;
-                ready$: Observable<FontFaceSet | undefined>;
-                isReady$: Observable<boolean>;
-                contentLayoutChange$: Observable<    {
-                isFirstLayout: boolean;
-                } | {
-                isFirstLayout: boolean;
-                }>;
-            };
-        };
-        element: HTMLElement;
-        getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-        getViewPortInformation: () => {
-            computedScale: number;
-            computedWidthScale: number;
-            viewportDimensions: {
-                width: number;
-                height: number;
-            };
-        } | undefined;
-        isImageType: () => boolean;
-        isReady: () => boolean;
-        destroy: () => void;
-        isUsingVerticalWriting: () => boolean | undefined;
-        getReadingDirection: () => "ltr" | "rtl" | undefined;
-        manipulateSpineItem: (cb: (options: {
-            container: HTMLElement;
-            item: {
-                id: string;
-                href: string;
-                renditionLayout: "reflowable" | "pre-paginated";
-                progressionWeight: number;
-                pageSpreadLeft: true | undefined;
-                pageSpreadRight: true | undefined;
-                mediaType?: string | undefined;
-            };
-            overlayElement: HTMLDivElement;
-        } & ({
-            frame: HTMLIFrameElement;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string, prepend?: boolean) => void;
-        } | {
-            frame: undefined;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string) => void;
-        })) => boolean) => boolean;
-        executeOnLayoutBeforeMeasurementHook: (options: {
-            minimumWidth: number;
-        }) => Observable<[void | Observable<void>]>;
-        selectionTracker: {
-            track: (frameToTrack: HTMLIFrameElement) => void;
-            destroy: () => void;
-            isSelecting: () => boolean;
-            getSelection: () => Selection | undefined;
-            $: Observable<    {
-            event: "selectionchange";
-            data: Selection | null;
-            } | {
-            event: "selectstart";
-            data: Selection | null;
-            } | {
-            event: "selectend";
-            data: Selection | null;
-            }>;
-        };
-        fingerTracker: {
-            track: (frame: HTMLIFrameElement) => void;
-            getFingerPositionInIframe(): {
-                x: number | undefined;
-                y: number | undefined;
-            } | undefined;
-            destroy: () => void;
-            $: Observable<    {
-            event: "fingermove";
-            data: {
-            x: number;
-            y: number;
-            };
-            } | {
-            event: "fingerout";
-            data: undefined;
-            }>;
-        };
-        getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-            columnHeight: number;
-            columnWidth: number;
-            width: number;
-        };
-        getDimensionsForPaginatedContent: () => {
-            columnHeight: number;
-            columnWidth: number;
-        };
-        $: {
-            contentLayout$: Observable<    {
-            isFirstLayout: boolean;
-            isReady: boolean;
-            }>;
-            loaded$: Observable<HTMLIFrameElement>;
-            isReady$: Observable<boolean>;
-        };
-    } | undefined);
-    getSpineItemFromIframe: (iframe: Element) => {
-        layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-            blankPagePosition: "after" | "before" | "none";
-            minimumWidth: number;
-            spreadPosition: "none" | "right" | "left";
-        }) => {
-            width: number;
-            height: number;
-        };
-        item: {
-            id: string;
-            href: string;
-            renditionLayout: "reflowable" | "pre-paginated";
-            progressionWeight: number;
-            pageSpreadLeft: true | undefined;
-            pageSpreadRight: true | undefined;
-            mediaType?: string | undefined;
-        };
-        load: () => void;
-        adjustPositionOfElement: ({ right, left, top }: {
-            right?: number | undefined;
-            left?: number | undefined;
-            top?: number | undefined;
-        }) => void;
-        getElementDimensions: () => {
-            width: number;
-            height: number;
-        };
-        getHtmlFromResource: (response: Response) => Promise<string>;
-        getResource: () => Promise<Response>;
-        translateFramePositionIntoPage: (position: {
-            clientX: number;
-            clientY: number;
-        }) => {
-            clientX: number;
-            clientY: number;
-        };
-        setLayoutDirty: () => void;
-        injectStyle: (cssText: string) => void;
-        loadContent: () => void;
-        unloadContent: () => void;
-        spineItemFrame: {
-            getIsLoaded: () => boolean;
-            getIsReady: () => boolean;
-            getViewportDimensions: () => {
-                width: number;
-                height: number;
-            } | undefined;
-            getFrameElement: () => HTMLIFrameElement | undefined;
-            getHtmlFromResource: (response: Response) => Promise<string>;
-            load: () => void;
-            unload: () => void;
-            staticLayout: (size: {
-                width: number;
-                height: number;
-            }) => void;
-            getManipulableFrame: () => {
-                frame: HTMLIFrameElement;
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: string, prepend?: boolean) => void;
-            } | undefined;
-            getReadingDirection: () => "ltr" | "rtl" | undefined;
-            isUsingVerticalWriting: () => boolean;
-            getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-            destroy: () => void;
-            $: {
-                unload$: Observable<void>;
-                unloaded$: Observable<void>;
-                loaded$: Observable<HTMLIFrameElement>;
-                ready$: Observable<FontFaceSet | undefined>;
-                isReady$: Observable<boolean>;
-                contentLayoutChange$: Observable<    {
-                isFirstLayout: boolean;
-                } | {
-                isFirstLayout: boolean;
-                }>;
-            };
-        };
-        element: HTMLElement;
-        getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-        getViewPortInformation: () => {
-            computedScale: number;
-            computedWidthScale: number;
-            viewportDimensions: {
-                width: number;
-                height: number;
-            };
-        } | undefined;
-        isImageType: () => boolean;
-        isReady: () => boolean;
-        destroy: () => void;
-        isUsingVerticalWriting: () => boolean | undefined;
-        getReadingDirection: () => "ltr" | "rtl" | undefined;
-        manipulateSpineItem: (cb: (options: {
-            container: HTMLElement;
-            item: {
-                id: string;
-                href: string;
-                renditionLayout: "reflowable" | "pre-paginated";
-                progressionWeight: number;
-                pageSpreadLeft: true | undefined;
-                pageSpreadRight: true | undefined;
-                mediaType?: string | undefined;
-            };
-            overlayElement: HTMLDivElement;
-        } & ({
-            frame: HTMLIFrameElement;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string, prepend?: boolean) => void;
-        } | {
-            frame: undefined;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string) => void;
-        })) => boolean) => boolean;
-        executeOnLayoutBeforeMeasurementHook: (options: {
-            minimumWidth: number;
-        }) => Observable<[void | Observable<void>]>;
-        selectionTracker: {
-            track: (frameToTrack: HTMLIFrameElement) => void;
-            destroy: () => void;
-            isSelecting: () => boolean;
-            getSelection: () => Selection | undefined;
-            $: Observable<    {
-            event: "selectionchange";
-            data: Selection | null;
-            } | {
-            event: "selectstart";
-            data: Selection | null;
-            } | {
-            event: "selectend";
-            data: Selection | null;
-            }>;
-        };
-        fingerTracker: {
-            track: (frame: HTMLIFrameElement) => void;
-            getFingerPositionInIframe(): {
-                x: number | undefined;
-                y: number | undefined;
-            } | undefined;
-            destroy: () => void;
-            $: Observable<    {
-            event: "fingermove";
-            data: {
-            x: number;
-            y: number;
-            };
-            } | {
-            event: "fingerout";
-            data: undefined;
-            }>;
-        };
-        getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-            columnHeight: number;
-            columnWidth: number;
-            width: number;
-        };
-        getDimensionsForPaginatedContent: () => {
-            columnHeight: number;
-            columnWidth: number;
-        };
-        $: {
-            contentLayout$: Observable<    {
-            isFirstLayout: boolean;
-            isReady: boolean;
-            }>;
-            loaded$: Observable<HTMLIFrameElement>;
-            isReady$: Observable<boolean>;
-        };
-    } | undefined;
-    getSpineItemPageIndexFromNode: (node: Node, offset: number | undefined, spineItemOrIndex: SpineItem | number) => number | undefined;
-    getSpineItemsFromReadingOrderPosition: (position: SpinePosition) => {
-        begin: number;
-        beginPosition: SpinePosition;
-        end: number;
-        endPosition: SpinePosition;
-    } | undefined;
-};
-
-declare const createLocationResolver_2: ({ context }: {
-    context: Context;
-}) => {
-    getSpineItemPositionFromNode: (node: Node, offset: number, spineItem: SpineItem) => {
-        x: number;
-        y: number;
-    } | undefined;
-    getSpineItemPositionFromPageIndex: (pageIndex: number, spineItem: SpineItem) => SpineItemPosition;
-    getSpineItemOffsetFromAnchor: (anchor: string, spineItem: SpineItem) => number;
-    getSpineItemPageIndexFromPosition: (position: UnsafeSpineItemPosition, spineItem: SpineItem) => number;
-    getSpineItemPageIndexFromNode: (node: Node, offset: number, spineItem: SpineItem) => number | undefined;
-    getSpineItemClosestPositionFromUnsafePosition: (unsafePosition: UnsafeSpineItemPosition, spineItem: SpineItem) => {
-        x: number;
-        y: number;
-    };
-    getFirstNodeOrRangeAtPage: (pageIndex: number, spineItem: SpineItem) => {
-        node: Node;
-        offset: number;
-    } | undefined;
-};
-
-declare const createPagination: ({ context }: {
-    context: Context;
-    spineItemManager: SpineItemManager;
-}) => {
-    destroy: () => void;
-    updateBeginAndEnd: ((begin: {
-        spineItem: SpineItem;
-        pageIndex: number;
-        cfi: string | undefined;
-        options: {
-            isAtEndOfChapter?: boolean;
-        };
-    } & {
-        spineItemIndex: number;
-    }, end: {
-        spineItem: SpineItem;
-        pageIndex: number;
-        cfi: string | undefined;
-        options: {
-            isAtEndOfChapter?: boolean;
-        };
-    } & {
-        spineItemIndex: number;
-    }) => void) | ((begin: {
-        spineItem: SpineItem;
-        pageIndex: number;
-        cfi: string | undefined;
-        options: {
-            isAtEndOfChapter?: boolean;
-        };
-    } & {
-        spineItemIndex: number;
-    }, end: {
-        spineItem: SpineItem;
-        pageIndex: number;
-        cfi: string | undefined;
-        options: {
-            isAtEndOfChapter?: boolean;
-        };
-    } & {
-        spineItemIndex: number;
-    }) => void);
-    getPaginationInfo: () => PaginationInfo;
-    paginationInfo$: Observable<PaginationInfo>;
-};
-
-export declare const createReader: (options: Partial<Settings> & {
-    theme?: Theme | undefined;
-} & SettingsInput & {
-    layoutAutoResize?: false | "container" | undefined;
-} & {
-    fontScale?: number | undefined;
-    lineHeight?: number | "publisher" | undefined;
-    fontWeight?: 200 | 300 | 100 | 400 | 500 | 600 | 700 | 800 | 900 | "publisher" | undefined;
-    fontJustification?: "center" | "right" | "left" | "justify" | "publisher" | undefined;
-} & {
-    loadingElementCreate?: ((options: {
-        container: HTMLElement;
-        item: {
-            id: string;
-            href: string;
-            renditionLayout: "reflowable" | "pre-paginated";
-            progressionWeight: number;
-            pageSpreadLeft: true | undefined;
-            pageSpreadRight: true | undefined;
-            mediaType?: string | undefined;
-        };
-    }) => HTMLElement) | undefined;
-}) => Omit<Omit<Omit<Omit<ReaderInternal & {
-    events: {
-        normalizeEventForViewport: <E extends MouseEvent | PointerEvent | TouchEvent>(event: E) => E;
-    };
-} & {
-    progression: {
-        getPercentageEstimate: (context: Context, currentSpineIndex: number, numberOfPages: number, pageIndex: number, currentPosition: {
-            x: number;
-            y: number;
-        }, currentItem: {
-            layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-                blankPagePosition: "after" | "before" | "none";
-                minimumWidth: number;
-                spreadPosition: "none" | "right" | "left";
-            }) => {
-                width: number;
-                height: number;
-            };
-            item: {
-                id: string;
-                href: string;
-                renditionLayout: "reflowable" | "pre-paginated";
-                progressionWeight: number;
-                pageSpreadLeft: true | undefined;
-                pageSpreadRight: true | undefined;
-                mediaType?: string | undefined;
-            };
-            load: () => void;
-            adjustPositionOfElement: ({ right, left, top }: {
-                right?: number | undefined;
-                left?: number | undefined;
-                top?: number | undefined;
-            }) => void;
-            getElementDimensions: () => {
-                width: number;
-                height: number;
-            };
-            getHtmlFromResource: (response: Response) => Promise<string>;
-            getResource: () => Promise<Response>;
-            translateFramePositionIntoPage: (position: {
-                clientX: number;
-                clientY: number;
-            }) => {
-                clientX: number;
-                clientY: number;
-            };
-            setLayoutDirty: () => void;
-            injectStyle: (cssText: string) => void;
-            loadContent: () => void;
-            unloadContent: () => void;
-            spineItemFrame: {
-                getIsLoaded: () => boolean;
-                getIsReady: () => boolean;
-                getViewportDimensions: () => {
-                    width: number;
-                    height: number;
-                } | undefined;
-                getFrameElement: () => HTMLIFrameElement | undefined;
-                getHtmlFromResource: (response: Response) => Promise<string>;
-                load: () => void;
-                unload: () => void;
-                staticLayout: (size: {
-                    width: number;
-                    height: number;
-                }) => void;
-                getManipulableFrame: () => {
-                    frame: HTMLIFrameElement;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string, prepend?: boolean) => void;
-                } | undefined;
-                getReadingDirection: () => "ltr" | "rtl" | undefined;
-                isUsingVerticalWriting: () => boolean;
-                getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-                destroy: () => void;
-                $: {
-                    unload$: Observable<void>;
-                    unloaded$: Observable<void>;
-                    loaded$: Observable<HTMLIFrameElement>;
-                    ready$: Observable<FontFaceSet | undefined>;
-                    isReady$: Observable<boolean>;
-                    contentLayoutChange$: Observable<    {
-                    isFirstLayout: boolean;
-                    } | {
-                    isFirstLayout: boolean;
-                    }>;
-                };
-            };
-            element: HTMLElement;
-            getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-            getViewPortInformation: () => {
-                computedScale: number;
-                computedWidthScale: number;
-                viewportDimensions: {
-                    width: number;
-                    height: number;
-                };
-            } | undefined;
-            isImageType: () => boolean;
-            isReady: () => boolean;
-            destroy: () => void;
-            isUsingVerticalWriting: () => boolean | undefined;
-            getReadingDirection: () => "ltr" | "rtl" | undefined;
-            manipulateSpineItem: (cb: (options: {
-                container: HTMLElement;
-                item: {
-                    id: string;
-                    href: string;
-                    renditionLayout: "reflowable" | "pre-paginated";
-                    progressionWeight: number;
-                    pageSpreadLeft: true | undefined;
-                    pageSpreadRight: true | undefined;
-                    mediaType?: string | undefined;
-                };
-                overlayElement: HTMLDivElement;
-            } & ({
-                frame: HTMLIFrameElement;
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: string, prepend?: boolean) => void;
-            } | {
-                frame: undefined;
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: string) => void;
-            })) => boolean) => boolean;
-            executeOnLayoutBeforeMeasurementHook: (options: {
-                minimumWidth: number;
-            }) => Observable<[void | Observable<void>]>;
-            selectionTracker: {
-                track: (frameToTrack: HTMLIFrameElement) => void;
-                destroy: () => void;
-                isSelecting: () => boolean;
-                getSelection: () => Selection | undefined;
-                $: Observable<    {
-                event: "selectionchange";
-                data: Selection | null;
-                } | {
-                event: "selectstart";
-                data: Selection | null;
-                } | {
-                event: "selectend";
-                data: Selection | null;
-                }>;
-            };
-            fingerTracker: {
-                track: (frame: HTMLIFrameElement) => void;
-                getFingerPositionInIframe(): {
-                    x: number | undefined;
-                    y: number | undefined;
-                } | undefined;
-                destroy: () => void;
-                $: Observable<    {
-                event: "fingermove";
-                data: {
-                x: number;
-                y: number;
-                };
-                } | {
-                event: "fingerout";
-                data: undefined;
-                }>;
-            };
-            getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-                columnHeight: number;
-                columnWidth: number;
-                width: number;
-            };
-            getDimensionsForPaginatedContent: () => {
-                columnHeight: number;
-                columnWidth: number;
-            };
-            $: {
-                contentLayout$: Observable<    {
-                isFirstLayout: boolean;
-                isReady: boolean;
-                }>;
-                loaded$: Observable<HTMLIFrameElement>;
-                isReady$: Observable<boolean>;
-            };
-        }) => number;
-        getScrollPercentageWithinItem: (context: Context, currentPosition: {
-            x: number;
-            y: number;
-        }, currentItem: {
-            layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-                blankPagePosition: "after" | "before" | "none";
-                minimumWidth: number;
-                spreadPosition: "none" | "right" | "left";
-            }) => {
-                width: number;
-                height: number;
-            };
-            item: {
-                id: string;
-                href: string;
-                renditionLayout: "reflowable" | "pre-paginated";
-                progressionWeight: number;
-                pageSpreadLeft: true | undefined;
-                pageSpreadRight: true | undefined;
-                mediaType?: string | undefined;
-            };
-            load: () => void;
-            adjustPositionOfElement: ({ right, left, top }: {
-                right?: number | undefined;
-                left?: number | undefined;
-                top?: number | undefined;
-            }) => void;
-            getElementDimensions: () => {
-                width: number;
-                height: number;
-            };
-            getHtmlFromResource: (response: Response) => Promise<string>;
-            getResource: () => Promise<Response>;
-            translateFramePositionIntoPage: (position: {
-                clientX: number;
-                clientY: number;
-            }) => {
-                clientX: number;
-                clientY: number;
-            };
-            setLayoutDirty: () => void;
-            injectStyle: (cssText: string) => void;
-            loadContent: () => void;
-            unloadContent: () => void;
-            spineItemFrame: {
-                getIsLoaded: () => boolean;
-                getIsReady: () => boolean;
-                getViewportDimensions: () => {
-                    width: number;
-                    height: number;
-                } | undefined;
-                getFrameElement: () => HTMLIFrameElement | undefined;
-                getHtmlFromResource: (response: Response) => Promise<string>;
-                load: () => void;
-                unload: () => void;
-                staticLayout: (size: {
-                    width: number;
-                    height: number;
-                }) => void;
-                getManipulableFrame: () => {
-                    frame: HTMLIFrameElement;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string, prepend?: boolean) => void;
-                } | undefined;
-                getReadingDirection: () => "ltr" | "rtl" | undefined;
-                isUsingVerticalWriting: () => boolean;
-                getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-                destroy: () => void;
-                $: {
-                    unload$: Observable<void>;
-                    unloaded$: Observable<void>;
-                    loaded$: Observable<HTMLIFrameElement>;
-                    ready$: Observable<FontFaceSet | undefined>;
-                    isReady$: Observable<boolean>;
-                    contentLayoutChange$: Observable<    {
-                    isFirstLayout: boolean;
-                    } | {
-                    isFirstLayout: boolean;
-                    }>;
-                };
-            };
-            element: HTMLElement;
-            getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-            getViewPortInformation: () => {
-                computedScale: number;
-                computedWidthScale: number;
-                viewportDimensions: {
-                    width: number;
-                    height: number;
-                };
-            } | undefined;
-            isImageType: () => boolean;
-            isReady: () => boolean;
-            destroy: () => void;
-            isUsingVerticalWriting: () => boolean | undefined;
-            getReadingDirection: () => "ltr" | "rtl" | undefined;
-            manipulateSpineItem: (cb: (options: {
-                container: HTMLElement;
-                item: {
-                    id: string;
-                    href: string;
-                    renditionLayout: "reflowable" | "pre-paginated";
-                    progressionWeight: number;
-                    pageSpreadLeft: true | undefined;
-                    pageSpreadRight: true | undefined;
-                    mediaType?: string | undefined;
-                };
-                overlayElement: HTMLDivElement;
-            } & ({
-                frame: HTMLIFrameElement;
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: string, prepend?: boolean) => void;
-            } | {
-                frame: undefined;
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: string) => void;
-            })) => boolean) => boolean;
-            executeOnLayoutBeforeMeasurementHook: (options: {
-                minimumWidth: number;
-            }) => Observable<[void | Observable<void>]>;
-            selectionTracker: {
-                track: (frameToTrack: HTMLIFrameElement) => void;
-                destroy: () => void;
-                isSelecting: () => boolean;
-                getSelection: () => Selection | undefined;
-                $: Observable<    {
-                event: "selectionchange";
-                data: Selection | null;
-                } | {
-                event: "selectstart";
-                data: Selection | null;
-                } | {
-                event: "selectend";
-                data: Selection | null;
-                }>;
-            };
-            fingerTracker: {
-                track: (frame: HTMLIFrameElement) => void;
-                getFingerPositionInIframe(): {
-                    x: number | undefined;
-                    y: number | undefined;
-                } | undefined;
-                destroy: () => void;
-                $: Observable<    {
-                event: "fingermove";
-                data: {
-                x: number;
-                y: number;
-                };
-                } | {
-                event: "fingerout";
-                data: undefined;
-                }>;
-            };
-            getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-                columnHeight: number;
-                columnWidth: number;
-                width: number;
-            };
-            getDimensionsForPaginatedContent: () => {
-                columnHeight: number;
-                columnWidth: number;
-            };
-            $: {
-                contentLayout$: Observable<    {
-                isFirstLayout: boolean;
-                isReady: boolean;
-                }>;
-                loaded$: Observable<HTMLIFrameElement>;
-                isReady$: Observable<boolean>;
-            };
-        }) => number;
-    };
-}, "pagination"> & {
-    pagination: Omit<{
-        destroy: () => void;
-        updateBeginAndEnd: ((begin: {
-            spineItem: {
-                layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-                    blankPagePosition: "after" | "before" | "none";
-                    minimumWidth: number;
-                    spreadPosition: "none" | "right" | "left";
-                }) => {
-                    width: number;
-                    height: number;
-                };
-                item: {
-                    id: string;
-                    href: string;
-                    renditionLayout: "reflowable" | "pre-paginated";
-                    progressionWeight: number;
-                    pageSpreadLeft: true | undefined;
-                    pageSpreadRight: true | undefined;
-                    mediaType?: string | undefined;
-                };
-                load: () => void;
-                adjustPositionOfElement: ({ right, left, top }: {
-                    right?: number | undefined;
-                    left?: number | undefined;
-                    top?: number | undefined;
-                }) => void;
-                getElementDimensions: () => {
-                    width: number;
-                    height: number;
-                };
-                getHtmlFromResource: (response: Response) => Promise<string>;
-                getResource: () => Promise<Response>;
-                translateFramePositionIntoPage: (position: {
-                    clientX: number;
-                    clientY: number;
-                }) => {
-                    clientX: number;
-                    clientY: number;
-                };
-                setLayoutDirty: () => void;
-                injectStyle: (cssText: string) => void;
-                loadContent: () => void;
-                unloadContent: () => void;
-                spineItemFrame: {
-                    getIsLoaded: () => boolean;
-                    getIsReady: () => boolean;
-                    getViewportDimensions: () => {
-                        width: number;
-                        height: number;
-                    } | undefined;
-                    getFrameElement: () => HTMLIFrameElement | undefined;
-                    getHtmlFromResource: (response: Response) => Promise<string>;
-                    load: () => void;
-                    unload: () => void;
-                    staticLayout: (size: {
-                        width: number;
-                        height: number;
-                    }) => void;
-                    getManipulableFrame: () => {
-                        frame: HTMLIFrameElement;
-                        removeStyle: (id: string) => void;
-                        addStyle: (id: string, style: string, prepend?: boolean) => void;
-                    } | undefined;
-                    getReadingDirection: () => "ltr" | "rtl" | undefined;
-                    isUsingVerticalWriting: () => boolean;
-                    getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-                    destroy: () => void;
-                    $: {
-                        unload$: Observable<void>;
-                        unloaded$: Observable<void>;
-                        loaded$: Observable<HTMLIFrameElement>;
-                        ready$: Observable<FontFaceSet | undefined>;
-                        isReady$: Observable<boolean>;
-                        contentLayoutChange$: Observable<    {
-                        isFirstLayout: boolean;
-                        } | {
-                        isFirstLayout: boolean;
-                        }>;
-                    };
-                };
-                element: HTMLElement;
-                getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-                getViewPortInformation: () => {
-                    computedScale: number;
-                    computedWidthScale: number;
-                    viewportDimensions: {
-                        width: number;
-                        height: number;
-                    };
-                } | undefined;
-                isImageType: () => boolean;
-                isReady: () => boolean;
-                destroy: () => void;
-                isUsingVerticalWriting: () => boolean | undefined;
-                getReadingDirection: () => "ltr" | "rtl" | undefined;
-                manipulateSpineItem: (cb: (options: {
-                    container: HTMLElement;
-                    item: {
-                        id: string;
-                        href: string;
-                        renditionLayout: "reflowable" | "pre-paginated";
-                        progressionWeight: number;
-                        pageSpreadLeft: true | undefined;
-                        pageSpreadRight: true | undefined;
-                        mediaType?: string | undefined;
-                    };
-                    overlayElement: HTMLDivElement;
-                } & ({
-                    frame: HTMLIFrameElement;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string, prepend?: boolean) => void;
-                } | {
-                    frame: undefined;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string) => void;
-                })) => boolean) => boolean;
-                executeOnLayoutBeforeMeasurementHook: (options: {
-                    minimumWidth: number;
-                }) => Observable<[void | Observable<void>]>;
-                selectionTracker: {
-                    track: (frameToTrack: HTMLIFrameElement) => void;
-                    destroy: () => void;
-                    isSelecting: () => boolean;
-                    getSelection: () => Selection | undefined;
-                    $: Observable<    {
-                    event: "selectionchange";
-                    data: Selection | null;
-                    } | {
-                    event: "selectstart";
-                    data: Selection | null;
-                    } | {
-                    event: "selectend";
-                    data: Selection | null;
-                    }>;
-                };
-                fingerTracker: {
-                    track: (frame: HTMLIFrameElement) => void;
-                    getFingerPositionInIframe(): {
-                        x: number | undefined;
-                        y: number | undefined;
-                    } | undefined;
-                    destroy: () => void;
-                    $: Observable<    {
-                    event: "fingermove";
-                    data: {
-                    x: number;
-                    y: number;
-                    };
-                    } | {
-                    event: "fingerout";
-                    data: undefined;
-                    }>;
-                };
-                getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-                    columnHeight: number;
-                    columnWidth: number;
-                    width: number;
-                };
-                getDimensionsForPaginatedContent: () => {
-                    columnHeight: number;
-                    columnWidth: number;
-                };
-                $: {
-                    contentLayout$: Observable<    {
-                    isFirstLayout: boolean;
-                    isReady: boolean;
-                    }>;
-                    loaded$: Observable<HTMLIFrameElement>;
-                    isReady$: Observable<boolean>;
-                };
-            };
-            pageIndex: number;
-            cfi: string | undefined;
-            options: {
-                isAtEndOfChapter?: boolean | undefined;
-            };
-        } & {
-            spineItemIndex: number;
-        }, end: {
-            spineItem: {
-                layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-                    blankPagePosition: "after" | "before" | "none";
-                    minimumWidth: number;
-                    spreadPosition: "none" | "right" | "left";
-                }) => {
-                    width: number;
-                    height: number;
-                };
-                item: {
-                    id: string;
-                    href: string;
-                    renditionLayout: "reflowable" | "pre-paginated";
-                    progressionWeight: number;
-                    pageSpreadLeft: true | undefined;
-                    pageSpreadRight: true | undefined;
-                    mediaType?: string | undefined;
-                };
-                load: () => void;
-                adjustPositionOfElement: ({ right, left, top }: {
-                    right?: number | undefined;
-                    left?: number | undefined;
-                    top?: number | undefined;
-                }) => void;
-                getElementDimensions: () => {
-                    width: number;
-                    height: number;
-                };
-                getHtmlFromResource: (response: Response) => Promise<string>;
-                getResource: () => Promise<Response>;
-                translateFramePositionIntoPage: (position: {
-                    clientX: number;
-                    clientY: number;
-                }) => {
-                    clientX: number;
-                    clientY: number;
-                };
-                setLayoutDirty: () => void;
-                injectStyle: (cssText: string) => void;
-                loadContent: () => void;
-                unloadContent: () => void;
-                spineItemFrame: {
-                    getIsLoaded: () => boolean;
-                    getIsReady: () => boolean;
-                    getViewportDimensions: () => {
-                        width: number;
-                        height: number;
-                    } | undefined;
-                    getFrameElement: () => HTMLIFrameElement | undefined;
-                    getHtmlFromResource: (response: Response) => Promise<string>;
-                    load: () => void;
-                    unload: () => void;
-                    staticLayout: (size: {
-                        width: number;
-                        height: number;
-                    }) => void;
-                    getManipulableFrame: () => {
-                        frame: HTMLIFrameElement;
-                        removeStyle: (id: string) => void;
-                        addStyle: (id: string, style: string, prepend?: boolean) => void;
-                    } | undefined;
-                    getReadingDirection: () => "ltr" | "rtl" | undefined;
-                    isUsingVerticalWriting: () => boolean;
-                    getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-                    destroy: () => void;
-                    $: {
-                        unload$: Observable<void>;
-                        unloaded$: Observable<void>;
-                        loaded$: Observable<HTMLIFrameElement>;
-                        ready$: Observable<FontFaceSet | undefined>;
-                        isReady$: Observable<boolean>;
-                        contentLayoutChange$: Observable<    {
-                        isFirstLayout: boolean;
-                        } | {
-                        isFirstLayout: boolean;
-                        }>;
-                    };
-                };
-                element: HTMLElement;
-                getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-                getViewPortInformation: () => {
-                    computedScale: number;
-                    computedWidthScale: number;
-                    viewportDimensions: {
-                        width: number;
-                        height: number;
-                    };
-                } | undefined;
-                isImageType: () => boolean;
-                isReady: () => boolean;
-                destroy: () => void;
-                isUsingVerticalWriting: () => boolean | undefined;
-                getReadingDirection: () => "ltr" | "rtl" | undefined;
-                manipulateSpineItem: (cb: (options: {
-                    container: HTMLElement;
-                    item: {
-                        id: string;
-                        href: string;
-                        renditionLayout: "reflowable" | "pre-paginated";
-                        progressionWeight: number;
-                        pageSpreadLeft: true | undefined;
-                        pageSpreadRight: true | undefined;
-                        mediaType?: string | undefined;
-                    };
-                    overlayElement: HTMLDivElement;
-                } & ({
-                    frame: HTMLIFrameElement;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string, prepend?: boolean) => void;
-                } | {
-                    frame: undefined;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string) => void;
-                })) => boolean) => boolean;
-                executeOnLayoutBeforeMeasurementHook: (options: {
-                    minimumWidth: number;
-                }) => Observable<[void | Observable<void>]>;
-                selectionTracker: {
-                    track: (frameToTrack: HTMLIFrameElement) => void;
-                    destroy: () => void;
-                    isSelecting: () => boolean;
-                    getSelection: () => Selection | undefined;
-                    $: Observable<    {
-                    event: "selectionchange";
-                    data: Selection | null;
-                    } | {
-                    event: "selectstart";
-                    data: Selection | null;
-                    } | {
-                    event: "selectend";
-                    data: Selection | null;
-                    }>;
-                };
-                fingerTracker: {
-                    track: (frame: HTMLIFrameElement) => void;
-                    getFingerPositionInIframe(): {
-                        x: number | undefined;
-                        y: number | undefined;
-                    } | undefined;
-                    destroy: () => void;
-                    $: Observable<    {
-                    event: "fingermove";
-                    data: {
-                    x: number;
-                    y: number;
-                    };
-                    } | {
-                    event: "fingerout";
-                    data: undefined;
-                    }>;
-                };
-                getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-                    columnHeight: number;
-                    columnWidth: number;
-                    width: number;
-                };
-                getDimensionsForPaginatedContent: () => {
-                    columnHeight: number;
-                    columnWidth: number;
-                };
-                $: {
-                    contentLayout$: Observable<    {
-                    isFirstLayout: boolean;
-                    isReady: boolean;
-                    }>;
-                    loaded$: Observable<HTMLIFrameElement>;
-                    isReady$: Observable<boolean>;
-                };
-            };
-            pageIndex: number;
-            cfi: string | undefined;
-            options: {
-                isAtEndOfChapter?: boolean | undefined;
-            };
-        } & {
-            spineItemIndex: number;
-        }) => void) | ((begin: {
-            spineItem: {
-                layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-                    blankPagePosition: "after" | "before" | "none";
-                    minimumWidth: number;
-                    spreadPosition: "none" | "right" | "left";
-                }) => {
-                    width: number;
-                    height: number;
-                };
-                item: {
-                    id: string;
-                    href: string;
-                    renditionLayout: "reflowable" | "pre-paginated";
-                    progressionWeight: number;
-                    pageSpreadLeft: true | undefined;
-                    pageSpreadRight: true | undefined;
-                    mediaType?: string | undefined;
-                };
-                load: () => void;
-                adjustPositionOfElement: ({ right, left, top }: {
-                    right?: number | undefined;
-                    left?: number | undefined;
-                    top?: number | undefined;
-                }) => void;
-                getElementDimensions: () => {
-                    width: number;
-                    height: number;
-                };
-                getHtmlFromResource: (response: Response) => Promise<string>;
-                getResource: () => Promise<Response>;
-                translateFramePositionIntoPage: (position: {
-                    clientX: number;
-                    clientY: number;
-                }) => {
-                    clientX: number;
-                    clientY: number;
-                };
-                setLayoutDirty: () => void;
-                injectStyle: (cssText: string) => void;
-                loadContent: () => void;
-                unloadContent: () => void;
-                spineItemFrame: {
-                    getIsLoaded: () => boolean;
-                    getIsReady: () => boolean;
-                    getViewportDimensions: () => {
-                        width: number;
-                        height: number;
-                    } | undefined;
-                    getFrameElement: () => HTMLIFrameElement | undefined;
-                    getHtmlFromResource: (response: Response) => Promise<string>;
-                    load: () => void;
-                    unload: () => void;
-                    staticLayout: (size: {
-                        width: number;
-                        height: number;
-                    }) => void;
-                    getManipulableFrame: () => {
-                        frame: HTMLIFrameElement;
-                        removeStyle: (id: string) => void;
-                        addStyle: (id: string, style: string, prepend?: boolean) => void;
-                    } | undefined;
-                    getReadingDirection: () => "ltr" | "rtl" | undefined;
-                    isUsingVerticalWriting: () => boolean;
-                    getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-                    destroy: () => void;
-                    $: {
-                        unload$: Observable<void>;
-                        unloaded$: Observable<void>;
-                        loaded$: Observable<HTMLIFrameElement>;
-                        ready$: Observable<FontFaceSet | undefined>;
-                        isReady$: Observable<boolean>;
-                        contentLayoutChange$: Observable<    {
-                        isFirstLayout: boolean;
-                        } | {
-                        isFirstLayout: boolean;
-                        }>;
-                    };
-                };
-                element: HTMLElement;
-                getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-                getViewPortInformation: () => {
-                    computedScale: number;
-                    computedWidthScale: number;
-                    viewportDimensions: {
-                        width: number;
-                        height: number;
-                    };
-                } | undefined;
-                isImageType: () => boolean;
-                isReady: () => boolean;
-                destroy: () => void;
-                isUsingVerticalWriting: () => boolean | undefined;
-                getReadingDirection: () => "ltr" | "rtl" | undefined;
-                manipulateSpineItem: (cb: (options: {
-                    container: HTMLElement;
-                    item: {
-                        id: string;
-                        href: string;
-                        renditionLayout: "reflowable" | "pre-paginated";
-                        progressionWeight: number;
-                        pageSpreadLeft: true | undefined;
-                        pageSpreadRight: true | undefined;
-                        mediaType?: string | undefined;
-                    };
-                    overlayElement: HTMLDivElement;
-                } & ({
-                    frame: HTMLIFrameElement;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string, prepend?: boolean) => void;
-                } | {
-                    frame: undefined;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string) => void;
-                })) => boolean) => boolean;
-                executeOnLayoutBeforeMeasurementHook: (options: {
-                    minimumWidth: number;
-                }) => Observable<[void | Observable<void>]>;
-                selectionTracker: {
-                    track: (frameToTrack: HTMLIFrameElement) => void;
-                    destroy: () => void;
-                    isSelecting: () => boolean;
-                    getSelection: () => Selection | undefined;
-                    $: Observable<    {
-                    event: "selectionchange";
-                    data: Selection | null;
-                    } | {
-                    event: "selectstart";
-                    data: Selection | null;
-                    } | {
-                    event: "selectend";
-                    data: Selection | null;
-                    }>;
-                };
-                fingerTracker: {
-                    track: (frame: HTMLIFrameElement) => void;
-                    getFingerPositionInIframe(): {
-                        x: number | undefined;
-                        y: number | undefined;
-                    } | undefined;
-                    destroy: () => void;
-                    $: Observable<    {
-                    event: "fingermove";
-                    data: {
-                    x: number;
-                    y: number;
-                    };
-                    } | {
-                    event: "fingerout";
-                    data: undefined;
-                    }>;
-                };
-                getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-                    columnHeight: number;
-                    columnWidth: number;
-                    width: number;
-                };
-                getDimensionsForPaginatedContent: () => {
-                    columnHeight: number;
-                    columnWidth: number;
-                };
-                $: {
-                    contentLayout$: Observable<    {
-                    isFirstLayout: boolean;
-                    isReady: boolean;
-                    }>;
-                    loaded$: Observable<HTMLIFrameElement>;
-                    isReady$: Observable<boolean>;
-                };
-            };
-            pageIndex: number;
-            cfi: string | undefined;
-            options: {
-                isAtEndOfChapter?: boolean | undefined;
-            };
-        } & {
-            spineItemIndex: number;
-        }, end: {
-            spineItem: {
-                layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-                    blankPagePosition: "after" | "before" | "none";
-                    minimumWidth: number;
-                    spreadPosition: "none" | "right" | "left";
-                }) => {
-                    width: number;
-                    height: number;
-                };
-                item: {
-                    id: string;
-                    href: string;
-                    renditionLayout: "reflowable" | "pre-paginated";
-                    progressionWeight: number;
-                    pageSpreadLeft: true | undefined;
-                    pageSpreadRight: true | undefined;
-                    mediaType?: string | undefined;
-                };
-                load: () => void;
-                adjustPositionOfElement: ({ right, left, top }: {
-                    right?: number | undefined;
-                    left?: number | undefined;
-                    top?: number | undefined;
-                }) => void;
-                getElementDimensions: () => {
-                    width: number;
-                    height: number;
-                };
-                getHtmlFromResource: (response: Response) => Promise<string>;
-                getResource: () => Promise<Response>;
-                translateFramePositionIntoPage: (position: {
-                    clientX: number;
-                    clientY: number;
-                }) => {
-                    clientX: number;
-                    clientY: number;
-                };
-                setLayoutDirty: () => void;
-                injectStyle: (cssText: string) => void;
-                loadContent: () => void;
-                unloadContent: () => void;
-                spineItemFrame: {
-                    getIsLoaded: () => boolean;
-                    getIsReady: () => boolean;
-                    getViewportDimensions: () => {
-                        width: number;
-                        height: number;
-                    } | undefined;
-                    getFrameElement: () => HTMLIFrameElement | undefined;
-                    getHtmlFromResource: (response: Response) => Promise<string>;
-                    load: () => void;
-                    unload: () => void;
-                    staticLayout: (size: {
-                        width: number;
-                        height: number;
-                    }) => void;
-                    getManipulableFrame: () => {
-                        frame: HTMLIFrameElement;
-                        removeStyle: (id: string) => void;
-                        addStyle: (id: string, style: string, prepend?: boolean) => void;
-                    } | undefined;
-                    getReadingDirection: () => "ltr" | "rtl" | undefined;
-                    isUsingVerticalWriting: () => boolean;
-                    getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-                    destroy: () => void;
-                    $: {
-                        unload$: Observable<void>;
-                        unloaded$: Observable<void>;
-                        loaded$: Observable<HTMLIFrameElement>;
-                        ready$: Observable<FontFaceSet | undefined>;
-                        isReady$: Observable<boolean>;
-                        contentLayoutChange$: Observable<    {
-                        isFirstLayout: boolean;
-                        } | {
-                        isFirstLayout: boolean;
-                        }>;
-                    };
-                };
-                element: HTMLElement;
-                getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-                getViewPortInformation: () => {
-                    computedScale: number;
-                    computedWidthScale: number;
-                    viewportDimensions: {
-                        width: number;
-                        height: number;
-                    };
-                } | undefined;
-                isImageType: () => boolean;
-                isReady: () => boolean;
-                destroy: () => void;
-                isUsingVerticalWriting: () => boolean | undefined;
-                getReadingDirection: () => "ltr" | "rtl" | undefined;
-                manipulateSpineItem: (cb: (options: {
-                    container: HTMLElement;
-                    item: {
-                        id: string;
-                        href: string;
-                        renditionLayout: "reflowable" | "pre-paginated";
-                        progressionWeight: number;
-                        pageSpreadLeft: true | undefined;
-                        pageSpreadRight: true | undefined;
-                        mediaType?: string | undefined;
-                    };
-                    overlayElement: HTMLDivElement;
-                } & ({
-                    frame: HTMLIFrameElement;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string, prepend?: boolean) => void;
-                } | {
-                    frame: undefined;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string) => void;
-                })) => boolean) => boolean;
-                executeOnLayoutBeforeMeasurementHook: (options: {
-                    minimumWidth: number;
-                }) => Observable<[void | Observable<void>]>;
-                selectionTracker: {
-                    track: (frameToTrack: HTMLIFrameElement) => void;
-                    destroy: () => void;
-                    isSelecting: () => boolean;
-                    getSelection: () => Selection | undefined;
-                    $: Observable<    {
-                    event: "selectionchange";
-                    data: Selection | null;
-                    } | {
-                    event: "selectstart";
-                    data: Selection | null;
-                    } | {
-                    event: "selectend";
-                    data: Selection | null;
-                    }>;
-                };
-                fingerTracker: {
-                    track: (frame: HTMLIFrameElement) => void;
-                    getFingerPositionInIframe(): {
-                        x: number | undefined;
-                        y: number | undefined;
-                    } | undefined;
-                    destroy: () => void;
-                    $: Observable<    {
-                    event: "fingermove";
-                    data: {
-                    x: number;
-                    y: number;
-                    };
-                    } | {
-                    event: "fingerout";
-                    data: undefined;
-                    }>;
-                };
-                getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-                    columnHeight: number;
-                    columnWidth: number;
-                    width: number;
-                };
-                getDimensionsForPaginatedContent: () => {
-                    columnHeight: number;
-                    columnWidth: number;
-                };
-                $: {
-                    contentLayout$: Observable<    {
-                    isFirstLayout: boolean;
-                    isReady: boolean;
-                    }>;
-                    loaded$: Observable<HTMLIFrameElement>;
-                    isReady$: Observable<boolean>;
-                };
-            };
-            pageIndex: number;
-            cfi: string | undefined;
-            options: {
-                isAtEndOfChapter?: boolean | undefined;
-            };
-        } & {
-            spineItemIndex: number;
-        }) => void);
-        getPaginationInfo: () => PaginationInfo;
-        paginationInfo$: Observable<PaginationInfo>;
-    }, "paginationInfo$" | "getPaginationInfo"> & {
-        paginationInfo$: Observable<PaginationInfo & ExtraPaginationInfo>;
-        getPaginationInfo: () => PaginationInfo & ExtraPaginationInfo;
-    };
-} & {
-    theme: {
-        set: (theme: Theme) => void;
-        get: () => Theme;
-        $: {
-            theme$: Observable<Theme>;
-        };
-    };
-} & {
-    navigation: {
-        goToNextSpineItem: () => void;
-        goToPreviousSpineItem: () => void;
-        goToLeftSpineItem: () => void;
-        goToRightSpineItem: () => void;
-    } & {
-        state$: Observable<    {
-        canGoTopSpineItem: boolean;
-        canGoBottomSpineItem: boolean;
-        canGoLeftSpineItem: boolean;
-        canGoRightSpineItem: boolean;
-        }>;
-    };
-} & Api, "settings"> & {
-    settings: Omit<SettingsManager, "setSettings" | "settings$"> & {
-        settings$: Observable<Settings & {
-        computedPageTurnMode: "controlled" | "scrollable";
-        computedPageTurnDirection: "vertical" | "horizontal";
-        computedPageTurnAnimation: "none" | "fade" | "slide";
-        computedPageTurnAnimationDuration: number;
-        computedSnapAnimationDuration: number;
-        } & Required<SettingsInput>>;
-        setSettings: (settings: Partial<Settings> & SettingsInput) => void;
-    };
-} & {
-    utils: {
-        isOrIsWithinValidLink: (target: EventTarget | null) => boolean;
-    };
-} & {
-    $: {
-        links$: Observable<    {
-        event: "linkClicked";
-        data: HTMLAnchorElement;
-        isNavigable: boolean;
-        }>;
-    };
-}, "settings"> & {
-    settings: Omit<Omit<SettingsManager, "setSettings" | "settings$"> & {
-        settings$: Observable<Settings & {
-        computedPageTurnMode: "controlled" | "scrollable";
-        computedPageTurnDirection: "vertical" | "horizontal";
-        computedPageTurnAnimation: "none" | "fade" | "slide";
-        computedPageTurnAnimationDuration: number;
-        computedSnapAnimationDuration: number;
-        } & Required<SettingsInput>>;
-        setSettings: (settings: Partial<Settings> & SettingsInput) => void;
-    }, "setSettings" | "settings$"> & {
-        settings$: Observable<Settings & {
-        computedPageTurnMode: "controlled" | "scrollable";
-        computedPageTurnDirection: "vertical" | "horizontal";
-        computedPageTurnAnimation: "none" | "fade" | "slide";
-        computedPageTurnAnimationDuration: number;
-        computedSnapAnimationDuration: number;
-        } & Required<SettingsInput> & Required<{
-        fontScale?: number | undefined;
-        lineHeight?: number | "publisher" | undefined;
-        fontWeight?: 200 | 300 | 100 | 400 | 500 | 600 | 700 | 800 | 900 | "publisher" | undefined;
-        fontJustification?: "center" | "right" | "left" | "justify" | "publisher" | undefined;
-        }>>;
-        setSettings: (settings: Partial<Settings> & SettingsInput & {
-            fontScale?: number | undefined;
-            lineHeight?: number | "publisher" | undefined;
-            fontWeight?: 200 | 300 | 100 | 400 | 500 | 600 | 700 | 800 | 900 | "publisher" | undefined;
-            fontJustification?: "center" | "right" | "left" | "justify" | "publisher" | undefined;
-        }) => void;
-    };
-} & {
-    loading: {
-        $: {
-            items$: Observable<    {
-            [key: string]: HTMLElement;
-            }>;
-        };
-    };
-}, "pagination"> & {
-    pagination: Pick<Omit<{
-        destroy: () => void;
-        updateBeginAndEnd: ((begin: {
-            spineItem: {
-                layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-                    blankPagePosition: "after" | "before" | "none";
-                    minimumWidth: number;
-                    spreadPosition: "none" | "right" | "left";
-                }) => {
-                    width: number;
-                    height: number;
-                };
-                item: {
-                    id: string;
-                    href: string;
-                    renditionLayout: "reflowable" | "pre-paginated";
-                    progressionWeight: number;
-                    pageSpreadLeft: true | undefined;
-                    pageSpreadRight: true | undefined;
-                    mediaType?: string | undefined;
-                };
-                load: () => void;
-                adjustPositionOfElement: ({ right, left, top }: {
-                    right?: number | undefined;
-                    left?: number | undefined;
-                    top?: number | undefined;
-                }) => void;
-                getElementDimensions: () => {
-                    width: number;
-                    height: number;
-                };
-                getHtmlFromResource: (response: Response) => Promise<string>;
-                getResource: () => Promise<Response>;
-                translateFramePositionIntoPage: (position: {
-                    clientX: number;
-                    clientY: number;
-                }) => {
-                    clientX: number;
-                    clientY: number;
-                };
-                setLayoutDirty: () => void;
-                injectStyle: (cssText: string) => void;
-                loadContent: () => void;
-                unloadContent: () => void;
-                spineItemFrame: {
-                    getIsLoaded: () => boolean;
-                    getIsReady: () => boolean;
-                    getViewportDimensions: () => {
-                        width: number;
-                        height: number;
-                    } | undefined;
-                    getFrameElement: () => HTMLIFrameElement | undefined;
-                    getHtmlFromResource: (response: Response) => Promise<string>;
-                    load: () => void;
-                    unload: () => void;
-                    staticLayout: (size: {
-                        width: number;
-                        height: number;
-                    }) => void;
-                    getManipulableFrame: () => {
-                        frame: HTMLIFrameElement;
-                        removeStyle: (id: string) => void;
-                        addStyle: (id: string, style: string, prepend?: boolean) => void;
-                    } | undefined;
-                    getReadingDirection: () => "ltr" | "rtl" | undefined;
-                    isUsingVerticalWriting: () => boolean;
-                    getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-                    destroy: () => void;
-                    $: {
-                        unload$: Observable<void>;
-                        unloaded$: Observable<void>;
-                        loaded$: Observable<HTMLIFrameElement>;
-                        ready$: Observable<FontFaceSet | undefined>;
-                        isReady$: Observable<boolean>;
-                        contentLayoutChange$: Observable<    {
-                        isFirstLayout: boolean;
-                        } | {
-                        isFirstLayout: boolean;
-                        }>;
-                    };
-                };
-                element: HTMLElement;
-                getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-                getViewPortInformation: () => {
-                    computedScale: number;
-                    computedWidthScale: number;
-                    viewportDimensions: {
-                        width: number;
-                        height: number;
-                    };
-                } | undefined;
-                isImageType: () => boolean;
-                isReady: () => boolean;
-                destroy: () => void;
-                isUsingVerticalWriting: () => boolean | undefined;
-                getReadingDirection: () => "ltr" | "rtl" | undefined;
-                manipulateSpineItem: (cb: (options: {
-                    container: HTMLElement;
-                    item: {
-                        id: string;
-                        href: string;
-                        renditionLayout: "reflowable" | "pre-paginated";
-                        progressionWeight: number;
-                        pageSpreadLeft: true | undefined;
-                        pageSpreadRight: true | undefined;
-                        mediaType?: string | undefined;
-                    };
-                    overlayElement: HTMLDivElement;
-                } & ({
-                    frame: HTMLIFrameElement;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string, prepend?: boolean) => void;
-                } | {
-                    frame: undefined;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string) => void;
-                })) => boolean) => boolean;
-                executeOnLayoutBeforeMeasurementHook: (options: {
-                    minimumWidth: number;
-                }) => Observable<[void | Observable<void>]>;
-                selectionTracker: {
-                    track: (frameToTrack: HTMLIFrameElement) => void;
-                    destroy: () => void;
-                    isSelecting: () => boolean;
-                    getSelection: () => Selection | undefined;
-                    $: Observable<    {
-                    event: "selectionchange";
-                    data: Selection | null;
-                    } | {
-                    event: "selectstart";
-                    data: Selection | null;
-                    } | {
-                    event: "selectend";
-                    data: Selection | null;
-                    }>;
-                };
-                fingerTracker: {
-                    track: (frame: HTMLIFrameElement) => void;
-                    getFingerPositionInIframe(): {
-                        x: number | undefined;
-                        y: number | undefined;
-                    } | undefined;
-                    destroy: () => void;
-                    $: Observable<    {
-                    event: "fingermove";
-                    data: {
-                    x: number;
-                    y: number;
-                    };
-                    } | {
-                    event: "fingerout";
-                    data: undefined;
-                    }>;
-                };
-                getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-                    columnHeight: number;
-                    columnWidth: number;
-                    width: number;
-                };
-                getDimensionsForPaginatedContent: () => {
-                    columnHeight: number;
-                    columnWidth: number;
-                };
-                $: {
-                    contentLayout$: Observable<    {
-                    isFirstLayout: boolean;
-                    isReady: boolean;
-                    }>;
-                    loaded$: Observable<HTMLIFrameElement>;
-                    isReady$: Observable<boolean>;
-                };
-            };
-            pageIndex: number;
-            cfi: string | undefined;
-            options: {
-                isAtEndOfChapter?: boolean | undefined;
-            };
-        } & {
-            spineItemIndex: number;
-        }, end: {
-            spineItem: {
-                layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-                    blankPagePosition: "after" | "before" | "none";
-                    minimumWidth: number;
-                    spreadPosition: "none" | "right" | "left";
-                }) => {
-                    width: number;
-                    height: number;
-                };
-                item: {
-                    id: string;
-                    href: string;
-                    renditionLayout: "reflowable" | "pre-paginated";
-                    progressionWeight: number;
-                    pageSpreadLeft: true | undefined;
-                    pageSpreadRight: true | undefined;
-                    mediaType?: string | undefined;
-                };
-                load: () => void;
-                adjustPositionOfElement: ({ right, left, top }: {
-                    right?: number | undefined;
-                    left?: number | undefined;
-                    top?: number | undefined;
-                }) => void;
-                getElementDimensions: () => {
-                    width: number;
-                    height: number;
-                };
-                getHtmlFromResource: (response: Response) => Promise<string>;
-                getResource: () => Promise<Response>;
-                translateFramePositionIntoPage: (position: {
-                    clientX: number;
-                    clientY: number;
-                }) => {
-                    clientX: number;
-                    clientY: number;
-                };
-                setLayoutDirty: () => void;
-                injectStyle: (cssText: string) => void;
-                loadContent: () => void;
-                unloadContent: () => void;
-                spineItemFrame: {
-                    getIsLoaded: () => boolean;
-                    getIsReady: () => boolean;
-                    getViewportDimensions: () => {
-                        width: number;
-                        height: number;
-                    } | undefined;
-                    getFrameElement: () => HTMLIFrameElement | undefined;
-                    getHtmlFromResource: (response: Response) => Promise<string>;
-                    load: () => void;
-                    unload: () => void;
-                    staticLayout: (size: {
-                        width: number;
-                        height: number;
-                    }) => void;
-                    getManipulableFrame: () => {
-                        frame: HTMLIFrameElement;
-                        removeStyle: (id: string) => void;
-                        addStyle: (id: string, style: string, prepend?: boolean) => void;
-                    } | undefined;
-                    getReadingDirection: () => "ltr" | "rtl" | undefined;
-                    isUsingVerticalWriting: () => boolean;
-                    getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-                    destroy: () => void;
-                    $: {
-                        unload$: Observable<void>;
-                        unloaded$: Observable<void>;
-                        loaded$: Observable<HTMLIFrameElement>;
-                        ready$: Observable<FontFaceSet | undefined>;
-                        isReady$: Observable<boolean>;
-                        contentLayoutChange$: Observable<    {
-                        isFirstLayout: boolean;
-                        } | {
-                        isFirstLayout: boolean;
-                        }>;
-                    };
-                };
-                element: HTMLElement;
-                getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-                getViewPortInformation: () => {
-                    computedScale: number;
-                    computedWidthScale: number;
-                    viewportDimensions: {
-                        width: number;
-                        height: number;
-                    };
-                } | undefined;
-                isImageType: () => boolean;
-                isReady: () => boolean;
-                destroy: () => void;
-                isUsingVerticalWriting: () => boolean | undefined;
-                getReadingDirection: () => "ltr" | "rtl" | undefined;
-                manipulateSpineItem: (cb: (options: {
-                    container: HTMLElement;
-                    item: {
-                        id: string;
-                        href: string;
-                        renditionLayout: "reflowable" | "pre-paginated";
-                        progressionWeight: number;
-                        pageSpreadLeft: true | undefined;
-                        pageSpreadRight: true | undefined;
-                        mediaType?: string | undefined;
-                    };
-                    overlayElement: HTMLDivElement;
-                } & ({
-                    frame: HTMLIFrameElement;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string, prepend?: boolean) => void;
-                } | {
-                    frame: undefined;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string) => void;
-                })) => boolean) => boolean;
-                executeOnLayoutBeforeMeasurementHook: (options: {
-                    minimumWidth: number;
-                }) => Observable<[void | Observable<void>]>;
-                selectionTracker: {
-                    track: (frameToTrack: HTMLIFrameElement) => void;
-                    destroy: () => void;
-                    isSelecting: () => boolean;
-                    getSelection: () => Selection | undefined;
-                    $: Observable<    {
-                    event: "selectionchange";
-                    data: Selection | null;
-                    } | {
-                    event: "selectstart";
-                    data: Selection | null;
-                    } | {
-                    event: "selectend";
-                    data: Selection | null;
-                    }>;
-                };
-                fingerTracker: {
-                    track: (frame: HTMLIFrameElement) => void;
-                    getFingerPositionInIframe(): {
-                        x: number | undefined;
-                        y: number | undefined;
-                    } | undefined;
-                    destroy: () => void;
-                    $: Observable<    {
-                    event: "fingermove";
-                    data: {
-                    x: number;
-                    y: number;
-                    };
-                    } | {
-                    event: "fingerout";
-                    data: undefined;
-                    }>;
-                };
-                getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-                    columnHeight: number;
-                    columnWidth: number;
-                    width: number;
-                };
-                getDimensionsForPaginatedContent: () => {
-                    columnHeight: number;
-                    columnWidth: number;
-                };
-                $: {
-                    contentLayout$: Observable<    {
-                    isFirstLayout: boolean;
-                    isReady: boolean;
-                    }>;
-                    loaded$: Observable<HTMLIFrameElement>;
-                    isReady$: Observable<boolean>;
-                };
-            };
-            pageIndex: number;
-            cfi: string | undefined;
-            options: {
-                isAtEndOfChapter?: boolean | undefined;
-            };
-        } & {
-            spineItemIndex: number;
-        }) => void) | ((begin: {
-            spineItem: {
-                layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-                    blankPagePosition: "after" | "before" | "none";
-                    minimumWidth: number;
-                    spreadPosition: "none" | "right" | "left";
-                }) => {
-                    width: number;
-                    height: number;
-                };
-                item: {
-                    id: string;
-                    href: string;
-                    renditionLayout: "reflowable" | "pre-paginated";
-                    progressionWeight: number;
-                    pageSpreadLeft: true | undefined;
-                    pageSpreadRight: true | undefined;
-                    mediaType?: string | undefined;
-                };
-                load: () => void;
-                adjustPositionOfElement: ({ right, left, top }: {
-                    right?: number | undefined;
-                    left?: number | undefined;
-                    top?: number | undefined;
-                }) => void;
-                getElementDimensions: () => {
-                    width: number;
-                    height: number;
-                };
-                getHtmlFromResource: (response: Response) => Promise<string>;
-                getResource: () => Promise<Response>;
-                translateFramePositionIntoPage: (position: {
-                    clientX: number;
-                    clientY: number;
-                }) => {
-                    clientX: number;
-                    clientY: number;
-                };
-                setLayoutDirty: () => void;
-                injectStyle: (cssText: string) => void;
-                loadContent: () => void;
-                unloadContent: () => void;
-                spineItemFrame: {
-                    getIsLoaded: () => boolean;
-                    getIsReady: () => boolean;
-                    getViewportDimensions: () => {
-                        width: number;
-                        height: number;
-                    } | undefined;
-                    getFrameElement: () => HTMLIFrameElement | undefined;
-                    getHtmlFromResource: (response: Response) => Promise<string>;
-                    load: () => void;
-                    unload: () => void;
-                    staticLayout: (size: {
-                        width: number;
-                        height: number;
-                    }) => void;
-                    getManipulableFrame: () => {
-                        frame: HTMLIFrameElement;
-                        removeStyle: (id: string) => void;
-                        addStyle: (id: string, style: string, prepend?: boolean) => void;
-                    } | undefined;
-                    getReadingDirection: () => "ltr" | "rtl" | undefined;
-                    isUsingVerticalWriting: () => boolean;
-                    getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-                    destroy: () => void;
-                    $: {
-                        unload$: Observable<void>;
-                        unloaded$: Observable<void>;
-                        loaded$: Observable<HTMLIFrameElement>;
-                        ready$: Observable<FontFaceSet | undefined>;
-                        isReady$: Observable<boolean>;
-                        contentLayoutChange$: Observable<    {
-                        isFirstLayout: boolean;
-                        } | {
-                        isFirstLayout: boolean;
-                        }>;
-                    };
-                };
-                element: HTMLElement;
-                getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-                getViewPortInformation: () => {
-                    computedScale: number;
-                    computedWidthScale: number;
-                    viewportDimensions: {
-                        width: number;
-                        height: number;
-                    };
-                } | undefined;
-                isImageType: () => boolean;
-                isReady: () => boolean;
-                destroy: () => void;
-                isUsingVerticalWriting: () => boolean | undefined;
-                getReadingDirection: () => "ltr" | "rtl" | undefined;
-                manipulateSpineItem: (cb: (options: {
-                    container: HTMLElement;
-                    item: {
-                        id: string;
-                        href: string;
-                        renditionLayout: "reflowable" | "pre-paginated";
-                        progressionWeight: number;
-                        pageSpreadLeft: true | undefined;
-                        pageSpreadRight: true | undefined;
-                        mediaType?: string | undefined;
-                    };
-                    overlayElement: HTMLDivElement;
-                } & ({
-                    frame: HTMLIFrameElement;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string, prepend?: boolean) => void;
-                } | {
-                    frame: undefined;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string) => void;
-                })) => boolean) => boolean;
-                executeOnLayoutBeforeMeasurementHook: (options: {
-                    minimumWidth: number;
-                }) => Observable<[void | Observable<void>]>;
-                selectionTracker: {
-                    track: (frameToTrack: HTMLIFrameElement) => void;
-                    destroy: () => void;
-                    isSelecting: () => boolean;
-                    getSelection: () => Selection | undefined;
-                    $: Observable<    {
-                    event: "selectionchange";
-                    data: Selection | null;
-                    } | {
-                    event: "selectstart";
-                    data: Selection | null;
-                    } | {
-                    event: "selectend";
-                    data: Selection | null;
-                    }>;
-                };
-                fingerTracker: {
-                    track: (frame: HTMLIFrameElement) => void;
-                    getFingerPositionInIframe(): {
-                        x: number | undefined;
-                        y: number | undefined;
-                    } | undefined;
-                    destroy: () => void;
-                    $: Observable<    {
-                    event: "fingermove";
-                    data: {
-                    x: number;
-                    y: number;
-                    };
-                    } | {
-                    event: "fingerout";
-                    data: undefined;
-                    }>;
-                };
-                getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-                    columnHeight: number;
-                    columnWidth: number;
-                    width: number;
-                };
-                getDimensionsForPaginatedContent: () => {
-                    columnHeight: number;
-                    columnWidth: number;
-                };
-                $: {
-                    contentLayout$: Observable<    {
-                    isFirstLayout: boolean;
-                    isReady: boolean;
-                    }>;
-                    loaded$: Observable<HTMLIFrameElement>;
-                    isReady$: Observable<boolean>;
-                };
-            };
-            pageIndex: number;
-            cfi: string | undefined;
-            options: {
-                isAtEndOfChapter?: boolean | undefined;
-            };
-        } & {
-            spineItemIndex: number;
-        }, end: {
-            spineItem: {
-                layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-                    blankPagePosition: "after" | "before" | "none";
-                    minimumWidth: number;
-                    spreadPosition: "none" | "right" | "left";
-                }) => {
-                    width: number;
-                    height: number;
-                };
-                item: {
-                    id: string;
-                    href: string;
-                    renditionLayout: "reflowable" | "pre-paginated";
-                    progressionWeight: number;
-                    pageSpreadLeft: true | undefined;
-                    pageSpreadRight: true | undefined;
-                    mediaType?: string | undefined;
-                };
-                load: () => void;
-                adjustPositionOfElement: ({ right, left, top }: {
-                    right?: number | undefined;
-                    left?: number | undefined;
-                    top?: number | undefined;
-                }) => void;
-                getElementDimensions: () => {
-                    width: number;
-                    height: number;
-                };
-                getHtmlFromResource: (response: Response) => Promise<string>;
-                getResource: () => Promise<Response>;
-                translateFramePositionIntoPage: (position: {
-                    clientX: number;
-                    clientY: number;
-                }) => {
-                    clientX: number;
-                    clientY: number;
-                };
-                setLayoutDirty: () => void;
-                injectStyle: (cssText: string) => void;
-                loadContent: () => void;
-                unloadContent: () => void;
-                spineItemFrame: {
-                    getIsLoaded: () => boolean;
-                    getIsReady: () => boolean;
-                    getViewportDimensions: () => {
-                        width: number;
-                        height: number;
-                    } | undefined;
-                    getFrameElement: () => HTMLIFrameElement | undefined;
-                    getHtmlFromResource: (response: Response) => Promise<string>;
-                    load: () => void;
-                    unload: () => void;
-                    staticLayout: (size: {
-                        width: number;
-                        height: number;
-                    }) => void;
-                    getManipulableFrame: () => {
-                        frame: HTMLIFrameElement;
-                        removeStyle: (id: string) => void;
-                        addStyle: (id: string, style: string, prepend?: boolean) => void;
-                    } | undefined;
-                    getReadingDirection: () => "ltr" | "rtl" | undefined;
-                    isUsingVerticalWriting: () => boolean;
-                    getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-                    destroy: () => void;
-                    $: {
-                        unload$: Observable<void>;
-                        unloaded$: Observable<void>;
-                        loaded$: Observable<HTMLIFrameElement>;
-                        ready$: Observable<FontFaceSet | undefined>;
-                        isReady$: Observable<boolean>;
-                        contentLayoutChange$: Observable<    {
-                        isFirstLayout: boolean;
-                        } | {
-                        isFirstLayout: boolean;
-                        }>;
-                    };
-                };
-                element: HTMLElement;
-                getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-                getViewPortInformation: () => {
-                    computedScale: number;
-                    computedWidthScale: number;
-                    viewportDimensions: {
-                        width: number;
-                        height: number;
-                    };
-                } | undefined;
-                isImageType: () => boolean;
-                isReady: () => boolean;
-                destroy: () => void;
-                isUsingVerticalWriting: () => boolean | undefined;
-                getReadingDirection: () => "ltr" | "rtl" | undefined;
-                manipulateSpineItem: (cb: (options: {
-                    container: HTMLElement;
-                    item: {
-                        id: string;
-                        href: string;
-                        renditionLayout: "reflowable" | "pre-paginated";
-                        progressionWeight: number;
-                        pageSpreadLeft: true | undefined;
-                        pageSpreadRight: true | undefined;
-                        mediaType?: string | undefined;
-                    };
-                    overlayElement: HTMLDivElement;
-                } & ({
-                    frame: HTMLIFrameElement;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string, prepend?: boolean) => void;
-                } | {
-                    frame: undefined;
-                    removeStyle: (id: string) => void;
-                    addStyle: (id: string, style: string) => void;
-                })) => boolean) => boolean;
-                executeOnLayoutBeforeMeasurementHook: (options: {
-                    minimumWidth: number;
-                }) => Observable<[void | Observable<void>]>;
-                selectionTracker: {
-                    track: (frameToTrack: HTMLIFrameElement) => void;
-                    destroy: () => void;
-                    isSelecting: () => boolean;
-                    getSelection: () => Selection | undefined;
-                    $: Observable<    {
-                    event: "selectionchange";
-                    data: Selection | null;
-                    } | {
-                    event: "selectstart";
-                    data: Selection | null;
-                    } | {
-                    event: "selectend";
-                    data: Selection | null;
-                    }>;
-                };
-                fingerTracker: {
-                    track: (frame: HTMLIFrameElement) => void;
-                    getFingerPositionInIframe(): {
-                        x: number | undefined;
-                        y: number | undefined;
-                    } | undefined;
-                    destroy: () => void;
-                    $: Observable<    {
-                    event: "fingermove";
-                    data: {
-                    x: number;
-                    y: number;
-                    };
-                    } | {
-                    event: "fingerout";
-                    data: undefined;
-                    }>;
-                };
-                getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-                    columnHeight: number;
-                    columnWidth: number;
-                    width: number;
-                };
-                getDimensionsForPaginatedContent: () => {
-                    columnHeight: number;
-                    columnWidth: number;
-                };
-                $: {
-                    contentLayout$: Observable<    {
-                    isFirstLayout: boolean;
-                    isReady: boolean;
-                    }>;
-                    loaded$: Observable<HTMLIFrameElement>;
-                    isReady$: Observable<boolean>;
-                };
-            };
-            pageIndex: number;
-            cfi: string | undefined;
-            options: {
-                isAtEndOfChapter?: boolean | undefined;
-            };
-        } & {
-            spineItemIndex: number;
-        }) => void);
-        getPaginationInfo: () => PaginationInfo;
-        paginationInfo$: Observable<PaginationInfo>;
-    }, "paginationInfo$" | "getPaginationInfo"> & {
-        paginationInfo$: Observable<PaginationInfo & ExtraPaginationInfo>;
-        getPaginationInfo: () => PaginationInfo & ExtraPaginationInfo;
-    }, "paginationInfo$" | "getPaginationInfo">;
-};
-
-declare const createSelection: (selection: Selection, item: Manifest[`spineItems`][number]) => {
-    toString: () => string;
-    getAnchorCfi: () => string | undefined;
-    getFocusCfi: () => string | undefined;
-};
-
-declare const createSpineItem: ({ item, context, containerElement, viewportState$, settings, hookManager }: {
-    item: Manifest[`spineItems`][number];
-    containerElement: HTMLElement;
-    context: Context;
-    viewportState$: Observable<`free` | `busy`>;
-    settings: SettingsManager;
-    hookManager: HookManager;
-}) => {
-    layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-        blankPagePosition: "after" | "before" | "none";
-        minimumWidth: number;
-        spreadPosition: "none" | "right" | "left";
-    }) => {
-        width: number;
-        height: number;
-    };
-    item: {
-        id: string;
-        href: string;
-        renditionLayout: "reflowable" | "pre-paginated";
-        progressionWeight: number;
-        pageSpreadLeft: true | undefined;
-        pageSpreadRight: true | undefined;
-        mediaType?: string | undefined;
-    };
-    load: () => void;
-    adjustPositionOfElement: ({ right, left, top }: {
-        right?: number | undefined;
-        left?: number | undefined;
-        top?: number | undefined;
-    }) => void;
-    getElementDimensions: () => {
-        width: number;
-        height: number;
-    };
-    getHtmlFromResource: (response: Response) => Promise<string>;
-    getResource: () => Promise<Response>;
-    translateFramePositionIntoPage: (position: {
-        clientX: number;
-        clientY: number;
-    }) => {
-        clientX: number;
-        clientY: number;
-    };
-    setLayoutDirty: () => void;
-    injectStyle: (cssText: string) => void;
-    loadContent: () => void;
-    unloadContent: () => void;
-    spineItemFrame: {
-        getIsLoaded: () => boolean;
-        getIsReady: () => boolean;
-        getViewportDimensions: () => {
-            width: number;
-            height: number;
-        } | undefined;
-        getFrameElement: () => HTMLIFrameElement | undefined;
-        getHtmlFromResource: (response: Response) => Promise<string>;
-        load: () => void;
-        unload: () => void;
-        staticLayout: (size: {
-            width: number;
-            height: number;
-        }) => void;
-        getManipulableFrame: () => {
-            frame: HTMLIFrameElement;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string, prepend?: boolean) => void;
-        } | undefined;
-        getReadingDirection: () => "ltr" | "rtl" | undefined;
-        isUsingVerticalWriting: () => boolean;
-        getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-        destroy: () => void;
-        $: {
-            unload$: Observable<void>;
-            unloaded$: Observable<void>;
-            loaded$: Observable<HTMLIFrameElement>;
-            ready$: Observable<FontFaceSet | undefined>;
-            isReady$: Observable<boolean>;
-            contentLayoutChange$: Observable<{
-                isFirstLayout: boolean;
-            } | {
-                isFirstLayout: boolean;
-            }>;
-        };
-    };
-    element: HTMLElement;
-    getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-    getViewPortInformation: () => {
-        computedScale: number;
-        computedWidthScale: number;
-        viewportDimensions: {
-            width: number;
-            height: number;
-        };
-    } | undefined;
-    isImageType: () => boolean;
-    isReady: () => boolean;
-    destroy: () => void;
-    isUsingVerticalWriting: () => boolean | undefined;
-    getReadingDirection: () => "ltr" | "rtl" | undefined;
-    manipulateSpineItem: (cb: (options: {
-        container: HTMLElement;
-        item: {
-            id: string;
-            href: string;
-            renditionLayout: "reflowable" | "pre-paginated";
-            progressionWeight: number;
-            pageSpreadLeft: true | undefined;
-            pageSpreadRight: true | undefined;
-            mediaType?: string | undefined;
-        };
-        overlayElement: HTMLDivElement;
-    } & ({
-        frame: HTMLIFrameElement;
-        removeStyle: (id: string) => void;
-        addStyle: (id: string, style: string, prepend?: boolean) => void;
-    } | {
-        frame: undefined;
-        removeStyle: (id: string) => void;
-        addStyle: (id: string, style: string) => void;
-    })) => boolean) => boolean;
-    executeOnLayoutBeforeMeasurementHook: (options: {
-        minimumWidth: number;
-    }) => Observable<[void | Observable<void>]>;
-    selectionTracker: {
-        track: (frameToTrack: HTMLIFrameElement) => void;
-        destroy: () => void;
-        isSelecting: () => boolean;
-        getSelection: () => Selection | undefined;
-        $: Observable<{
-            event: "selectionchange";
-            data: Selection | null;
-        } | {
-            event: "selectstart";
-            data: Selection | null;
-        } | {
-            event: "selectend";
-            data: Selection | null;
-        }>;
-    };
-    fingerTracker: {
-        track: (frame: HTMLIFrameElement) => void;
-        getFingerPositionInIframe(): {
-            x: number | undefined;
-            y: number | undefined;
-        } | undefined;
-        destroy: () => void;
-        $: Observable<{
-            event: "fingermove";
-            data: {
-                x: number;
-                y: number;
-            };
-        } | {
-            event: "fingerout";
-            data: undefined;
-        }>;
-    };
-    getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-        columnHeight: number;
-        columnWidth: number;
-        width: number;
-    };
-    getDimensionsForPaginatedContent: () => {
-        columnHeight: number;
-        columnWidth: number;
-    };
-    $: {
-        contentLayout$: Observable<{
-            isFirstLayout: boolean;
-            isReady: boolean;
-        }>;
-        loaded$: Observable<HTMLIFrameElement>;
-        isReady$: Observable<boolean>;
-    };
-};
-
-declare const createSpineItemManager: ({ context, settings }: {
-    context: Context;
-    settings: SettingsManager;
-}) => {
-    destroyItems: () => void;
-    add: (spineItem: SpineItem) => void;
-    get: (indexOrId: number | string) => {
-        layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-            blankPagePosition: "after" | "before" | "none";
-            minimumWidth: number;
-            spreadPosition: "none" | "right" | "left";
-        }) => {
-            width: number;
-            height: number;
-        };
-        item: {
-            id: string;
-            href: string;
-            renditionLayout: "reflowable" | "pre-paginated";
-            progressionWeight: number;
-            pageSpreadLeft: true | undefined;
-            pageSpreadRight: true | undefined;
-            mediaType?: string | undefined;
-        };
-        load: () => void;
-        adjustPositionOfElement: ({ right, left, top }: {
-            right?: number | undefined;
-            left?: number | undefined;
-            top?: number | undefined;
-        }) => void;
-        getElementDimensions: () => {
-            width: number;
-            height: number;
-        };
-        getHtmlFromResource: (response: Response) => Promise<string>;
-        getResource: () => Promise<Response>;
-        translateFramePositionIntoPage: (position: {
-            clientX: number;
-            clientY: number;
-        }) => {
-            clientX: number;
-            clientY: number;
-        };
-        setLayoutDirty: () => void;
-        injectStyle: (cssText: string) => void;
-        loadContent: () => void;
-        unloadContent: () => void;
-        spineItemFrame: {
-            getIsLoaded: () => boolean;
-            getIsReady: () => boolean;
-            getViewportDimensions: () => {
-                width: number;
-                height: number;
-            } | undefined;
-            getFrameElement: () => HTMLIFrameElement | undefined;
-            getHtmlFromResource: (response: Response) => Promise<string>;
-            load: () => void;
-            unload: () => void;
-            staticLayout: (size: {
-                width: number;
-                height: number;
-            }) => void;
-            getManipulableFrame: () => {
-                frame: HTMLIFrameElement;
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: string, prepend?: boolean) => void;
-            } | undefined;
-            getReadingDirection: () => "ltr" | "rtl" | undefined;
-            isUsingVerticalWriting: () => boolean;
-            getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-            destroy: () => void;
-            $: {
-                unload$: Observable<void>;
-                unloaded$: Observable<void>;
-                loaded$: Observable<HTMLIFrameElement>;
-                ready$: Observable<FontFaceSet | undefined>;
-                isReady$: Observable<boolean>;
-                contentLayoutChange$: Observable<    {
-                isFirstLayout: boolean;
-                } | {
-                isFirstLayout: boolean;
-                }>;
-            };
-        };
-        element: HTMLElement;
-        getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-        getViewPortInformation: () => {
-            computedScale: number;
-            computedWidthScale: number;
-            viewportDimensions: {
-                width: number;
-                height: number;
-            };
-        } | undefined;
-        isImageType: () => boolean;
-        isReady: () => boolean;
-        destroy: () => void;
-        isUsingVerticalWriting: () => boolean | undefined;
-        getReadingDirection: () => "ltr" | "rtl" | undefined;
-        manipulateSpineItem: (cb: (options: {
-            container: HTMLElement;
-            item: {
-                id: string;
-                href: string;
-                renditionLayout: "reflowable" | "pre-paginated";
-                progressionWeight: number;
-                pageSpreadLeft: true | undefined;
-                pageSpreadRight: true | undefined;
-                mediaType?: string | undefined;
-            };
-            overlayElement: HTMLDivElement;
-        } & ({
-            frame: HTMLIFrameElement;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string, prepend?: boolean) => void;
-        } | {
-            frame: undefined;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string) => void;
-        })) => boolean) => boolean;
-        executeOnLayoutBeforeMeasurementHook: (options: {
-            minimumWidth: number;
-        }) => Observable<[void | Observable<void>]>;
-        selectionTracker: {
-            track: (frameToTrack: HTMLIFrameElement) => void;
-            destroy: () => void;
-            isSelecting: () => boolean;
-            getSelection: () => Selection | undefined;
-            $: Observable<    {
-            event: "selectionchange";
-            data: Selection | null;
-            } | {
-            event: "selectstart";
-            data: Selection | null;
-            } | {
-            event: "selectend";
-            data: Selection | null;
-            }>;
-        };
-        fingerTracker: {
-            track: (frame: HTMLIFrameElement) => void;
-            getFingerPositionInIframe(): {
-                x: number | undefined;
-                y: number | undefined;
-            } | undefined;
-            destroy: () => void;
-            $: Observable<    {
-            event: "fingermove";
-            data: {
-            x: number;
-            y: number;
-            };
-            } | {
-            event: "fingerout";
-            data: undefined;
-            }>;
-        };
-        getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-            columnHeight: number;
-            columnWidth: number;
-            width: number;
-        };
-        getDimensionsForPaginatedContent: () => {
-            columnHeight: number;
-            columnWidth: number;
-        };
-        $: {
-            contentLayout$: Observable<    {
-            isFirstLayout: boolean;
-            isReady: boolean;
-            }>;
-            loaded$: Observable<HTMLIFrameElement>;
-            isReady$: Observable<boolean>;
-        };
-    } | undefined;
-    getAll: () => {
-        layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-            blankPagePosition: "after" | "before" | "none";
-            minimumWidth: number;
-            spreadPosition: "none" | "right" | "left";
-        }) => {
-            width: number;
-            height: number;
-        };
-        item: {
-            id: string;
-            href: string;
-            renditionLayout: "reflowable" | "pre-paginated";
-            progressionWeight: number;
-            pageSpreadLeft: true | undefined;
-            pageSpreadRight: true | undefined;
-            mediaType?: string | undefined;
-        };
-        load: () => void;
-        adjustPositionOfElement: ({ right, left, top }: {
-            right?: number | undefined;
-            left?: number | undefined;
-            top?: number | undefined;
-        }) => void;
-        getElementDimensions: () => {
-            width: number;
-            height: number;
-        };
-        getHtmlFromResource: (response: Response) => Promise<string>;
-        getResource: () => Promise<Response>;
-        translateFramePositionIntoPage: (position: {
-            clientX: number;
-            clientY: number;
-        }) => {
-            clientX: number;
-            clientY: number;
-        };
-        setLayoutDirty: () => void;
-        injectStyle: (cssText: string) => void;
-        loadContent: () => void;
-        unloadContent: () => void;
-        spineItemFrame: {
-            getIsLoaded: () => boolean;
-            getIsReady: () => boolean;
-            getViewportDimensions: () => {
-                width: number;
-                height: number;
-            } | undefined;
-            getFrameElement: () => HTMLIFrameElement | undefined;
-            getHtmlFromResource: (response: Response) => Promise<string>;
-            load: () => void;
-            unload: () => void;
-            staticLayout: (size: {
-                width: number;
-                height: number;
-            }) => void;
-            getManipulableFrame: () => {
-                frame: HTMLIFrameElement;
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: string, prepend?: boolean) => void;
-            } | undefined;
-            getReadingDirection: () => "ltr" | "rtl" | undefined;
-            isUsingVerticalWriting: () => boolean;
-            getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-            destroy: () => void;
-            $: {
-                unload$: Observable<void>;
-                unloaded$: Observable<void>;
-                loaded$: Observable<HTMLIFrameElement>;
-                ready$: Observable<FontFaceSet | undefined>;
-                isReady$: Observable<boolean>;
-                contentLayoutChange$: Observable<    {
-                isFirstLayout: boolean;
-                } | {
-                isFirstLayout: boolean;
-                }>;
-            };
-        };
-        element: HTMLElement;
-        getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-        getViewPortInformation: () => {
-            computedScale: number;
-            computedWidthScale: number;
-            viewportDimensions: {
-                width: number;
-                height: number;
-            };
-        } | undefined;
-        isImageType: () => boolean;
-        isReady: () => boolean;
-        destroy: () => void;
-        isUsingVerticalWriting: () => boolean | undefined;
-        getReadingDirection: () => "ltr" | "rtl" | undefined;
-        manipulateSpineItem: (cb: (options: {
-            container: HTMLElement;
-            item: {
-                id: string;
-                href: string;
-                renditionLayout: "reflowable" | "pre-paginated";
-                progressionWeight: number;
-                pageSpreadLeft: true | undefined;
-                pageSpreadRight: true | undefined;
-                mediaType?: string | undefined;
-            };
-            overlayElement: HTMLDivElement;
-        } & ({
-            frame: HTMLIFrameElement;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string, prepend?: boolean) => void;
-        } | {
-            frame: undefined;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string) => void;
-        })) => boolean) => boolean;
-        executeOnLayoutBeforeMeasurementHook: (options: {
-            minimumWidth: number;
-        }) => Observable<[void | Observable<void>]>;
-        selectionTracker: {
-            track: (frameToTrack: HTMLIFrameElement) => void;
-            destroy: () => void;
-            isSelecting: () => boolean;
-            getSelection: () => Selection | undefined;
-            $: Observable<    {
-            event: "selectionchange";
-            data: Selection | null;
-            } | {
-            event: "selectstart";
-            data: Selection | null;
-            } | {
-            event: "selectend";
-            data: Selection | null;
-            }>;
-        };
-        fingerTracker: {
-            track: (frame: HTMLIFrameElement) => void;
-            getFingerPositionInIframe(): {
-                x: number | undefined;
-                y: number | undefined;
-            } | undefined;
-            destroy: () => void;
-            $: Observable<    {
-            event: "fingermove";
-            data: {
-            x: number;
-            y: number;
-            };
-            } | {
-            event: "fingerout";
-            data: undefined;
-            }>;
-        };
-        getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-            columnHeight: number;
-            columnWidth: number;
-            width: number;
-        };
-        getDimensionsForPaginatedContent: () => {
-            columnHeight: number;
-            columnWidth: number;
-        };
-        $: {
-            contentLayout$: Observable<    {
-            isFirstLayout: boolean;
-            isReady: boolean;
-            }>;
-            loaded$: Observable<HTMLIFrameElement>;
-            isReady$: Observable<boolean>;
-        };
-    }[];
-    getLength: () => number;
-    layout: () => void;
-    focus: (indexOrSpineItem: number | SpineItem) => void;
-    loadContents: ((rangeOfIndex: [number, number]) => void) | ((rangeOfIndex: [number, number]) => void);
-    comparePositionOf: (toCompare: SpineItem, withItem: SpineItem) => "after" | "before";
-    getAbsolutePositionOf: (spineItemOrIndex: SpineItem | number) => {
-        left: number;
-        right: number;
-        top: number;
-        bottom: number;
-        width: number;
-        height: number;
-    };
-    getFocusedSpineItem: () => {
-        layout: ({ blankPagePosition, minimumWidth, spreadPosition, }: {
-            blankPagePosition: "after" | "before" | "none";
-            minimumWidth: number;
-            spreadPosition: "none" | "right" | "left";
-        }) => {
-            width: number;
-            height: number;
-        };
-        item: {
-            id: string;
-            href: string;
-            renditionLayout: "reflowable" | "pre-paginated";
-            progressionWeight: number;
-            pageSpreadLeft: true | undefined;
-            pageSpreadRight: true | undefined;
-            mediaType?: string | undefined;
-        };
-        load: () => void;
-        adjustPositionOfElement: ({ right, left, top }: {
-            right?: number | undefined;
-            left?: number | undefined;
-            top?: number | undefined;
-        }) => void;
-        getElementDimensions: () => {
-            width: number;
-            height: number;
-        };
-        getHtmlFromResource: (response: Response) => Promise<string>;
-        getResource: () => Promise<Response>;
-        translateFramePositionIntoPage: (position: {
-            clientX: number;
-            clientY: number;
-        }) => {
-            clientX: number;
-            clientY: number;
-        };
-        setLayoutDirty: () => void;
-        injectStyle: (cssText: string) => void;
-        loadContent: () => void;
-        unloadContent: () => void;
-        spineItemFrame: {
-            getIsLoaded: () => boolean;
-            getIsReady: () => boolean;
-            getViewportDimensions: () => {
-                width: number;
-                height: number;
-            } | undefined;
-            getFrameElement: () => HTMLIFrameElement | undefined;
-            getHtmlFromResource: (response: Response) => Promise<string>;
-            load: () => void;
-            unload: () => void;
-            staticLayout: (size: {
-                width: number;
-                height: number;
-            }) => void;
-            getManipulableFrame: () => {
-                frame: HTMLIFrameElement;
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: string, prepend?: boolean) => void;
-            } | undefined;
-            getReadingDirection: () => "ltr" | "rtl" | undefined;
-            isUsingVerticalWriting: () => boolean;
-            getWritingMode: () => "vertical-rl" | "horizontal-tb" | undefined;
-            destroy: () => void;
-            $: {
-                unload$: Observable<void>;
-                unloaded$: Observable<void>;
-                loaded$: Observable<HTMLIFrameElement>;
-                ready$: Observable<FontFaceSet | undefined>;
-                isReady$: Observable<boolean>;
-                contentLayoutChange$: Observable<    {
-                isFirstLayout: boolean;
-                } | {
-                isFirstLayout: boolean;
-                }>;
-            };
-        };
-        element: HTMLElement;
-        getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
-        getViewPortInformation: () => {
-            computedScale: number;
-            computedWidthScale: number;
-            viewportDimensions: {
-                width: number;
-                height: number;
-            };
-        } | undefined;
-        isImageType: () => boolean;
-        isReady: () => boolean;
-        destroy: () => void;
-        isUsingVerticalWriting: () => boolean | undefined;
-        getReadingDirection: () => "ltr" | "rtl" | undefined;
-        manipulateSpineItem: (cb: (options: {
-            container: HTMLElement;
-            item: {
-                id: string;
-                href: string;
-                renditionLayout: "reflowable" | "pre-paginated";
-                progressionWeight: number;
-                pageSpreadLeft: true | undefined;
-                pageSpreadRight: true | undefined;
-                mediaType?: string | undefined;
-            };
-            overlayElement: HTMLDivElement;
-        } & ({
-            frame: HTMLIFrameElement;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string, prepend?: boolean) => void;
-        } | {
-            frame: undefined;
-            removeStyle: (id: string) => void;
-            addStyle: (id: string, style: string) => void;
-        })) => boolean) => boolean;
-        executeOnLayoutBeforeMeasurementHook: (options: {
-            minimumWidth: number;
-        }) => Observable<[void | Observable<void>]>;
-        selectionTracker: {
-            track: (frameToTrack: HTMLIFrameElement) => void;
-            destroy: () => void;
-            isSelecting: () => boolean;
-            getSelection: () => Selection | undefined;
-            $: Observable<    {
-            event: "selectionchange";
-            data: Selection | null;
-            } | {
-            event: "selectstart";
-            data: Selection | null;
-            } | {
-            event: "selectend";
-            data: Selection | null;
-            }>;
-        };
-        fingerTracker: {
-            track: (frame: HTMLIFrameElement) => void;
-            getFingerPositionInIframe(): {
-                x: number | undefined;
-                y: number | undefined;
-            } | undefined;
-            destroy: () => void;
-            $: Observable<    {
-            event: "fingermove";
-            data: {
-            x: number;
-            y: number;
-            };
-            } | {
-            event: "fingerout";
-            data: undefined;
-            }>;
-        };
-        getDimensionsForReflowableContent: (isUsingVerticalWriting: boolean, minimumWidth: number) => {
-            columnHeight: number;
-            columnWidth: number;
-            width: number;
-        };
-        getDimensionsForPaginatedContent: () => {
-            columnHeight: number;
-            columnWidth: number;
-        };
-        $: {
-            contentLayout$: Observable<    {
-            isFirstLayout: boolean;
-            isReady: boolean;
-            }>;
-            loaded$: Observable<HTMLIFrameElement>;
-            isReady$: Observable<boolean>;
-        };
-    } | undefined;
-    getFocusedSpineItemIndex: () => number | undefined;
-    getSpineItemIndex: (spineItem: SpineItem | undefined) => number | undefined;
-    destroy: () => void;
-    $: {
-        focus$: Observable<    {
-        data: SpineItem;
-        }>;
-        layout$: Observable<boolean>;
-        itemIsReady$: Observable<    {
-        item: {
-        id: string;
-        href: string;
-        renditionLayout: "reflowable" | "pre-paginated";
-        progressionWeight: number;
-        pageSpreadLeft: true | undefined;
-        pageSpreadRight: true | undefined;
-        mediaType?: string | undefined;
-        };
-        isReady: boolean;
-        }>;
-    };
-};
-
-declare const createViewportNavigator: ({ spineItemManager, context, pagination, parentElement$, cfiLocator, spineLocator, hookManager, spine, settings, }: {
-    spineItemManager: SpineItemManager;
-    pagination: Pagination;
-    context: Context;
-    parentElement$: BehaviorSubject<HTMLElement | undefined>;
-    cfiLocator: ReturnType<typeof createCfiLocator>;
-    spineLocator: ReturnType<typeof createLocationResolver>;
-    hookManager: HookManager;
-    spine: Spine;
-    settings: SettingsManager;
-}) => {
-    destroy: () => void;
-    layout: () => void;
-    getCurrentNavigationPosition: () => ViewportNavigationEntry;
-    getCurrentViewportPosition: (() => {
-        x: number;
-        y: number;
-    }) | (() => {
-        x: number;
-        y: number;
-    });
-    turnLeft: ({ allowSpineItemChange }?: {
-        allowSpineItemChange?: boolean | undefined;
-    }) => void;
-    turnRight: ({ allowSpineItemChange }?: {
-        allowSpineItemChange?: boolean | undefined;
-    }) => void;
-    goToPage: (pageIndex: number) => void;
-    goToSpineItem: (indexOrId: string | number, options?: {
-        animate: boolean;
-    }) => void;
-    goToUrl: (url: string | URL) => void;
-    goToCfi: (cfi: string, options?: {
-        animate: boolean;
-    }) => void;
-    goToPageOfCurrentChapter: (pageIndex: number) => void;
-    moveTo: ((delta: {
-        x: number;
-        y: number;
-    } | undefined, { final, start }?: {
-        start?: boolean | undefined;
-        final?: boolean | undefined;
-    }) => void) | ((delta: {
-        x: number;
-        y: number;
-    } | undefined, args_1?: {
-        start?: boolean | undefined;
-        final?: boolean | undefined;
-    } | undefined) => void);
-    getLastUserExpectedNavigation: () => LastUserExpectedNavigation;
-    element$: BehaviorSubject<HTMLElement>;
-    getElement: () => HTMLElement;
-    $: {
-        state$: Observable<"free" | "busy">;
-        navigation$: Observable<Navigation>;
-        navigationAdjustedAfterLayout$: Observable<{
-            previousNavigationPosition: ViewportNavigationEntry;
-            adjustedSpinePosition: ViewportNavigationEntry;
-            areDifferent: boolean;
-        }>;
-        currentNavigationPosition$: Observable<ViewportNavigationEntry>;
-    };
-};
-
-declare const defaultThemes: ({
-    name: "bright";
-    backgroundColor: string;
-    foregroundColor?: undefined;
-} | {
-    name: "sepia";
-    backgroundColor: string;
-    foregroundColor: string;
-} | {
-    name: "night";
-    backgroundColor: string;
-    foregroundColor: string;
-})[];
-
-declare type Event_2 = {
-    type: `onSelectionChange`;
-    data: ReturnType<typeof createSelection> | null;
-};
-
-declare type ExtraPaginationInfo = {
-    beginChapterInfo: ChapterInfo | undefined;
-    beginSpineItemReadingDirection: `rtl` | `ltr` | undefined;
-    beginAbsolutePageIndex: number | undefined;
-    endChapterInfo: ChapterInfo | undefined;
-    endSpineItemReadingDirection: `rtl` | `ltr` | undefined;
-    endAbsolutePageIndex: number | undefined;
-    percentageEstimateOfBook: number | undefined;
-    numberOfTotalPages: number | undefined;
-    isUsingSpread: boolean;
-};
-
-export declare const groupBy: <T, K extends string | number | symbol>(list: T[], getKey: (item: T) => K) => Record<K, T[]>;
-
-declare type Hook = {
-    name: `item.onLoad`;
-    runFn: (params: {
-        destroy$: Observable<void>;
-        destroy: (fn: UserDestroyFn) => void;
-        itemId: string;
-        frame: HTMLIFrameElement;
-    }) => Observable<void>;
-} | {
-    name: "item.onAfterLayout";
-    runFn: (params: {
-        blankPagePosition: "before" | "after" | "none";
-        item: Manifest["spineItems"][number];
-        minimumWidth: number;
-    }) => void;
-} | {
-    name: "item.onBeforeContainerCreated";
-    runFn: (params: {
-        element: HTMLElement;
-    }) => void;
-} | {
-    name: "item.onLayoutBeforeMeasurement";
-    runFn: (params: {
-        frame: {
-            getManipulableFrame: () => undefined | {
-                removeStyle: (id: string) => void;
-                addStyle: (id: string, style: CSSStyleDeclaration[`cssText`]) => void;
-            };
-            getViewportDimensions: () => {
-                width: number;
-                height: number;
-            } | undefined;
-            isUsingVerticalWriting: () => boolean;
-            getIsReady: () => boolean;
-        };
-        container: HTMLElement;
-        item: Manifest[`spineItems`][number];
-        minimumWidth: number;
-        isImageType: () => boolean | undefined;
-    }) => void;
-} | {
-    name: "onViewportOffsetAdjust";
-    runFn: (params: void) => void;
-} | {
-    name: `viewportNavigator.onBeforeContainerCreated`;
-    runFn: (params: {
-        element: HTMLElement;
-    }) => void;
-};
-
-declare type HookExecution = {
-    name: string;
-    id: string | undefined;
-    destroyFn: () => Observable<unknown>;
-    ref: Hook;
-};
-
-declare type HookFrom<Name extends Hook["name"]> = Hook extends infer HK ? HK extends Hook ? HK["name"] extends Name ? HK : never : never : never;
-
-declare class HookManager {
-    _hooks: Array<Hook>;
-    _hookExecutions: Array<HookExecution>;
-    _deregister(hookToDeregister: Hook): Observable<unknown[]>;
-    register<Name extends Hook["name"]>(name: Name, fn: (params: HookParamsFrom<Name>) => void | Observable<void>): () => void;
-    execute<Name extends Hook["name"]>(name: Name, id: string | undefined, params: Omit<HookParamsFrom<Name>, "destroy$" | "destroy">): Observable<[void | Observable<void>]>;
-    destroy<Name extends Hook["name"]>(name: Name, id?: string, ref?: Hook): Observable<unknown[]>;
-}
-
-declare type HookParamsFrom<Name extends Hook["name"]> = Parameters<HookFrom<Name>["runFn"]>[0];
-
-export declare const isShallowEqual: <T = any, R = any>(objectA: T, objectB: R, options?: {
-    customEqual?: (<T_1>(a: T_1, b: T_1) => boolean) | undefined;
-} | undefined) => boolean;
-
-declare type LastUserExpectedNavigation = undefined | {
-    type: `navigate-from-previous-item`;
-} | {
-    type: `navigate-from-next-item`;
-} | {
-    type: `navigate-from-cfi`;
-    data: string;
-} | {
-    type: `navigate-from-anchor`;
-    data: string;
-};
-
-declare type LoadOptions = {
-    cfi?: string | null;
-    containerElement: HTMLElement;
-};
-
-declare type Locator = ReturnType<typeof createLocationResolver>;
-
-export { Manifest }
-
-declare type ManipulableSpineItemCallback = Parameters<SpineItem[`manipulateSpineItem`]>[0];
-
-declare type ManipulableSpineItemCallbackPayload = Parameters<ManipulableSpineItemCallback>[0];
-
-declare type Navigation = {
-    position: {
-        x: number;
-        y: number;
-        spineItem?: SpineItem | undefined;
-    };
-    triggeredBy: `scroll` | `manual` | `adjust`;
-    animation: false | `turn` | `snap`;
-    lastUserExpectedNavigation: LastUserExpectedNavigation;
-};
-
-declare type Pagination = ReturnType<typeof createPagination>;
-
-declare type PaginationInfo = {
-    beginPageIndexInSpineItem: number | undefined;
-    beginNumberOfPagesInSpineItem: number;
-    beginCfi: string | undefined;
-    beginSpineItemIndex: number | undefined;
-    endPageIndexInSpineItem: number | undefined;
-    endNumberOfPagesInSpineItem: number;
-    endCfi: string | undefined;
-    endSpineItemIndex: number | undefined;
-};
-
-export declare type Reader = ReturnType<typeof createReader>;
-
-declare type ReaderInternal = {
-    context: Context;
-    spine: Spine;
-    spineItemManager: SpineItemManager;
-    viewportNavigator: ViewportNavigator;
-    settings: SettingsManager;
-    hookManager: HookManager;
-    layout: () => void;
-    load: (manifest: Manifest, loadOptions: LoadOptions) => void;
-    destroy: () => void;
-    pagination: Pagination;
-    element$: Observable<HTMLElement>;
-    $: {
-        state$: Observable<{
-            supportedPageTurnAnimation: NonNullable<ContextSettings[`pageTurnAnimation`]>[];
-            supportedPageTurnMode: NonNullable<ContextSettings[`pageTurnMode`]>[];
-            supportedPageTurnDirection: NonNullable<ContextSettings[`pageTurnDirection`]>[];
-            supportedComputedPageTurnDirection: NonNullable<ContextSettings[`pageTurnDirection`]>[];
-        }>;
-        loadStatus$: Observable<"idle" | "loading" | "ready">;
-        selection$: Observable<{
-            toString: () => string;
-            getAnchorCfi: () => string | undefined;
-            getFocusCfi: () => string | undefined;
-        } | null>;
-        destroy$: Observable<void>;
-    };
-};
-
-export declare type ReaderSelection = ReturnType<typeof createSelection>;
-
-declare const Report_2: {
-    namespace: (namespace: string) => {
-        log: (...data: any[]) => void;
-        warn: (...data: any[]) => void;
-        error: (...data: any[]) => void;
-        time: (name: string, targetDuration?: number) => () => void;
-        logMetric: (performanceEntry: PerformanceEntry | {
-            name: string;
-            duration: number;
-        }, targetDuration?: number) => void;
-        measurePerformance: <F extends (...args: any[]) => any>(name: string, targetDuration: number | undefined, functionToMeasure: F, { disable }?: {
-            disable?: boolean;
-        }) => F | ((...args: Parameters<F>) => ReturnType<F>);
-    };
-    log: (...data: any[]) => void;
-    warn: (...data: any[]) => void;
-    error: (...data: any[]) => void;
-    time: (name: string, targetDuration?: number) => () => void;
-    logMetric: (performanceEntry: PerformanceEntry | {
-        name: string;
-        duration: number;
-    }, targetDuration?: number) => void;
-    measurePerformance: <F extends (...args: any[]) => any>(name: string, targetDuration: number | undefined, functionToMeasure: F, { disable }?: {
-        disable?: boolean;
-    }) => F | ((...args: Parameters<F>) => ReturnType<F>);
-};
-export { Report_2 as Report }
-
-declare type RequireLayout = boolean;
-
-declare type Settings = {
-    forceSinglePageMode: boolean;
-    pageTurnAnimation: `none` | `fade` | `slide`;
-    pageTurnAnimationDuration: undefined | number;
-    pageTurnDirection: `vertical` | `horizontal`;
-    pageTurnMode: `controlled` | `scrollable`;
-    navigationSnapThreshold: number;
-    numberOfAdjacentSpineItemToPreLoad: number;
-    fetchResource?: (item: Manifest[`spineItems`][number]) => Promise<Response>;
-};
-
-declare type SettingsInput = {
-    pageHorizontalMargin?: number;
-    pageVerticalMargin?: number;
-};
-
-declare class SettingsManager {
-    _settingsSubject$: BehaviorSubject<ComputedSettings>;
-    _context: Context;
-    settings$: Observable<ComputedSettings>;
-    constructor(initialSettings: Partial<Settings>, context: Context);
-    _updateSettings(settings: Settings): void;
-    setSettings(settings: Partial<Settings>): void;
-    get settings(): ComputedSettings;
-    destroy(): void;
-}
-
-declare type Spine = {
-    element$: Observable<HTMLElement>;
-    getElement: () => HTMLElement | undefined;
-    locator: Locator;
-    spineItemLocator: SpineItemLocator;
-    cfiLocator: CfiLocator;
-    manipulateSpineItems: (cb: (payload: ManipulableSpineItemCallbackPayload & {
-        index: number;
-    }) => RequireLayout) => void;
-    manipulateSpineItem: (id: string, cb: Parameters<SpineItem[`manipulateSpineItem`]>[0]) => void;
-    destroy: () => void;
-    isSelecting: () => boolean | undefined;
-    getSelection: () => Selection | undefined;
-    adjustPagination: (position: ViewportNavigationEntry) => Observable<`free` | `busy`>;
-    $: {
-        $: Observable<Event_2>;
-        layout$: Observable<boolean>;
-        spineItems$: Observable<SpineItem[]>;
-        itemsBeforeDestroy$: Observable<void>;
-    };
-};
-
-declare type SpineItem = ReturnType<typeof createSpineItem>;
-
-declare type SpineItemLocator = ReturnType<typeof createLocationResolver_2>;
-
-declare type SpineItemManager = ReturnType<typeof createSpineItemManager>;
-
-declare class SpineItemNavigationPosition {
-    __symbol: string;
-    x: number;
-    y: number;
-    constructor(position: {
-        x: number;
-        y: number;
-    });
-}
-
-declare type SpineItemPosition = {
-    x: number;
-    y: number;
-    __symbol?: `SpineItemPosition`;
-};
-
-declare type SpinePosition = {
-    x: number;
-    y: number;
-    __symbol?: `SpinePosition`;
-};
-
-declare type State = Partial<Pick<LoadOptions, "containerElement">> & {
-    manifest?: Manifest;
-    hasVerticalWriting?: boolean;
-    isUsingSpreadMode?: boolean;
-    isFullyPrePaginated?: boolean;
-    forceSinglePageMode?: boolean;
-    areAllItemsPrePaginated?: boolean;
-    calculatedInnerMargin: number;
-    marginTop: number;
-    marginBottom: number;
-    visibleAreaRect: {
-        width: number;
-        height: number;
-        x: number;
-        y: number;
-    };
-};
-
-declare type Theme = (typeof defaultThemes)[number][`name`] | `publisher`;
-
-declare type UnsafeSpineItemPosition = {
-    x: number;
-    y: number;
-    __symbol?: `UnsafeSpineItemPosition` | `SpineItemPosition`;
-};
-
-declare type UnsafeSpinePosition = {
-    x: number;
-    y: number;
-    __symbol?: `UnsafeSpinePosition` | `SpinePosition`;
-};
-
-declare type UserDestroyFn = () => void | Observable<unknown>;
-
-declare type ViewportNavigationEntry = {
-    x: number;
-    y: number;
-    spineItem?: SpineItem;
-};
-
-declare type ViewportNavigator = ReturnType<typeof createViewportNavigator>;
-
-export { }
-
-
-declare global {
-    interface Window {
-        __PROSE_READER_DEBUG?: boolean;
-    }
-}
+import { createSelection } from './selection';
+import { createReaderWithEnhancers as createReader } from './createReaderWithEnhancer';
 
+export type { Manifest } from './types';
+export { HookManager } from './hooks/HookManager';
+export type Reader = ReturnType<typeof createReader>;
+export { createReader };
+export type ReaderSelection = ReturnType<typeof createSelection>;
+export { Report } from './report';
+export { groupBy, isShallowEqual } from './utils/objects';