@prose-reader/core 1.196.0 → 1.198.0

package/dist/index.js

@@ -1,4 +1,4 @@
-import { switchMap, of, fromEvent, take, map, from, takeUntil, Observable, defer, Subject, combineLatest, merge, EMPTY, withLatestFrom, NEVER, tap as tap$1, share, BehaviorSubject, filter, first as first$1, mergeMap, endWith, finalize, catchError, lastValueFrom, scheduled, animationFrameScheduler, distinctUntilChanged as distinctUntilChanged$1, throttleTime, debounceTime as debounceTime$1, startWith as startWith$1, switchScan, forkJoin, shareReplay as shareReplay$1, delay, ReplaySubject, identity, timer, skip as skip$1, exhaustMap, reduce, concatMap } from "rxjs";
+import { switchMap, of, fromEvent, take, map, from, takeUntil, Observable, defer, Subject, combineLatest, merge, EMPTY, withLatestFrom, NEVER, tap as tap$1, share, BehaviorSubject, filter, first as first$1, mergeMap, endWith, finalize, catchError, lastValueFrom, scheduled, animationFrameScheduler, shareReplay as shareReplay$1, distinctUntilChanged as distinctUntilChanged$1, throttleTime, debounceTime as debounceTime$1, startWith as startWith$1, switchScan, forkJoin, delay, ReplaySubject, identity, timer, skip as skip$1, exhaustMap, reduce, concatMap } from "rxjs";
 import { switchMap as switchMap$1, first, map as map$1, startWith, shareReplay, distinctUntilChanged, tap, pairwise, take as take$1, takeUntil as takeUntil$1, filter as filter$1, debounceTime, skip, mergeMap as mergeMap$1, catchError as catchError$1, withLatestFrom as withLatestFrom$1 } from "rxjs/operators";
 import { shallowMergeIfDefined, isShallowEqual, getParentPath, parseContentType, detectMimeTypeFromName, arrayEqual } from "@prose-reader/shared";
 import { isShallowEqual as isShallowEqual2 } from "@prose-reader/shared";
@@ -2141,6 +2141,92 @@ const fixReflowable = (reader) => {
     }
   );
 };
+class SpineElementLayout {
+  constructor(layout) {
+    this.left = layout.left;
+    this.right = layout.right;
+    this.top = layout.top;
+    this.bottom = layout.bottom;
+    this.width = layout.width;
+    this.height = layout.height;
+    this.x = layout.x;
+    this.y = layout.y;
+  }
+}
+class SpineItemSpineLayout extends SpineElementLayout {
+  constructor() {
+    super(...arguments);
+    this.__symbol = Symbol(`SpineItemSpineLayout`);
+  }
+}
+class SpineItemPageSpineLayout extends SpineElementLayout {
+  constructor() {
+    super(...arguments);
+    this.__symbol = Symbol(`SpineItemPageSpineLayout`);
+  }
+}
+class SpinePosition {
+  constructor(position) {
+    this.__symbol = Symbol(`SpinePosition`);
+    this.x = position.x;
+    this.y = position.y;
+  }
+}
+const spinePositionToSpineItemSpineLayout = ({
+  position,
+  pageSize
+}) => {
+  return new SpineItemPageSpineLayout({
+    x: position.x,
+    y: position.y,
+    left: position.x,
+    top: position.y,
+    width: pageSize.width,
+    height: pageSize.height,
+    bottom: position.y + pageSize.height,
+    right: position.x + pageSize.width
+  });
+};
+const createLayoutInfo = (reader) => {
+  const layout$ = reader.spine.spineLayout.layout$.pipe(
+    map(() => {
+      const items = reader.spine.spineItemsManager.items;
+      const pages = items.reduce((acc, spineItem, itemIndex) => {
+        const pages2 = new Array(spineItem.numberOfPages).fill(void 0);
+        const pagesAbsolutePositions = pages2.map((_, pageIndex) => {
+          const pageSpineItemPosition = reader.spine.spineItemLocator.getSpineItemPositionFromPageIndex({
+            spineItem,
+            pageIndex
+          });
+          const pageSpinePosition = reader.spine.locator.getSpinePositionFromSpineItemPosition({
+            spineItem,
+            spineItemPosition: pageSpineItemPosition
+          });
+          return spinePositionToSpineItemSpineLayout({
+            pageSize: reader.context.getPageSize(),
+            position: pageSpinePosition
+          });
+        });
+        const itemPagesInfo = pagesAbsolutePositions.map((absolutePosition, pageIndex) => ({
+          itemIndex,
+          absolutePageIndex: itemIndex + pageIndex,
+          absolutePosition
+        }));
+        return [...acc, ...itemPagesInfo];
+      }, []);
+      return {
+        pages
+      };
+    }),
+    tap$1((layout) => {
+      Report.log(`layout:info`, layout);
+    }),
+    share()
+  );
+  const info$ = layout$.pipe(shareReplay$1({ refCount: true, bufferSize: 1 }));
+  info$.pipe(takeUntil(reader.$.destroy$)).subscribe();
+  return { layout$, info$ };
+};
 const layoutEnhancer = (next) => (options) => {
   const {
     pageHorizontalMargin,
@@ -2275,6 +2361,7 @@ const layoutEnhancer = (next) => (options) => {
       }
     })
   );
+  const { layout$, info$ } = createLayoutInfo(reader);
   merge(
     updateSpineItemClassName$,
     revealItemOnReady$,
@@ -2287,7 +2374,9 @@ const layoutEnhancer = (next) => (options) => {
       settingsManager.destroy();
       reader.destroy();
     },
-    settings: settingsManager
+    settings: settingsManager,
+    layout$,
+    layoutInfo$: info$
   };
 };
 const HTML_PREFIX = `${HTML_PREFIX$1}-enhancer-loading`;
@@ -2358,7 +2447,10 @@ const loadingEnhancer = (next) => (options) => {
       return acc;
     }, {})
   );
-  const updateEntriesLayout$ = (entries) => combineLatest([reader.layout$, reader.theme.$.theme$]).pipe(
+  const updateEntriesLayout$ = (entries) => combineLatest([
+    reader.spine.spineLayout.layout$,
+    reader.theme.$.theme$
+  ]).pipe(
     map$1(([, theme]) => ({
       width: reader.context.state.visibleAreaRect.width,
       theme
@@ -2594,6 +2686,13 @@ const handleLinksNavigation = (reader, manualNavigator) => {
   );
 };
 const report$4 = Report.namespace(`navigation`);
+class SpineItemPosition {
+  constructor(position) {
+    this.__symbol = Symbol(`SpineItemPosition`);
+    this.x = position.x;
+    this.y = position.y;
+  }
+}
 const getSpineItemPositionForLeftPage = ({
   position,
   spineItem,
@@ -2601,15 +2700,15 @@ const getSpineItemPositionForLeftPage = ({
   pageWidth,
   spineItemLocator
 }) => {
-  let nextPotentialPosition = {
+  let nextPotentialPosition = new SpineItemPosition({
     x: position.x - pageWidth,
     y: position.y
-  };
+  });
   if (spineItem.isUsingVerticalWriting()) {
-    nextPotentialPosition = {
+    nextPotentialPosition = new SpineItemPosition({
       x: position.x,
       y: position.y + pageHeight
-    };
+    });
   }
   const navigationPosition = spineItemLocator.getSpineItemClosestPositionFromUnsafePosition(
     nextPotentialPosition,
@@ -2710,15 +2809,15 @@ const getSpineItemPositionForRightPage = ({
   pageWidth,
   spineItemLocator
 }) => {
-  let nextPotentialPosition = {
+  let nextPotentialPosition = new SpineItemPosition({
     x: position.x + pageWidth,
     y: position.y
-  };
+  });
   if (spineItem.isUsingVerticalWriting()) {
-    nextPotentialPosition = {
+    nextPotentialPosition = new SpineItemPosition({
       x: position.x,
       y: position.y - pageHeight
-    };
+    });
   }
   const navigationPosition = spineItemLocator.getSpineItemClosestPositionFromUnsafePosition(
     nextPotentialPosition,
@@ -3158,7 +3257,7 @@ const navigationEnhancer = (next) => (options) => {
     }
   };
 };
-const NAMESPACE$6 = `paginationEnhancer`;
+const NAMESPACE$5 = `paginationEnhancer`;
 const consolidate = (item, reader) => {
   var _a;
   let itemPageIndex = (_a = item.meta) == null ? void 0 : _a.itemPageIndex;
@@ -3214,7 +3313,7 @@ const consolidate = (item, reader) => {
 const createLocator = (reader) => (resources) => {
   return deferIdle(() => {
     if (!resources.length) return of(resources);
-    const consolidate$ = reader.layout$.pipe(
+    const consolidate$ = reader.spine.spineLayout.layout$.pipe(
       debounceTime$1(10),
       startWith$1(null),
       switchScan((acc$) => {
@@ -3309,7 +3408,7 @@ const getTotalProgressFromPercentages = (estimateBeforeThisItem, currentItemWeig
 const getScrollPercentageWithinItem = (reader, currentPosition, currentItem) => {
   const context = reader.context;
   const { height, width } = currentItem.layout.layoutInfo;
-  const { top, left } = reader.spine.spineLayout.getSpineItemRelativeLayoutInfo(currentItem);
+  const { top, left } = reader.spine.spineLayout.getSpineItemSpineLayoutInfo(currentItem);
   if (reader.settings.values.computedPageTurnDirection === `vertical`) {
     return Math.max(
       0,
@@ -3371,29 +3470,22 @@ const getPercentageEstimate = (reader, currentSpineIndex, pageIndex, currentPosi
     })
   );
 };
-const getNumberOfPagesForAllSpineItems = (reader) => reader.spineItemsManager.items.map((item) => {
-  const { height, width } = item.layout.layoutInfo;
-  return reader.spine.spineItemLocator.getSpineItemNumberOfPages({
-    isUsingVerticalWriting: !!item.isUsingVerticalWriting(),
-    itemHeight: height,
-    itemWidth: width
-  });
-}, 0);
 const trackTotalPages = (reader) => {
-  const totalPages$ = reader.layout$.pipe(
+  const totalPages$ = reader.spine.spineLayout.layout$.pipe(
     debounceTime$1(10, animationFrameScheduler),
     withLatestFrom(reader.pagination.state$),
     map(() => {
-      const numberOfPagesPerItems = getNumberOfPagesForAllSpineItems(reader);
       return {
-        numberOfPagesPerItems,
+        numberOfPagesPerItems: reader.spineItemsManager.items.reduce(
+          (acc, item) => {
+            return [...acc, item.numberOfPages];
+          },
+          []
+        ),
         /**
          * This may be not accurate for reflowable due to dynamic load / unload.
          */
-        numberOfTotalPages: numberOfPagesPerItems.reduce(
-          (acc, numberOfPagesForItem) => acc + numberOfPagesForItem,
-          0
-        )
+        numberOfTotalPages: reader.spine.spineLayout.numberOfPages
       };
     }),
     distinctUntilChanged$1(isShallowEqual),
@@ -3520,7 +3612,7 @@ const trackPaginationInfo = (reader) => {
   );
   return { paginationInfo$, getPaginationInfo: () => currentValue.value };
 };
-Report.namespace(NAMESPACE$6);
+Report.namespace(NAMESPACE$5);
 const paginationEnhancer = (next) => (options) => {
   const reader = next(options);
   const { paginationInfo$, getPaginationInfo } = trackPaginationInfo(reader);
@@ -5481,10 +5573,10 @@ const getSpineItemPositionFromPageIndex = ({
       pageIndex,
       itemLayout.height
     );
-    return {
+    return new SpineItemPosition({
       x: 0,
       y: ltrRelativeOffset2
-    };
+    });
   }
   const ltrRelativeOffset = getItemOffsetFromPageIndex(
     context.getPageSize().width,
@@ -5492,15 +5584,15 @@ const getSpineItemPositionFromPageIndex = ({
     itemLayout.width
   );
   if (context.isRTL()) {
-    return {
+    return new SpineItemPosition({
       x: itemLayout.width - ltrRelativeOffset - context.getPageSize().width,
       y: 0
-    };
+    });
   }
-  return {
+  return new SpineItemPosition({
     x: ltrRelativeOffset,
     y: 0
-  };
+  });
 };
 const getSpineItemPagesPosition = ({
   context,
@@ -5532,7 +5624,7 @@ const createSpineItemLocator = ({
     itemWidth,
     itemHeight,
     spineItemPosition
-  }) => ({
+  }) => new SpineItemPosition({
     x: Math.min(itemWidth, Math.max(0, spineItemPosition.x)),
     y: Math.min(itemHeight, Math.max(0, spineItemPosition.y))
   });
@@ -5580,7 +5672,7 @@ const createSpineItemLocator = ({
         pageWidth,
         spineItemWidth
       );
-      return { x: val, y: 0 };
+      return new SpineItemPosition({ x: val, y: 0 });
     }
     return void 0;
   };
@@ -5612,7 +5704,7 @@ const createSpineItemLocator = ({
   };
   const getSpineItemClosestPositionFromUnsafePosition = (unsafePosition, spineItem) => {
     const { width, height } = spineItem.layout.layoutInfo;
-    const adjustedPosition = {
+    const adjustedPosition = new SpineItemPosition({
       x: getClosestValidOffsetFromApproximateOffsetInPages(
         unsafePosition.x,
         context.getPageSize().width,
@@ -5623,7 +5715,7 @@ const createSpineItemLocator = ({
         context.getPageSize().height,
         height
       )
-    };
+    });
     return adjustedPosition;
   };
   const getSpineItemPageIndexFromNode = (node, offset, spineItem) => {
@@ -5649,12 +5741,11 @@ const createSpineItemLocator = ({
     getSpineItemPositionFromNode,
     getSpineItemPositionFromPageIndex: ({
       pageIndex,
-      itemLayout,
-      isUsingVerticalWriting
+      spineItem
     }) => getSpineItemPositionFromPageIndex({
       context,
-      isUsingVerticalWriting,
-      itemLayout,
+      isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
+      itemLayout: spineItem.layout.layoutInfo,
       pageIndex
     }),
     getSpineItemPageIndexFromPosition,
@@ -5668,12 +5759,7 @@ const createSpineItemLocator = ({
         settings,
         itemLayout: item.layout.layoutInfo
       });
-    },
-    getSpineItemNumberOfPages: (params) => getSpineItemNumberOfPages({
-      context,
-      settings,
-      ...params
-    })
+    }
   };
 };
 const createNavigationResolver$1 = ({
@@ -5682,16 +5768,10 @@ const createNavigationResolver$1 = ({
 }) => {
   const spineItemLocator = createSpineItemLocator({ context, settings });
   const getNavigationForLastPage = (spineItem) => {
-    const { height, width } = spineItem.layout.layoutInfo;
-    const numberOfPages = spineItemLocator.getSpineItemNumberOfPages({
-      isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
-      itemHeight: height,
-      itemWidth: width
-    });
+    const numberOfPages = spineItem.numberOfPages;
     return spineItemLocator.getSpineItemPositionFromPageIndex({
       pageIndex: numberOfPages - 1,
-      isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
-      itemLayout: spineItem.layout.layoutInfo
+      spineItem
     });
   };
   const getNavigationFromNode = (spineItem, node, offset) => {
@@ -5700,7 +5780,7 @@ const createNavigationResolver$1 = ({
       offset,
       spineItem
     );
-    return position || { x: 0, y: 0 };
+    return position || new SpineItemPosition({ x: 0, y: 0 });
   };
   const getNavigationForPosition2 = (spineItem, position) => {
     const potentiallyCorrectedPosition = spineItemLocator.getSpineItemClosestPositionFromUnsafePosition(
@@ -5735,7 +5815,7 @@ const getAdjustedPositionWithSafeEdge = ({
   const lastSpineItem = spineItemsManager.get(
     spineItemsManager.items.length - 1
   );
-  const distanceOfLastSpineItem = spineLayout.getSpineItemRelativeLayoutInfo(
+  const distanceOfLastSpineItem = spineLayout.getSpineItemSpineLayoutInfo(
     lastSpineItem || 0
   );
   const maximumYOffset = distanceOfLastSpineItem.bottom - pageSizeHeight;
@@ -5752,6 +5832,66 @@ const getAdjustedPositionWithSafeEdge = ({
     y
   };
 };
+const getNavigationForPosition = ({
+  viewportPosition,
+  spineLocator,
+  context,
+  spineItemNavigationResolver
+}) => {
+  const spineItem = spineLocator.getSpineItemFromPosition(viewportPosition);
+  if (spineItem) {
+    const spineItemPosition = spineLocator.getSpineItemPositionFromSpinePosition(
+      viewportPosition,
+      spineItem
+    );
+    const spineItemValidPosition = spineItemNavigationResolver.getNavigationForPosition(
+      spineItem,
+      spineItemPosition
+    );
+    const viewportNavigation = spineLocator.getSpinePositionFromSpineItemPosition({
+      spineItemPosition: spineItemValidPosition,
+      spineItem
+    });
+    return getAdjustedPositionForSpread({
+      position: viewportNavigation,
+      pageSizeWidth: context.getPageSize().width,
+      visibleAreaRectWidth: context.state.visibleAreaRect.width
+    });
+  }
+  return { x: 0, y: 0 };
+};
+const getNavigationForSpineItemPage = ({
+  pageIndex,
+  spineItemsManager,
+  spineItemId,
+  context,
+  spineLocator,
+  spineItemNavigationResolver
+}) => {
+  const spineItem = spineItemsManager.get(spineItemId);
+  if (!spineItem) {
+    const xPositionForPageIndex = pageIndex * context.getPageSize().width;
+    return getNavigationForPosition({
+      viewportPosition: { x: xPositionForPageIndex, y: 0 },
+      context,
+      spineItemNavigationResolver,
+      spineLocator
+    });
+  }
+  const spineItemNavigation = spineLocator.spineItemLocator.getSpineItemPositionFromPageIndex({
+    pageIndex,
+    spineItem
+  });
+  const readingOffset = spineLocator.getSpinePositionFromSpineItemPosition({
+    spineItemPosition: spineItemNavigation,
+    spineItem
+  });
+  return getAdjustedPositionForSpread({
+    position: readingOffset,
+    pageSizeWidth: context.getPageSize().width,
+    visibleAreaRectWidth: context.state.visibleAreaRect.width
+  });
+};
 const getSpineItemOffsetFromAnchor = ({
   anchor,
   spineItem,
@@ -5780,7 +5920,7 @@ const getSpinePositionFromSpineItemAnchor = ({
     context
   });
   const position = spineLocator.getSpinePositionFromSpineItemPosition({
-    spineItemPosition: { x: spineItemOffset, y: 0 },
+    spineItemPosition: new SpineItemPosition({ x: spineItemOffset, y: 0 }),
     spineItem
   });
   return position;
@@ -5868,68 +6008,7 @@ const getNavigationFromSpineItemPosition = ({
     visibleAreaRectWidth: context.state.visibleAreaRect.width
   });
 };
-const getNavigationForPosition = ({
-  viewportPosition,
-  spineLocator,
-  context,
-  spineItemNavigationResolver
-}) => {
-  const spineItem = spineLocator.getSpineItemFromPosition(viewportPosition);
-  if (spineItem) {
-    const spineItemPosition = spineLocator.getSpineItemPositionFromSpinePosition(
-      viewportPosition,
-      spineItem
-    );
-    const spineItemValidPosition = spineItemNavigationResolver.getNavigationForPosition(
-      spineItem,
-      spineItemPosition
-    );
-    const viewportNavigation = spineLocator.getSpinePositionFromSpineItemPosition({
-      spineItemPosition: spineItemValidPosition,
-      spineItem
-    });
-    return getAdjustedPositionForSpread({
-      position: viewportNavigation,
-      pageSizeWidth: context.getPageSize().width,
-      visibleAreaRectWidth: context.state.visibleAreaRect.width
-    });
-  }
-  return { x: 0, y: 0 };
-};
-const getNavigationForSpineItemPage = ({
-  pageIndex,
-  spineItemsManager,
-  spineItemId,
-  context,
-  spineLocator,
-  spineItemNavigationResolver
-}) => {
-  const spineItem = spineItemsManager.get(spineItemId);
-  if (!spineItem) {
-    const xPositionForPageIndex = pageIndex * context.getPageSize().width;
-    return getNavigationForPosition({
-      viewportPosition: { x: xPositionForPageIndex, y: 0 },
-      context,
-      spineItemNavigationResolver,
-      spineLocator
-    });
-  }
-  const spineItemNavigation = spineLocator.spineItemLocator.getSpineItemPositionFromPageIndex({
-    pageIndex,
-    isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
-    itemLayout: spineItem.layout.layoutInfo
-  });
-  const readingOffset = spineLocator.getSpinePositionFromSpineItemPosition({
-    spineItemPosition: spineItemNavigation,
-    spineItem
-  });
-  return getAdjustedPositionForSpread({
-    position: readingOffset,
-    pageSizeWidth: context.getPageSize().width,
-    visibleAreaRectWidth: context.state.visibleAreaRect.width
-  });
-};
-const NAMESPACE$5 = `spineNavigator`;
+const NAMESPACE$4 = `spineNavigator`;
 const createNavigationResolver = ({
   context,
   spineItemsManager,
@@ -5947,10 +6026,10 @@ const createNavigationResolver = ({
       spineItemsManager
     }) || {};
     if (!spineItem) {
-      Report.warn(NAMESPACE$5, `unable to detect item id from cfi ${cfi}`);
+      Report.warn(NAMESPACE$4, `unable to detect item id from cfi ${cfi}`);
       return void 0;
     }
-    const spineItemNavigation = node ? spineItemNavigator.getNavigationFromNode(spineItem, node, offset) : { x: 0, y: 0 };
+    const spineItemNavigation = node ? spineItemNavigator.getNavigationFromNode(spineItem, node, offset) : new SpineItemPosition({ x: 0, y: 0 });
     const readingPosition = locator.getSpinePositionFromSpineItemPosition({
       spineItemPosition: spineItemNavigation,
       spineItem
@@ -6091,8 +6170,8 @@ const getScaledDownPosition = ({
   };
   return scaledDownPosition;
 };
-const NAMESPACE$4 = `navigation/ViewportNavigator`;
-const report$3 = Report.namespace(NAMESPACE$4);
+const NAMESPACE$3 = `navigation/ViewportNavigator`;
+const report$3 = Report.namespace(NAMESPACE$3);
 class ViewportNavigator extends DestroyableClass {
   constructor(settings, viewportElement$, hookManager, context, spine) {
     super();
@@ -6298,8 +6377,8 @@ class Locker {
   }
 }
 const SCROLL_FINISHED_DEBOUNCE_TIMEOUT = 500;
-const NAMESPACE$3 = `navigation/UserNavigator`;
-const report$2 = Report.namespace(NAMESPACE$3);
+const NAMESPACE$2 = `navigation/UserNavigator`;
+const report$2 = Report.namespace(NAMESPACE$2);
 class UserNavigator extends DestroyableClass {
   constructor(settings, element$, context, scrollHappeningFromBrowser$, spine) {
     super();
@@ -6628,7 +6707,7 @@ const withSpineItem = ({
 const withSpineItemLayoutInfo = ({ spine }) => (stream) => {
   return stream.pipe(
     switchMap(({ navigation, ...rest }) => {
-      const spineItemDimensions = spine.spineLayout.getSpineItemRelativeLayoutInfo(navigation.spineItem);
+      const spineItemDimensions = spine.spineLayout.getSpineItemSpineLayoutInfo(navigation.spineItem);
       const spineItem = spine.spineItemsManager.get(navigation.spineItem);
       return ((spineItem == null ? void 0 : spineItem.isReady$) ?? of(false)).pipe(
         first$1(),
@@ -6681,8 +6760,7 @@ const withSpineItemPosition = ({
       const beginPageIndexForDirection = (navigation.directionFromLastNavigation === "forward" || navigation.directionFromLastNavigation === "anchor" ? visiblePagesAtNavigablePosition == null ? void 0 : visiblePagesAtNavigablePosition.beginPageIndex : visiblePagesAtNavigablePosition == null ? void 0 : visiblePagesAtNavigablePosition.endPageIndex) ?? 0;
       const positionInSpineItem = spineLocator.spineItemLocator.getSpineItemPositionFromPageIndex({
         pageIndex: beginPageIndexForDirection,
-        isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
-        itemLayout: spineItem.layout.layoutInfo
+        spineItem
       });
       return positionInSpineItem;
     }
@@ -6743,7 +6821,7 @@ const restoreNavigationForControlledPageTurnMode = ({
     first$1(),
     map((isReady) => {
       var _a, _b;
-      const spineItemAbsolutePosition = spineLayout.getSpineItemRelativeLayoutInfo(spineItem);
+      const spineItemAbsolutePosition = spineLayout.getSpineItemSpineLayoutInfo(spineItem);
       const isPositionWithinSpineItem = spineLocator.isPositionWithinSpineItem(
         navigation.position,
         spineItem
@@ -6775,10 +6853,10 @@ const restoreNavigationForControlledPageTurnMode = ({
         }
       }
       if (isPositionWithinSpineItem && hasSpineItemGrewOrShrink && navigation.directionFromLastNavigation === "backward") {
-        const positionInSpineItemWithDifference = {
+        const positionInSpineItemWithDifference = new SpineItemPosition({
           x: (((_a = navigation.positionInSpineItem) == null ? void 0 : _a.x) ?? 0) + spineItemWidthDifference,
           y: (((_b = navigation.positionInSpineItem) == null ? void 0 : _b.y) ?? 0) + spineItemHeighDifference
-        };
+        });
         return navigationResolver.getNavigationFromSpineItemPosition({
           spineItem,
           spineItemPosition: positionInSpineItemWithDifference
@@ -6813,15 +6891,16 @@ const restoreNavigationForScrollingPageTurnMode = ({
 }) => {
   const { spineItem } = navigation;
   const foundSpineItem = spineItemsManager.get(spineItem);
-  if (!foundSpineItem) return { x: 0, y: 0 };
-  const { height, top } = spineLayout.getSpineItemRelativeLayoutInfo(foundSpineItem);
+  if (!foundSpineItem) return new SpinePosition({ x: 0, y: 0 });
+  const { height, top } = spineLayout.getSpineItemSpineLayoutInfo(foundSpineItem);
   const isPositionWithinSpineItem = spineLocator.isPositionWithinSpineItem(
     navigation.position,
     foundSpineItem
   );
-  const positionInSpineItem = navigation.positionInSpineItem ?? {
-    y: 0
-  };
+  const positionInSpineItem = navigation.positionInSpineItem ?? new SpineItemPosition({
+    y: 0,
+    x: 0
+  });
   if (settings.values.computedPageTurnDirection === "vertical") {
     if (top === navigation.spineItemTop && height === navigation.spineItemHeight && isPositionWithinSpineItem) {
       return navigation.position;
@@ -6831,10 +6910,10 @@ const restoreNavigationForScrollingPageTurnMode = ({
     }
     if (top !== navigation.spineItemTop) {
       const positionInSpineItem2 = spineLocator.getSafeSpineItemPositionFromUnsafeSpineItemPosition(
-        navigation.positionInSpineItem ?? {
+        navigation.positionInSpineItem ?? new SpineItemPosition({
           x: 0,
           y: 0
-        },
+        }),
         foundSpineItem
       );
       return spineLocator.getSpinePositionFromSpineItemPosition({
@@ -6844,10 +6923,10 @@ const restoreNavigationForScrollingPageTurnMode = ({
     }
     if (top === navigation.spineItemTop && height !== navigation.spineItemHeight) {
       const positionYfromBottomPreviousNavigation = (navigation.spineItemHeight ?? positionInSpineItem.y) - positionInSpineItem.y;
-      const positionInspineItem = {
+      const positionInspineItem = new SpineItemPosition({
         y: navigation.directionFromLastNavigation === "backward" ? height - positionYfromBottomPreviousNavigation : positionInSpineItem.y,
         x: navigation.position.x
-      };
+      });
       if (isPositionWithinSpineItem) {
         const positionInSpineItem2 = spineLocator.getSafeSpineItemPositionFromUnsafeSpineItemPosition(
           positionInspineItem,
@@ -6861,10 +6940,10 @@ const restoreNavigationForScrollingPageTurnMode = ({
       if (!isPositionWithinSpineItem) {
         const positionIsBeforeItem = navigation.position.y < top;
         if (!positionIsBeforeItem) {
-          const positionInItem = {
+          const positionInItem = new SpineItemPosition({
             y: height - positionYfromBottomPreviousNavigation,
             x: navigation.position.x
-          };
+          });
           return spineLocator.getSpinePositionFromSpineItemPosition({
             spineItemPosition: spineLocator.getSafeSpineItemPositionFromUnsafeSpineItemPosition(
               positionInItem,
@@ -6933,8 +7012,8 @@ const withRestoredPosition = ({
     );
   })
 );
-const NAMESPACE$2 = `navigation/InternalNavigator`;
-const report$1 = Report.namespace(NAMESPACE$2);
+const NAMESPACE$1 = `navigation/InternalNavigator`;
+const report$1 = Report.namespace(NAMESPACE$1);
 class InternalNavigator extends DestroyableClass {
   constructor(settings, context, userNavigation$, viewportController, navigationResolver, spine, element$, isUserLocked$) {
     super();
@@ -6948,7 +7027,7 @@ class InternalNavigator extends DestroyableClass {
     this.isUserLocked$ = isUserLocked$;
     this.navigationSubject = new BehaviorSubject({
       animation: false,
-      position: { x: 0, y: 0 },
+      position: new SpinePosition({ x: 0, y: 0 }),
       meta: {
         triggeredBy: "user"
       },
@@ -7290,8 +7369,8 @@ const createNavigator = ({
     getElement: () => element$.getValue()
   };
 };
-const NAMESPACE$1 = `pagination`;
-const report = Report.namespace(NAMESPACE$1);
+const NAMESPACE = `pagination`;
+const report = Report.namespace(NAMESPACE);
 class Pagination extends DestroyableClass {
   constructor(context, spineItemsManager) {
     super();
@@ -7381,18 +7460,8 @@ class PaginationController extends DestroyableClass {
             const shouldUpdateEndCfi = previousPagination.endSpineItemIndex !== endSpineItemIndex || endLastCfi === void 0 || isRootCfi(endLastCfi);
             const beginCfi = shouldUpdateBeginCfi ? getRootCfi(beginSpineItem) : beginLastCfi;
             const endCfi = shouldUpdateEndCfi ? getRootCfi(endSpineItem) : endLastCfi;
-            const beginSpineItemDimensions = beginSpineItem.layout.layoutInfo;
-            const beginNumberOfPagesInSpineItem = this.spineItemLocator.getSpineItemNumberOfPages({
-              itemHeight: beginSpineItemDimensions.height,
-              itemWidth: beginSpineItemDimensions.width,
-              isUsingVerticalWriting: !!beginSpineItem.isUsingVerticalWriting()
-            });
-            const endSpineItemDimensions = endSpineItem.layout.layoutInfo;
-            const endNumberOfPagesInSpineItem = this.spineItemLocator.getSpineItemNumberOfPages({
-              itemHeight: endSpineItemDimensions.height,
-              itemWidth: endSpineItemDimensions.width,
-              isUsingVerticalWriting: !!endSpineItem.isUsingVerticalWriting()
-            });
+            const beginNumberOfPagesInSpineItem = beginSpineItem.numberOfPages;
+            const endNumberOfPagesInSpineItem = endSpineItem.numberOfPages;
             this.pagination.update({
               beginCfi,
               beginNumberOfPagesInSpineItem,
@@ -7565,10 +7634,7 @@ class ReaderSettingsManager extends SettingsManager3 {
 const getAbsolutePageIndexFromPageIndex = ({
   pageIndex,
   spineItemOrId,
-  spineLayout,
-  spineItemsManager,
-  context,
-  settings
+  spineItemsManager
 }) => {
   const items = spineItemsManager.items;
   const spineItem = spineItemsManager.get(spineItemOrId);
@@ -7576,14 +7642,7 @@ const getAbsolutePageIndexFromPageIndex = ({
   const { currentAbsolutePage } = items.reduce(
     (acc, item) => {
       if (acc.found) return acc;
-      const itemLayout = spineLayout.getSpineItemRelativeLayoutInfo(item);
-      const numberOfPages = getSpineItemNumberOfPages({
-        isUsingVerticalWriting: !!item.isUsingVerticalWriting(),
-        itemHeight: itemLayout.height,
-        itemWidth: itemLayout.width,
-        context,
-        settings
-      });
+      const numberOfPages = item.numberOfPages;
       if (spineItem === item) {
         if (pageIndex <= numberOfPages - 1) {
           return {
@@ -7677,23 +7736,13 @@ const getItemVisibilityForPosition = ({
 };
 const getSpineInfoFromAbsolutePageIndex = ({
   absolutePageIndex,
-  spineLayout,
-  spineItemsManager,
-  context,
-  settings
+  spineItemsManager
 }) => {
   const items = spineItemsManager.items;
   const { found, currentAbsolutePage } = items.reduce(
     (acc, item) => {
       if (acc.found) return acc;
-      const itemLayout = spineLayout.getSpineItemRelativeLayoutInfo(item);
-      const numberOfPages = getSpineItemNumberOfPages({
-        isUsingVerticalWriting: !!item.isUsingVerticalWriting(),
-        itemHeight: itemLayout.height,
-        itemWidth: itemLayout.width,
-        context,
-        settings
-      });
+      const numberOfPages = item.numberOfPages;
       const possiblePageIndex = absolutePageIndex - acc.currentAbsolutePage;
       const currentAbsolutePage2 = acc.currentAbsolutePage + numberOfPages;
       if (possiblePageIndex <= numberOfPages - 1) {
@@ -7727,7 +7776,7 @@ const getSpineItemFromPosition = ({
   settings
 }) => {
   const spineItem = spineItemsManager.items.find((item) => {
-    const { left, right, bottom, top } = spineLayout.getSpineItemRelativeLayoutInfo(item);
+    const { left, right, bottom, top } = spineLayout.getSpineItemSpineLayoutInfo(item);
     const isWithinXAxis = position.x >= left && position.x < right;
     if (settings.values.computedPageTurnDirection === `horizontal`) {
       return isWithinXAxis;
@@ -7743,10 +7792,10 @@ const getSpinePositionFromSpineItemPosition = ({
   spineItemPosition,
   itemLayout: { left, top }
 }) => {
-  return {
+  return new SpinePosition({
     x: left + spineItemPosition.x,
     y: top + spineItemPosition.y
-  };
+  });
 };
 const getVisibleSpineItemsFromPosition = ({
   position,
@@ -7765,7 +7814,7 @@ const getVisibleSpineItemsFromPosition = ({
   }) || spineItemsManager.get(0);
   const spineItemsVisible = spineItemsManager.items.reduce(
     (acc, spineItem) => {
-      const itemPosition = spineLayout.getSpineItemRelativeLayoutInfo(spineItem);
+      const itemPosition = spineLayout.getSpineItemSpineLayoutInfo(spineItem);
       const { visible } = getItemVisibilityForPosition({
         itemPosition,
         threshold,
@@ -7801,8 +7850,8 @@ const createSpineLocator = ({
     `getSpineItemPositionFromSpinePosition`,
     10,
     (position, spineItem) => {
-      const { left, top } = spineLayout.getSpineItemRelativeLayoutInfo(spineItem);
-      return {
+      const { left, top } = spineLayout.getSpineItemSpineLayoutInfo(spineItem);
+      return new SpineItemPosition({
         /**
          * when using spread the item could be on the right and therefore will be negative
          * @example
@@ -7812,14 +7861,14 @@ const createSpineLocator = ({
          */
         x: Math.max(position.x - left, 0),
         y: Math.max(position.y - top, 0)
-      };
+      });
     },
     { disable: true }
   );
   const getSpinePositionFromSpineItem = (spineItem) => {
     return getSpinePositionFromSpineItemPosition({
-      spineItemPosition: { x: 0, y: 0 },
-      itemLayout: spineLayout.getSpineItemRelativeLayoutInfo(spineItem)
+      spineItemPosition: new SpineItemPosition({ x: 0, y: 0 }),
+      itemLayout: spineLayout.getSpineItemSpineLayoutInfo(spineItem)
     });
   };
   const getSpineItemFromIframe = (iframe) => {
@@ -7849,21 +7898,15 @@ const createSpineLocator = ({
     spineItem,
     restrictToScreen
   }) => {
-    const { height, width } = spineItem.layout.layoutInfo;
-    const numberOfPages = spineItemLocator.getSpineItemNumberOfPages({
-      isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
-      itemHeight: height,
-      itemWidth: width
-    });
+    const numberOfPages = spineItem.numberOfPages;
     const pages = Array.from(Array(numberOfPages)).map((_, index) => {
       const spineItemPosition = spineItemLocator.getSpineItemPositionFromPageIndex({
         pageIndex: index,
-        isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
-        itemLayout: spineItem.layout.layoutInfo
+        spineItem
       });
       const spinePosition = getSpinePositionFromSpineItemPosition({
         spineItemPosition,
-        itemLayout: spineLayout.getSpineItemRelativeLayoutInfo(spineItem)
+        itemLayout: spineLayout.getSpineItemSpineLayoutInfo(spineItem)
       });
       return {
         index,
@@ -7903,22 +7946,22 @@ const createSpineLocator = ({
     };
   };
   const isPositionWithinSpineItem = (position, spineItem) => {
-    const { bottom, left, right, top } = spineLayout.getSpineItemRelativeLayoutInfo(spineItem);
+    const { bottom, left, right, top } = spineLayout.getSpineItemSpineLayoutInfo(spineItem);
     return position.x >= left && position.x <= right && position.y <= bottom && position.y >= top;
   };
   const getSafeSpineItemPositionFromUnsafeSpineItemPosition = (unsafePosition, spineItem) => {
-    const { height, width } = spineLayout.getSpineItemRelativeLayoutInfo(spineItem);
-    return {
+    const { height, width } = spineLayout.getSpineItemSpineLayoutInfo(spineItem);
+    return new SpineItemPosition({
       x: Math.min(Math.max(0, unsafePosition.x), width),
       y: Math.min(Math.max(0, unsafePosition.y), height)
-    };
+    });
   };
   return {
     getSpinePositionFromSpineItemPosition: ({
       spineItem,
       spineItemPosition
     }) => {
-      const itemLayout = spineLayout.getSpineItemRelativeLayoutInfo(spineItem);
+      const itemLayout = spineLayout.getSpineItemSpineLayoutInfo(spineItem);
       return getSpinePositionFromSpineItemPosition({
         itemLayout,
         spineItemPosition
@@ -7926,17 +7969,11 @@ const createSpineLocator = ({
     },
     getAbsolutePageIndexFromPageIndex: (params) => getAbsolutePageIndexFromPageIndex({
       ...params,
-      context,
-      settings,
-      spineItemsManager,
-      spineLayout
+      spineItemsManager
     }),
     getSpineInfoFromAbsolutePageIndex: (params) => getSpineInfoFromAbsolutePageIndex({
       ...params,
-      context,
-      settings,
-      spineItemsManager,
-      spineLayout
+      spineItemsManager
     }),
     getSpinePositionFromSpineItem,
     getSpineItemPositionFromSpinePosition,
@@ -8061,21 +8098,6 @@ class SpineItemsObserver extends DestroyableClass {
     );
   }
 }
-const convertSpinePositionToLayoutPosition = ({
-  position,
-  pageSize
-}) => {
-  return {
-    x: position.x,
-    y: position.y,
-    left: position.x,
-    top: position.y,
-    width: pageSize.width,
-    height: pageSize.height,
-    bottom: position.y + pageSize.height,
-    right: position.x + pageSize.width
-  };
-};
 const layoutItem = ({
   horizontalOffset,
   verticalOffset,
@@ -8136,7 +8158,7 @@ const layoutItem = ({
         }
         const newEdgeX = width + currentValidEdgeXForVerticalPositioning;
         const newEdgeY = height + currentValidEdgeYForVerticalPositioning;
-        const layoutPosition2 = {
+        const layoutPosition2 = new SpineItemSpineLayout({
           left: currentValidEdgeXForVerticalPositioning,
           right: newEdgeX,
           top: currentValidEdgeYForVerticalPositioning,
@@ -8145,7 +8167,7 @@ const layoutItem = ({
           width,
           x: currentValidEdgeXForVerticalPositioning,
           y: currentValidEdgeYForVerticalPositioning
-        };
+        });
         return {
           horizontalOffset: newEdgeX,
           verticalOffset: newEdgeY,
@@ -8156,7 +8178,7 @@ const layoutItem = ({
         context.isRTL() ? { right: horizontalOffset, top: 0 } : { left: horizontalOffset, top: 0 }
       );
       const left = context.isRTL() ? context.state.visibleAreaRect.width - horizontalOffset - width : horizontalOffset;
-      const layoutPosition = {
+      const layoutPosition = new SpineItemSpineLayout({
         right: context.isRTL() ? context.state.visibleAreaRect.width - horizontalOffset : horizontalOffset + width,
         left,
         x: left,
@@ -8165,7 +8187,7 @@ const layoutItem = ({
         height,
         width,
         y: verticalOffset
-      };
+      });
       return {
         horizontalOffset: horizontalOffset + width,
         verticalOffset: 0,
@@ -8174,7 +8196,6 @@ const layoutItem = ({
     })
   );
 };
-const NAMESPACE = `SpineLayout`;
 class SpineLayout extends DestroyableClass {
   constructor(spineItemsManager, context, settings) {
     super();
@@ -8267,67 +8288,16 @@ class SpineLayout extends DestroyableClass {
           })
         );
       }),
-      map(() => {
-        const items = spineItemsManager.items;
-        const spineItemsPagesAbsolutePositions = items.map((item) => {
-          const itemLayout = this.getSpineItemRelativeLayoutInfo(item);
-          const numberOfPages = getSpineItemNumberOfPages({
-            isUsingVerticalWriting: !!item.isUsingVerticalWriting(),
-            itemHeight: itemLayout.height,
-            itemWidth: itemLayout.width,
-            context,
-            settings
-          });
-          const pages2 = new Array(numberOfPages).fill(void 0);
-          return pages2.map(
-            (_, pageIndex) => convertSpinePositionToLayoutPosition({
-              pageSize: this.context.getPageSize(),
-              position: getSpinePositionFromSpineItemPosition({
-                itemLayout,
-                spineItemPosition: getSpineItemPositionFromPageIndex({
-                  isUsingVerticalWriting: !!item.isUsingVerticalWriting(),
-                  itemLayout,
-                  pageIndex,
-                  context
-                })
-              })
-            })
-          );
-        });
-        const pages = spineItemsPagesAbsolutePositions.reduce(
-          (acc, itemPages, itemIndex) => {
-            const itemPagesInfo = itemPages.map(
-              (absolutePosition, pageIndex) => ({
-                itemIndex,
-                absolutePageIndex: itemIndex + pageIndex,
-                absolutePosition
-              })
-            );
-            return [...acc, ...itemPagesInfo];
-          },
-          []
-        );
-        return {
-          spineItemsAbsolutePositions: [...this.spineItemsRelativeLayouts],
-          pages
-        };
-      }),
       share()
     );
-    this.info$ = this.layout$.pipe(
-      tap$1((layout) => {
-        Report.log(NAMESPACE, `layout:info`, layout);
-      }),
-      shareReplay$1({ refCount: true, bufferSize: 1 })
-    );
-    merge(this.layout$, this.info$).pipe(takeUntil(this.destroy$)).subscribe();
+    merge(this.layout$).pipe(takeUntil(this.destroy$)).subscribe();
   }
   layout() {
     this.layoutSubject.next(void 0);
   }
-  getSpineItemRelativeLayoutInfo(spineItemOrIndex) {
+  getSpineItemSpineLayoutInfo(spineItemOrIndex) {
     const itemIndex = this.spineItemsManager.getSpineItemIndex(spineItemOrIndex) ?? 0;
-    return this.spineItemsRelativeLayouts[itemIndex] || {
+    return this.spineItemsRelativeLayouts[itemIndex] || new SpineItemSpineLayout({
       left: 0,
       right: 0,
       top: 0,
@@ -8336,7 +8306,12 @@ class SpineLayout extends DestroyableClass {
       height: 0,
       x: 0,
       y: 0
-    };
+    });
+  }
+  get numberOfPages() {
+    return this.spineItemsManager.items.reduce((acc, item) => {
+      return acc + item.numberOfPages;
+    }, 0);
   }
   destroy() {
     super.destroy();
@@ -8607,6 +8582,15 @@ class SpineItem extends DestroyableClass {
   get renditionLayout() {
     return this.renderer.renditionLayout;
   }
+  get numberOfPages() {
+    return getSpineItemNumberOfPages({
+      isUsingVerticalWriting: !!this.isUsingVerticalWriting(),
+      itemHeight: this.layout.layoutInfo.height,
+      itemWidth: this.layout.layoutInfo.width,
+      context: this.context,
+      settings: this.settings
+    });
+  }
 }
 const createContainerElement = (containerElement, item, hookManager) => {
   const element = containerElement.ownerDocument.createElement(`div`);
@@ -8922,8 +8906,6 @@ const createReader = (inputSettings) => {
     },
     settings: settingsManager,
     element$,
-    layout$: spine.spineLayout.layout$,
-    layoutInfo$: spine.spineLayout.info$,
     viewportState$: context.bridgeEvent.viewportState$,
     viewportFree$: context.bridgeEvent.viewportFree$,
     /**
@@ -8960,14 +8942,14 @@ const createReaderWithEnhancers = (
             accessibilityEnhancer(
               resourcesEnhancer(
                 utilsEnhancer(
-                  layoutEnhancer(
-                    zoomEnhancer(
-                      navigationEnhancer(
-                        htmlEnhancer(
-                          mediaEnhancer(
-                            chromeEnhancer(
-                              themeEnhancer(
-                                paginationEnhancer(
+                  zoomEnhancer(
+                    navigationEnhancer(
+                      htmlEnhancer(
+                        mediaEnhancer(
+                          chromeEnhancer(
+                            themeEnhancer(
+                              paginationEnhancer(
+                                layoutEnhancer(
                                   eventsEnhancer(
                                     // __
                                     createReader