@prose-reader/core 0.0.36

package/dist/spine/createSpine.d.ts

@@ -0,0 +1,896 @@
+import { BehaviorSubject } from "rxjs";
+import { Context } from "../context";
+import { Pagination } from "../pagination";
+import { createSpineItem } from "../spineItem/createSpineItem";
+import { SpineItemManager } from "../spineItemManager";
+import { createSelection } from "../selection";
+import { ViewportNavigationEntry } from "./navigationResolver";
+import { Hook } from "../types/Hook";
+declare type SpineItem = ReturnType<typeof createSpineItem>;
+declare type RequireLayout = boolean;
+declare type ManipulableSpineItemCallback = Parameters<SpineItem[`manipulateSpineItem`]>[0];
+declare type ManipulableSpineItemCallbackPayload = Parameters<ManipulableSpineItemCallback>[0];
+declare type Event = {
+    type: `onSelectionChange`;
+    data: ReturnType<typeof createSelection> | null;
+};
+export declare const createSpine: ({ parentElement, context, pagination, iframeEventBridgeElement, spineItemManager, hooks$ }: {
+    parentElement: HTMLElement;
+    iframeEventBridgeElement: HTMLElement;
+    context: Context;
+    pagination: Pagination;
+    spineItemManager: SpineItemManager;
+    hooks$: BehaviorSubject<Hook[]>;
+}) => {
+    viewportNavigator: {
+        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;
+        adjustNavigation: (spineItem: import("../spineItem/createSpineItem").SpineItem) => import("rxjs").Observable<{
+            previousNavigationPosition: ViewportNavigationEntry;
+            adjustedSpinePosition: ViewportNavigationEntry;
+            areDifferent: boolean;
+        }>;
+        moveTo: ((delta: {
+            x: number;
+            y: number;
+        } | undefined, { final, start }?: {
+            start?: boolean | undefined;
+            final?: boolean | undefined;
+        }) => void) | ((args_0: {
+            x: number;
+            y: number;
+        } | undefined, args_1?: {
+            start?: boolean | undefined;
+            final?: boolean | undefined;
+        } | undefined) => void);
+        getLastUserExpectedNavigation: () => {
+            type: "navigate-from-previous-item";
+        } | {
+            type: "navigate-from-next-item";
+        } | {
+            type: "navigate-from-cfi";
+            data: string;
+        } | {
+            type: "navigate-from-anchor";
+            data: string;
+        } | undefined;
+        $: {
+            state$: import("rxjs").Observable<"free" | "busy">;
+            navigation$: import("rxjs").Observable<{
+                position: {
+                    x: number;
+                    y: number;
+                    spineItem?: import("../spineItem/createSpineItem").SpineItem | undefined;
+                };
+                triggeredBy: "scroll" | "manual" | "adjust";
+                animation: false | "turn" | "snap";
+            }>;
+        };
+    };
+    element: HTMLElement;
+    locator: {
+        getSpinePositionFromSpineItemPosition: (spineItemPosition: {
+            x: number;
+            y: number;
+            outsideOfBoundaries?: boolean | undefined;
+        }, spineItem: import("../spineItem/createSpineItem").SpineItem) => {
+            x: number;
+            y: number;
+        };
+        getSpinePositionFromSpineItem: (spineItem: import("../spineItem/createSpineItem").SpineItem) => {
+            x: number;
+            y: number;
+        };
+        getSpinePositionFromSpineItemAnchor: (anchor: string, spineItem: import("../spineItem/createSpineItem").SpineItem) => {
+            x: number;
+            y: number;
+        };
+        getSpineItemPositionFromSpinePosition: ((position: {
+            x: number;
+            y: number;
+        }, spineItem: import("../spineItem/createSpineItem").SpineItem) => {
+            x: number;
+            y: number;
+            outsideOfBoundaries?: boolean | undefined;
+        }) | ((position: {
+            x: number;
+            y: number;
+        }, spineItem: import("../spineItem/createSpineItem").SpineItem) => {
+            x: number;
+            y: number;
+            outsideOfBoundaries?: boolean | undefined;
+        });
+        getSpineItemFromPosition: ((position: {
+            x: number;
+            y: number;
+        }) => ({
+            item: {
+                id: string;
+                href: string;
+                path: string;
+                renditionLayout: "reflowable" | "pre-paginated";
+                progressionWeight: number;
+                pageSpreadLeft: true | undefined;
+                pageSpreadRight: true | undefined;
+                mediaType?: string | undefined;
+            };
+        } & {
+            layout: (layoutInformation: {
+                blankPagePosition: "after" | "before" | "none";
+                minimumWidth: number;
+                spreadPosition: "right" | "left" | "none";
+            }) => {
+                width: number;
+                height: number;
+            };
+            load: () => void;
+            adjustPositionOfElement: ({ right, left, top }: {
+                right?: number | undefined;
+                left?: number | undefined;
+                top?: number | undefined;
+            }) => void;
+            createLoadingElement: (containerElement: HTMLElement, item: {
+                id: string;
+                href: string;
+                path: string;
+                renditionLayout: "reflowable" | "pre-paginated";
+                progressionWeight: number;
+                pageSpreadLeft: true | undefined;
+                pageSpreadRight: true | undefined;
+                mediaType?: string | undefined;
+            }, context: {
+                load: (newManifest: import("@prose-reader/shared").Manifest, newLoadOptions: import("../types").LoadOptions) => void;
+                isRTL: () => boolean;
+                areAllItemsPrePaginated: () => boolean;
+                destroy: () => void;
+                getLoadOptions: () => import("../types").LoadOptions | undefined;
+                getCalculatedInnerMargin: () => number;
+                getVisibleAreaRect: () => {
+                    width: number;
+                    height: number;
+                    x: number;
+                    y: number;
+                };
+                shouldDisplaySpread: () => boolean;
+                setHasVerticalWriting: () => void;
+                setVisibleAreaRect: (x: number, y: number, width: number, height: number) => void;
+                getManifest: () => import("@prose-reader/shared").Manifest | undefined;
+                getReadingDirection: () => "ltr" | "rtl" | undefined;
+                getPageSize: () => {
+                    width: number;
+                    height: number;
+                };
+                getSettings: () => import("../settings").PublicSettings & {
+                    computedPageTurnMode: "controlled" | "scrollable";
+                    computedPageTurnDirection: "vertical" | "horizontal";
+                    computedPageTurnAnimation: "none" | "fade" | "slide";
+                    computedPageTurnAnimationDuration: number;
+                    computedSnapAnimationDuration: number;
+                };
+                setSettings: (data: Partial<import("../settings").PublicSettings>) => void;
+                $: {
+                    hasVerticalWriting$: import("rxjs").Observable<boolean>;
+                    destroy$: import("rxjs").Observable<void>;
+                    settings$: import("rxjs").Observable<import("../settings").PublicSettings & {
+                        computedPageTurnMode: "controlled" | "scrollable";
+                        computedPageTurnDirection: "vertical" | "horizontal";
+                        computedPageTurnAnimation: "none" | "fade" | "slide";
+                        computedPageTurnAnimationDuration: number;
+                        computedSnapAnimationDuration: number;
+                    }>;
+                    load$: import("rxjs").Observable<import("@prose-reader/shared").Manifest>;
+                };
+            }) => HTMLDivElement;
+            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$: import("rxjs").Observable<void>;
+                    unloaded$: import("rxjs").Observable<void>;
+                    loaded$: import("rxjs").Observable<HTMLIFrameElement>;
+                    ready$: import("rxjs").Observable<FontFaceSet | undefined>;
+                    isReady$: import("rxjs").Observable<boolean>;
+                    contentLayoutChange$: import("rxjs").Observable<{
+                        isFirstLayout: boolean;
+                    } | {
+                        isFirstLayout: boolean;
+                    }>;
+                };
+            };
+            element: HTMLElement;
+            loadingElement: HTMLDivElement;
+            isReflowable: boolean;
+            getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
+            getViewPortInformation: () => {
+                computedScale: number;
+                computedWidthScale: number;
+                viewportDimensions: {
+                    width: number;
+                    height: number;
+                };
+            } | {
+                width?: number | undefined;
+                height?: number | undefined;
+                computedScale: number;
+                computedWidthScale: number;
+                viewportDimensions?: undefined;
+            };
+            isImageType: () => boolean | undefined;
+            isReady: () => boolean;
+            destroy: () => void;
+            isUsingVerticalWriting: () => boolean | undefined;
+            getReadingDirection: () => "ltr" | "rtl" | undefined;
+            manipulateSpineItem: (cb: (options: {
+                container: HTMLElement;
+                loadingElement: HTMLElement;
+                item: {
+                    id: string;
+                    href: string;
+                    path: 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;
+            executeOnLayoutBeforeMeasurmentHook: (options: {
+                minimumWidth: number;
+            }) => void;
+            selectionTracker: {
+                track: (frameToTrack: HTMLIFrameElement) => void;
+                destroy: () => void;
+                isSelecting: () => boolean;
+                getSelection: () => Selection | undefined;
+                $: import("rxjs").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;
+                $: import("rxjs").Observable<{
+                    event: "fingermove";
+                    data: {
+                        x: number;
+                        y: number;
+                    };
+                } | {
+                    event: "fingerout";
+                    data: undefined;
+                }>;
+            };
+            $: {
+                contentLayoutChangeSubject$: import("rxjs").Observable<{
+                    isFirstLayout: boolean;
+                    isReady: boolean;
+                }>;
+                loaded$: import("rxjs").Observable<HTMLIFrameElement>;
+            };
+        }) | undefined) | ((position: {
+            x: number;
+            y: number;
+        }) => ({
+            item: {
+                id: string;
+                href: string;
+                path: string;
+                renditionLayout: "reflowable" | "pre-paginated";
+                progressionWeight: number;
+                pageSpreadLeft: true | undefined;
+                pageSpreadRight: true | undefined;
+                mediaType?: string | undefined;
+            };
+        } & {
+            layout: (layoutInformation: {
+                blankPagePosition: "after" | "before" | "none";
+                minimumWidth: number;
+                spreadPosition: "right" | "left" | "none";
+            }) => {
+                width: number;
+                height: number;
+            };
+            load: () => void;
+            adjustPositionOfElement: ({ right, left, top }: {
+                right?: number | undefined;
+                left?: number | undefined;
+                top?: number | undefined;
+            }) => void;
+            createLoadingElement: (containerElement: HTMLElement, item: {
+                id: string;
+                href: string;
+                path: string;
+                renditionLayout: "reflowable" | "pre-paginated";
+                progressionWeight: number;
+                pageSpreadLeft: true | undefined;
+                pageSpreadRight: true | undefined;
+                mediaType?: string | undefined;
+            }, context: {
+                load: (newManifest: import("@prose-reader/shared").Manifest, newLoadOptions: import("../types").LoadOptions) => void;
+                isRTL: () => boolean;
+                areAllItemsPrePaginated: () => boolean;
+                destroy: () => void;
+                getLoadOptions: () => import("../types").LoadOptions | undefined;
+                getCalculatedInnerMargin: () => number;
+                getVisibleAreaRect: () => {
+                    width: number;
+                    height: number;
+                    x: number;
+                    y: number;
+                };
+                shouldDisplaySpread: () => boolean;
+                setHasVerticalWriting: () => void;
+                setVisibleAreaRect: (x: number, y: number, width: number, height: number) => void;
+                getManifest: () => import("@prose-reader/shared").Manifest | undefined;
+                getReadingDirection: () => "ltr" | "rtl" | undefined;
+                getPageSize: () => {
+                    width: number;
+                    height: number;
+                };
+                getSettings: () => import("../settings").PublicSettings & {
+                    computedPageTurnMode: "controlled" | "scrollable";
+                    computedPageTurnDirection: "vertical" | "horizontal";
+                    computedPageTurnAnimation: "none" | "fade" | "slide";
+                    computedPageTurnAnimationDuration: number;
+                    computedSnapAnimationDuration: number;
+                };
+                setSettings: (data: Partial<import("../settings").PublicSettings>) => void;
+                $: {
+                    hasVerticalWriting$: import("rxjs").Observable<boolean>;
+                    destroy$: import("rxjs").Observable<void>;
+                    settings$: import("rxjs").Observable<import("../settings").PublicSettings & {
+                        computedPageTurnMode: "controlled" | "scrollable";
+                        computedPageTurnDirection: "vertical" | "horizontal";
+                        computedPageTurnAnimation: "none" | "fade" | "slide";
+                        computedPageTurnAnimationDuration: number;
+                        computedSnapAnimationDuration: number;
+                    }>;
+                    load$: import("rxjs").Observable<import("@prose-reader/shared").Manifest>;
+                };
+            }) => HTMLDivElement;
+            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$: import("rxjs").Observable<void>;
+                    unloaded$: import("rxjs").Observable<void>;
+                    loaded$: import("rxjs").Observable<HTMLIFrameElement>;
+                    ready$: import("rxjs").Observable<FontFaceSet | undefined>;
+                    isReady$: import("rxjs").Observable<boolean>;
+                    contentLayoutChange$: import("rxjs").Observable<{
+                        isFirstLayout: boolean;
+                    } | {
+                        isFirstLayout: boolean;
+                    }>;
+                };
+            };
+            element: HTMLElement;
+            loadingElement: HTMLDivElement;
+            isReflowable: boolean;
+            getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
+            getViewPortInformation: () => {
+                computedScale: number;
+                computedWidthScale: number;
+                viewportDimensions: {
+                    width: number;
+                    height: number;
+                };
+            } | {
+                width?: number | undefined;
+                height?: number | undefined;
+                computedScale: number;
+                computedWidthScale: number;
+                viewportDimensions?: undefined;
+            };
+            isImageType: () => boolean | undefined;
+            isReady: () => boolean;
+            destroy: () => void;
+            isUsingVerticalWriting: () => boolean | undefined;
+            getReadingDirection: () => "ltr" | "rtl" | undefined;
+            manipulateSpineItem: (cb: (options: {
+                container: HTMLElement;
+                loadingElement: HTMLElement;
+                item: {
+                    id: string;
+                    href: string;
+                    path: 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;
+            executeOnLayoutBeforeMeasurmentHook: (options: {
+                minimumWidth: number;
+            }) => void;
+            selectionTracker: {
+                track: (frameToTrack: HTMLIFrameElement) => void;
+                destroy: () => void;
+                isSelecting: () => boolean;
+                getSelection: () => Selection | undefined;
+                $: import("rxjs").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;
+                $: import("rxjs").Observable<{
+                    event: "fingermove";
+                    data: {
+                        x: number;
+                        y: number;
+                    };
+                } | {
+                    event: "fingerout";
+                    data: undefined;
+                }>;
+            };
+            $: {
+                contentLayoutChangeSubject$: import("rxjs").Observable<{
+                    isFirstLayout: boolean;
+                    isReady: boolean;
+                }>;
+                loaded$: import("rxjs").Observable<HTMLIFrameElement>;
+            };
+        }) | undefined);
+        getSpineItemFromIframe: (iframe: Element) => import("../spineItem/createSpineItem").SpineItem | undefined;
+        getSpineItemPageIndexFromNode: (node: Node, offset: number | undefined, spineItemOrIndex: number | import("../spineItem/createSpineItem").SpineItem) => number | undefined;
+        getSpineItemsFromReadingOrderPosition: (position: {
+            x: number;
+            y: number;
+        }) => {
+            left: number;
+            right: number;
+            begin: number;
+            beginPosition: {
+                x: number;
+                y: number;
+            };
+            end: number;
+            endPosition: {
+                x: number;
+                y: number;
+            };
+        } | undefined;
+    };
+    spineItemLocator: {
+        getSpineItemPositionFromNode: (node: Node, offset: number, spineItem: import("../spineItem/createSpineItem").SpineItem) => {
+            x: number;
+            y: number;
+        } | undefined;
+        getSpineItemPositionFromPageIndex: (pageIndex: number, spineItem: import("../spineItem/createSpineItem").SpineItem) => {
+            x: number;
+            y: number;
+        };
+        getSpineItemOffsetFromAnchor: (anchor: string, spineItem: import("../spineItem/createSpineItem").SpineItem) => number;
+        getSpineItemPageIndexFromPosition: (position: {
+            x: number;
+            y: number;
+        }, spineItem: import("../spineItem/createSpineItem").SpineItem) => number;
+        getSpineItemPageIndexFromNode: (node: Node, offset: number, spineItem: import("../spineItem/createSpineItem").SpineItem) => number | undefined;
+        getSpineItemClosestPositionFromUnsafePosition: (unsafePosition: {
+            x: number;
+            y: number;
+        }, spineItem: import("../spineItem/createSpineItem").SpineItem) => {
+            x: number;
+            y: number;
+        };
+        getFirstNodeOrRangeAtPage: (pageIndex: number, spineItem: import("../spineItem/createSpineItem").SpineItem) => {
+            node: Node;
+            offset: number;
+        } | undefined;
+    };
+    cfiLocator: {
+        getSpineItemFromCfi: (cfi: string) => ({
+            item: {
+                id: string;
+                href: string;
+                path: string;
+                renditionLayout: "reflowable" | "pre-paginated";
+                progressionWeight: number;
+                pageSpreadLeft: true | undefined;
+                pageSpreadRight: true | undefined;
+                mediaType?: string | undefined;
+            };
+        } & {
+            layout: (layoutInformation: {
+                blankPagePosition: "after" | "before" | "none";
+                minimumWidth: number;
+                spreadPosition: "right" | "left" | "none";
+            }) => {
+                width: number;
+                height: number;
+            };
+            load: () => void;
+            adjustPositionOfElement: ({ right, left, top }: {
+                right?: number | undefined;
+                left?: number | undefined;
+                top?: number | undefined;
+            }) => void;
+            createLoadingElement: (containerElement: HTMLElement, item: {
+                id: string;
+                href: string;
+                path: string;
+                renditionLayout: "reflowable" | "pre-paginated";
+                progressionWeight: number;
+                pageSpreadLeft: true | undefined;
+                pageSpreadRight: true | undefined;
+                mediaType?: string | undefined;
+            }, context: {
+                load: (newManifest: import("@prose-reader/shared").Manifest, newLoadOptions: import("../types").LoadOptions) => void;
+                isRTL: () => boolean;
+                areAllItemsPrePaginated: () => boolean;
+                destroy: () => void;
+                getLoadOptions: () => import("../types").LoadOptions | undefined;
+                getCalculatedInnerMargin: () => number;
+                getVisibleAreaRect: () => {
+                    width: number;
+                    height: number;
+                    x: number;
+                    y: number;
+                };
+                shouldDisplaySpread: () => boolean;
+                setHasVerticalWriting: () => void;
+                setVisibleAreaRect: (x: number, y: number, width: number, height: number) => void;
+                getManifest: () => import("@prose-reader/shared").Manifest | undefined;
+                getReadingDirection: () => "ltr" | "rtl" | undefined;
+                getPageSize: () => {
+                    width: number;
+                    height: number;
+                };
+                getSettings: () => import("../settings").PublicSettings & {
+                    computedPageTurnMode: "controlled" | "scrollable";
+                    computedPageTurnDirection: "vertical" | "horizontal";
+                    computedPageTurnAnimation: "none" | "fade" | "slide";
+                    computedPageTurnAnimationDuration: number;
+                    computedSnapAnimationDuration: number;
+                };
+                setSettings: (data: Partial<import("../settings").PublicSettings>) => void;
+                $: {
+                    hasVerticalWriting$: import("rxjs").Observable<boolean>;
+                    destroy$: import("rxjs").Observable<void>;
+                    settings$: import("rxjs").Observable<import("../settings").PublicSettings & {
+                        computedPageTurnMode: "controlled" | "scrollable";
+                        computedPageTurnDirection: "vertical" | "horizontal";
+                        computedPageTurnAnimation: "none" | "fade" | "slide";
+                        computedPageTurnAnimationDuration: number;
+                        computedSnapAnimationDuration: number;
+                    }>;
+                    load$: import("rxjs").Observable<import("@prose-reader/shared").Manifest>;
+                };
+            }) => HTMLDivElement;
+            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$: import("rxjs").Observable<void>;
+                    unloaded$: import("rxjs").Observable<void>;
+                    loaded$: import("rxjs").Observable<HTMLIFrameElement>;
+                    ready$: import("rxjs").Observable<FontFaceSet | undefined>;
+                    isReady$: import("rxjs").Observable<boolean>;
+                    contentLayoutChange$: import("rxjs").Observable<{
+                        isFirstLayout: boolean;
+                    } | {
+                        isFirstLayout: boolean;
+                    }>;
+                };
+            };
+            element: HTMLElement;
+            loadingElement: HTMLDivElement;
+            isReflowable: boolean;
+            getBoundingRectOfElementFromSelector: (selector: string) => DOMRect | undefined;
+            getViewPortInformation: () => {
+                computedScale: number;
+                computedWidthScale: number;
+                viewportDimensions: {
+                    width: number;
+                    height: number;
+                };
+            } | {
+                width?: number | undefined;
+                height?: number | undefined;
+                computedScale: number;
+                computedWidthScale: number;
+                viewportDimensions?: undefined;
+            };
+            isImageType: () => boolean | undefined;
+            isReady: () => boolean;
+            destroy: () => void;
+            isUsingVerticalWriting: () => boolean | undefined;
+            getReadingDirection: () => "ltr" | "rtl" | undefined;
+            manipulateSpineItem: (cb: (options: {
+                container: HTMLElement;
+                loadingElement: HTMLElement;
+                item: {
+                    id: string;
+                    href: string;
+                    path: 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;
+            executeOnLayoutBeforeMeasurmentHook: (options: {
+                minimumWidth: number;
+            }) => void;
+            selectionTracker: {
+                track: (frameToTrack: HTMLIFrameElement) => void;
+                destroy: () => void;
+                isSelecting: () => boolean;
+                getSelection: () => Selection | undefined;
+                $: import("rxjs").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;
+                $: import("rxjs").Observable<{
+                    event: "fingermove";
+                    data: {
+                        x: number;
+                        y: number;
+                    };
+                } | {
+                    event: "fingerout";
+                    data: undefined;
+                }>;
+            };
+            $: {
+                contentLayoutChangeSubject$: import("rxjs").Observable<{
+                    isFirstLayout: boolean;
+                    isReady: boolean;
+                }>;
+                loaded$: import("rxjs").Observable<HTMLIFrameElement>;
+            };
+        }) | undefined;
+        getCfiMetaInformation: (cfi: string) => {
+            spineItemIndex: number | undefined;
+        } | undefined;
+        getCfi: ((pageIndex: number, spineItem: import("../spineItem/createSpineItem").SpineItem) => string) | ((pageIndex: number, spineItem: import("../spineItem/createSpineItem").SpineItem) => string);
+        getRootCfi: (spineItem: import("../spineItem/createSpineItem").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: {
+            id: string;
+            href: string;
+            path: string;
+            renditionLayout: "reflowable" | "pre-paginated";
+            progressionWeight: number;
+            pageSpreadLeft: true | undefined;
+            pageSpreadRight: true | undefined;
+            mediaType?: string | undefined;
+        }) => {
+            start: string;
+            end: string;
+        };
+    };
+    normalizeEventForViewport: <E extends MouseEvent | TouchEvent | PointerEvent>(event: E) => E;
+    manipulateSpineItems: (cb: (payload: ManipulableSpineItemCallbackPayload & {
+        index: number;
+    }) => RequireLayout) => void;
+    layout: () => void;
+    destroy: () => void;
+    isSelecting: () => boolean | undefined;
+    getSelection: () => Selection | undefined;
+    $: {
+        $: import("rxjs").Observable<Event>;
+        viewportState$: import("rxjs").Observable<"free" | "busy">;
+        layout$: import("rxjs").Observable<boolean>;
+    };
+};
+export declare type Spine = ReturnType<typeof createSpine>;
+export {};