@prose-reader/core 1.194.0 → 1.196.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -458,6 +458,9 @@
458
458
  }
459
459
  }
460
460
  };
461
+ function isHtmlTagElement(element, tagName) {
462
+ return isHtmlElement(element) && element.tagName.toLowerCase() === tagName.toLowerCase();
463
+ }
461
464
  const translateFramePositionIntoPage = ({
462
465
  position,
463
466
  frameElement
@@ -885,6 +888,33 @@
885
888
  ).subscribe();
886
889
  return reader;
887
890
  };
891
+ const handleLinks = (reader) => {
892
+ return reader.spine.spineItemsManager.items$.pipe(
893
+ rxjs.switchMap(
894
+ (items) => rxjs.merge(
895
+ ...items.map((item) => {
896
+ return item.loaded$.pipe(
897
+ rxjs.switchMap(() => {
898
+ const frame = item.renderer.getDocumentFrame();
899
+ if (!frame || !(frame == null ? void 0 : frame.contentDocument)) return rxjs.NEVER;
900
+ const anchorElements = Array.from(
901
+ frame.contentDocument.querySelectorAll(`a`)
902
+ );
903
+ const events$ = anchorElements.map(
904
+ (element) => rxjs.fromEvent(element, `click`)
905
+ );
906
+ return rxjs.merge(...events$);
907
+ })
908
+ );
909
+ })
910
+ )
911
+ ),
912
+ rxjs.tap((event) => {
913
+ event.preventDefault();
914
+ }),
915
+ rxjs.share()
916
+ );
917
+ };
888
918
  class DestroyableClass {
889
919
  constructor() {
890
920
  this.isDestroyed = false;
@@ -1997,7 +2027,12 @@
1997
2027
  return maybeFactory ?? ((props) => new HtmlRenderer(props));
1998
2028
  }
1999
2029
  });
2000
- return reader;
2030
+ const links$ = handleLinks(reader);
2031
+ links$.pipe(rxjs.takeUntil(reader.$.destroy$)).subscribe();
2032
+ return {
2033
+ ...reader,
2034
+ links$
2035
+ };
2001
2036
  };
2002
2037
  function isDefined(arg) {
2003
2038
  return arg !== null && arg !== void 0;
@@ -2255,52 +2290,6 @@
2255
2290
  settings: settingsManager
2256
2291
  };
2257
2292
  };
2258
- const linksEnhancer = (next) => (options) => {
2259
- const reader = next(options);
2260
- const subject = new rxjs.Subject();
2261
- const handleNavigationForClick = (element) => {
2262
- var _a;
2263
- if (!element.href) return false;
2264
- const hrefUrl = new URL(element.href);
2265
- const hrefWithoutAnchor = `${hrefUrl.origin}${hrefUrl.pathname}`;
2266
- const hasExistingSpineItem = (_a = reader.context.manifest) == null ? void 0 : _a.spineItems.some(
2267
- (item) => item.href === hrefWithoutAnchor
2268
- );
2269
- if (hasExistingSpineItem) {
2270
- reader.navigation.goToUrl(hrefUrl);
2271
- return true;
2272
- }
2273
- return false;
2274
- };
2275
- reader.hookManager.register(`item.onDocumentLoad`, ({ itemId }) => {
2276
- const item = reader.spineItemsManager.get(itemId);
2277
- const frame = item == null ? void 0 : item.renderer.getDocumentFrame();
2278
- if (!frame) return;
2279
- if (frame == null ? void 0 : frame.contentDocument) {
2280
- Array.from(frame.contentDocument.querySelectorAll(`a`)).forEach(
2281
- (element) => element.addEventListener(`click`, (e) => {
2282
- if (e.target && `style` in e.target && `ELEMENT_NODE` in e.target) {
2283
- Report.warn(`prevented click on`, element, e);
2284
- e.preventDefault();
2285
- const isNavigable = handleNavigationForClick(element);
2286
- subject.next({
2287
- event: `linkClicked`,
2288
- data: element,
2289
- isNavigable
2290
- });
2291
- }
2292
- })
2293
- );
2294
- }
2295
- });
2296
- return {
2297
- ...reader,
2298
- $: {
2299
- ...reader.$,
2300
- links$: subject.asObservable()
2301
- }
2302
- };
2303
- };
2304
2293
  const HTML_PREFIX = `${HTML_PREFIX$1}-enhancer-loading`;
2305
2294
  const CONTAINER_HTML_PREFIX = `${HTML_PREFIX}-container`;
2306
2295
  const createLoadingElementContainer = (containerElement, context) => {
@@ -2588,6 +2577,22 @@
2588
2577
  destroy
2589
2578
  };
2590
2579
  };
2580
+ const handleLinksNavigation = (reader, manualNavigator) => {
2581
+ return reader.links$.pipe(
2582
+ rxjs.tap((event) => {
2583
+ var _a;
2584
+ if (!isHtmlTagElement(event.target, "a") || event.type !== "click") return;
2585
+ const hrefUrl = new URL(event.target.href);
2586
+ const hrefWithoutAnchor = `${hrefUrl.origin}${hrefUrl.pathname}`;
2587
+ const hasExistingSpineItem = (_a = reader.context.manifest) == null ? void 0 : _a.spineItems.some(
2588
+ (item) => item.href === hrefWithoutAnchor
2589
+ );
2590
+ if (hasExistingSpineItem) {
2591
+ manualNavigator.goToUrl(hrefUrl);
2592
+ }
2593
+ })
2594
+ );
2595
+ };
2591
2596
  const report$4 = Report.namespace(`navigation`);
2592
2597
  const getSpineItemPositionForLeftPage = ({
2593
2598
  position,
@@ -3121,6 +3126,8 @@
3121
3126
  manualNavigator.goToCfi(cfi, { animate: false });
3122
3127
  }
3123
3128
  };
3129
+ const linksNavigation$ = handleLinksNavigation(reader, manualNavigator);
3130
+ linksNavigation$.pipe(rxjs.takeUntil(reader.$.destroy$)).subscribe();
3124
3131
  return {
3125
3132
  ...reader,
3126
3133
  load,
@@ -3301,8 +3308,8 @@
3301
3308
  };
3302
3309
  const getScrollPercentageWithinItem = (reader, currentPosition, currentItem) => {
3303
3310
  const context = reader.context;
3304
- const { height, width } = currentItem.layoutPosition;
3305
- const { top, left } = reader.spine.spineLayout.getAbsolutePositionOf(currentItem);
3311
+ const { height, width } = currentItem.layout.layoutInfo;
3312
+ const { top, left } = reader.spine.spineLayout.getSpineItemRelativeLayoutInfo(currentItem);
3306
3313
  if (reader.settings.values.computedPageTurnDirection === `vertical`) {
3307
3314
  return Math.max(
3308
3315
  0,
@@ -3365,7 +3372,7 @@
3365
3372
  );
3366
3373
  };
3367
3374
  const getNumberOfPagesForAllSpineItems = (reader) => reader.spineItemsManager.items.map((item) => {
3368
- const { height, width } = item.layoutPosition;
3375
+ const { height, width } = item.layout.layoutInfo;
3369
3376
  return reader.spine.spineItemLocator.getSpineItemNumberOfPages({
3370
3377
  isUsingVerticalWriting: !!item.isUsingVerticalWriting(),
3371
3378
  itemHeight: height,
@@ -5565,7 +5572,7 @@
5565
5572
  const range = node ? getRangeFromNode(node, offset) : void 0;
5566
5573
  offsetOfNodeInSpineItem = (range == null ? void 0 : range.getBoundingClientRect().x) || offsetOfNodeInSpineItem;
5567
5574
  }
5568
- const spineItemWidth = ((_a = spineItem.layoutPosition) == null ? void 0 : _a.width) || 0;
5575
+ const spineItemWidth = ((_a = spineItem.layout.layoutInfo) == null ? void 0 : _a.width) || 0;
5569
5576
  const pageWidth = context.getPageSize().width;
5570
5577
  if (offsetOfNodeInSpineItem !== void 0) {
5571
5578
  const val = getClosestValidOffsetFromApproximateOffsetInPages(
@@ -5585,7 +5592,7 @@
5585
5592
  frame.contentWindow.document.body !== null) {
5586
5593
  const { x: left, y: top } = getSpineItemPositionFromPageIndex({
5587
5594
  pageIndex,
5588
- itemLayout: spineItem.layoutPosition,
5595
+ itemLayout: spineItem.layout.layoutInfo,
5589
5596
  context,
5590
5597
  isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting()
5591
5598
  });
@@ -5604,7 +5611,7 @@
5604
5611
  return void 0;
5605
5612
  };
5606
5613
  const getSpineItemClosestPositionFromUnsafePosition = (unsafePosition, spineItem) => {
5607
- const { width, height } = spineItem.layoutPosition;
5614
+ const { width, height } = spineItem.layout.layoutInfo;
5608
5615
  const adjustedPosition = {
5609
5616
  x: getClosestValidOffsetFromApproximateOffsetInPages(
5610
5617
  unsafePosition.x,
@@ -5621,7 +5628,7 @@
5621
5628
  };
5622
5629
  const getSpineItemPageIndexFromNode = (node, offset, spineItem) => {
5623
5630
  const position = getSpineItemPositionFromNode(node, offset, spineItem);
5624
- const { height, width } = spineItem.layoutPosition;
5631
+ const { height, width } = spineItem.layout.layoutInfo;
5625
5632
  return position ? getSpineItemPageIndexFromPosition({
5626
5633
  isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
5627
5634
  position,
@@ -5659,7 +5666,7 @@
5659
5666
  context,
5660
5667
  isUsingVerticalWriting: !!item.isUsingVerticalWriting(),
5661
5668
  settings,
5662
- itemLayout: item.layoutPosition
5669
+ itemLayout: item.layout.layoutInfo
5663
5670
  });
5664
5671
  },
5665
5672
  getSpineItemNumberOfPages: (params) => getSpineItemNumberOfPages({
@@ -5675,7 +5682,7 @@
5675
5682
  }) => {
5676
5683
  const spineItemLocator = createSpineItemLocator({ context, settings });
5677
5684
  const getNavigationForLastPage = (spineItem) => {
5678
- const { height, width } = spineItem.layoutPosition;
5685
+ const { height, width } = spineItem.layout.layoutInfo;
5679
5686
  const numberOfPages = spineItemLocator.getSpineItemNumberOfPages({
5680
5687
  isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
5681
5688
  itemHeight: height,
@@ -5684,7 +5691,7 @@
5684
5691
  return spineItemLocator.getSpineItemPositionFromPageIndex({
5685
5692
  pageIndex: numberOfPages - 1,
5686
5693
  isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
5687
- itemLayout: spineItem.layoutPosition
5694
+ itemLayout: spineItem.layout.layoutInfo
5688
5695
  });
5689
5696
  };
5690
5697
  const getNavigationFromNode = (spineItem, node, offset) => {
@@ -5728,7 +5735,7 @@
5728
5735
  const lastSpineItem = spineItemsManager.get(
5729
5736
  spineItemsManager.items.length - 1
5730
5737
  );
5731
- const distanceOfLastSpineItem = spineLayout.getAbsolutePositionOf(
5738
+ const distanceOfLastSpineItem = spineLayout.getSpineItemRelativeLayoutInfo(
5732
5739
  lastSpineItem || 0
5733
5740
  );
5734
5741
  const maximumYOffset = distanceOfLastSpineItem.bottom - pageSizeHeight;
@@ -5751,7 +5758,7 @@
5751
5758
  context
5752
5759
  }) => {
5753
5760
  var _a;
5754
- const itemWidth = ((_a = spineItem.layoutPosition) == null ? void 0 : _a.width) || 0;
5761
+ const itemWidth = ((_a = spineItem.layout.layoutInfo) == null ? void 0 : _a.width) || 0;
5755
5762
  const pageWidth = context.getPageSize().width;
5756
5763
  const anchorElementBoundingRect = spineItem.getBoundingRectOfElementFromSelector(anchor);
5757
5764
  const offsetOfAnchor = (anchorElementBoundingRect == null ? void 0 : anchorElementBoundingRect.x) || 0;
@@ -5910,7 +5917,7 @@
5910
5917
  const spineItemNavigation = spineLocator.spineItemLocator.getSpineItemPositionFromPageIndex({
5911
5918
  pageIndex,
5912
5919
  isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
5913
- itemLayout: spineItem.layoutPosition
5920
+ itemLayout: spineItem.layout.layoutInfo
5914
5921
  });
5915
5922
  const readingOffset = spineLocator.getSpinePositionFromSpineItemPosition({
5916
5923
  spineItemPosition: spineItemNavigation,
@@ -6621,9 +6628,7 @@
6621
6628
  const withSpineItemLayoutInfo = ({ spine }) => (stream) => {
6622
6629
  return stream.pipe(
6623
6630
  rxjs.switchMap(({ navigation, ...rest }) => {
6624
- const spineItemDimensions = spine.spineLayout.getAbsolutePositionOf(
6625
- navigation.spineItem
6626
- );
6631
+ const spineItemDimensions = spine.spineLayout.getSpineItemRelativeLayoutInfo(navigation.spineItem);
6627
6632
  const spineItem = spine.spineItemsManager.get(navigation.spineItem);
6628
6633
  return ((spineItem == null ? void 0 : spineItem.isReady$) ?? rxjs.of(false)).pipe(
6629
6634
  rxjs.first(),
@@ -6677,7 +6682,7 @@
6677
6682
  const positionInSpineItem = spineLocator.spineItemLocator.getSpineItemPositionFromPageIndex({
6678
6683
  pageIndex: beginPageIndexForDirection,
6679
6684
  isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
6680
- itemLayout: spineItem.layoutPosition
6685
+ itemLayout: spineItem.layout.layoutInfo
6681
6686
  });
6682
6687
  return positionInSpineItem;
6683
6688
  }
@@ -6738,7 +6743,7 @@
6738
6743
  rxjs.first(),
6739
6744
  rxjs.map((isReady) => {
6740
6745
  var _a, _b;
6741
- const spineItemAbsolutePosition = spineLayout.getAbsolutePositionOf(spineItem);
6746
+ const spineItemAbsolutePosition = spineLayout.getSpineItemRelativeLayoutInfo(spineItem);
6742
6747
  const isPositionWithinSpineItem = spineLocator.isPositionWithinSpineItem(
6743
6748
  navigation.position,
6744
6749
  spineItem
@@ -6809,7 +6814,7 @@
6809
6814
  const { spineItem } = navigation;
6810
6815
  const foundSpineItem = spineItemsManager.get(spineItem);
6811
6816
  if (!foundSpineItem) return { x: 0, y: 0 };
6812
- const { height, top } = spineLayout.getAbsolutePositionOf(foundSpineItem);
6817
+ const { height, top } = spineLayout.getSpineItemRelativeLayoutInfo(foundSpineItem);
6813
6818
  const isPositionWithinSpineItem = spineLocator.isPositionWithinSpineItem(
6814
6819
  navigation.position,
6815
6820
  foundSpineItem
@@ -7376,13 +7381,13 @@
7376
7381
  const shouldUpdateEndCfi = previousPagination.endSpineItemIndex !== endSpineItemIndex || endLastCfi === void 0 || isRootCfi(endLastCfi);
7377
7382
  const beginCfi = shouldUpdateBeginCfi ? getRootCfi(beginSpineItem) : beginLastCfi;
7378
7383
  const endCfi = shouldUpdateEndCfi ? getRootCfi(endSpineItem) : endLastCfi;
7379
- const beginSpineItemDimensions = beginSpineItem.layoutPosition;
7384
+ const beginSpineItemDimensions = beginSpineItem.layout.layoutInfo;
7380
7385
  const beginNumberOfPagesInSpineItem = this.spineItemLocator.getSpineItemNumberOfPages({
7381
7386
  itemHeight: beginSpineItemDimensions.height,
7382
7387
  itemWidth: beginSpineItemDimensions.width,
7383
7388
  isUsingVerticalWriting: !!beginSpineItem.isUsingVerticalWriting()
7384
7389
  });
7385
- const endSpineItemDimensions = endSpineItem.layoutPosition;
7390
+ const endSpineItemDimensions = endSpineItem.layout.layoutInfo;
7386
7391
  const endNumberOfPagesInSpineItem = this.spineItemLocator.getSpineItemNumberOfPages({
7387
7392
  itemHeight: endSpineItemDimensions.height,
7388
7393
  itemWidth: endSpineItemDimensions.width,
@@ -7571,7 +7576,7 @@
7571
7576
  const { currentAbsolutePage } = items.reduce(
7572
7577
  (acc, item) => {
7573
7578
  if (acc.found) return acc;
7574
- const itemLayout = spineLayout.getAbsolutePositionOf(item);
7579
+ const itemLayout = spineLayout.getSpineItemRelativeLayoutInfo(item);
7575
7580
  const numberOfPages = getSpineItemNumberOfPages({
7576
7581
  isUsingVerticalWriting: !!item.isUsingVerticalWriting(),
7577
7582
  itemHeight: itemLayout.height,
@@ -7681,7 +7686,7 @@
7681
7686
  const { found, currentAbsolutePage } = items.reduce(
7682
7687
  (acc, item) => {
7683
7688
  if (acc.found) return acc;
7684
- const itemLayout = spineLayout.getAbsolutePositionOf(item);
7689
+ const itemLayout = spineLayout.getSpineItemRelativeLayoutInfo(item);
7685
7690
  const numberOfPages = getSpineItemNumberOfPages({
7686
7691
  isUsingVerticalWriting: !!item.isUsingVerticalWriting(),
7687
7692
  itemHeight: itemLayout.height,
@@ -7722,7 +7727,7 @@
7722
7727
  settings
7723
7728
  }) => {
7724
7729
  const spineItem = spineItemsManager.items.find((item) => {
7725
- const { left, right, bottom, top } = spineLayout.getAbsolutePositionOf(item);
7730
+ const { left, right, bottom, top } = spineLayout.getSpineItemRelativeLayoutInfo(item);
7726
7731
  const isWithinXAxis = position.x >= left && position.x < right;
7727
7732
  if (settings.values.computedPageTurnDirection === `horizontal`) {
7728
7733
  return isWithinXAxis;
@@ -7760,7 +7765,7 @@
7760
7765
  }) || spineItemsManager.get(0);
7761
7766
  const spineItemsVisible = spineItemsManager.items.reduce(
7762
7767
  (acc, spineItem) => {
7763
- const itemPosition = spineLayout.getAbsolutePositionOf(spineItem);
7768
+ const itemPosition = spineLayout.getSpineItemRelativeLayoutInfo(spineItem);
7764
7769
  const { visible } = getItemVisibilityForPosition({
7765
7770
  itemPosition,
7766
7771
  threshold,
@@ -7796,7 +7801,7 @@
7796
7801
  `getSpineItemPositionFromSpinePosition`,
7797
7802
  10,
7798
7803
  (position, spineItem) => {
7799
- const { left, top } = spineLayout.getAbsolutePositionOf(spineItem);
7804
+ const { left, top } = spineLayout.getSpineItemRelativeLayoutInfo(spineItem);
7800
7805
  return {
7801
7806
  /**
7802
7807
  * when using spread the item could be on the right and therefore will be negative
@@ -7814,7 +7819,7 @@
7814
7819
  const getSpinePositionFromSpineItem = (spineItem) => {
7815
7820
  return getSpinePositionFromSpineItemPosition({
7816
7821
  spineItemPosition: { x: 0, y: 0 },
7817
- itemLayout: spineLayout.getAbsolutePositionOf(spineItem)
7822
+ itemLayout: spineLayout.getSpineItemRelativeLayoutInfo(spineItem)
7818
7823
  });
7819
7824
  };
7820
7825
  const getSpineItemFromIframe = (iframe) => {
@@ -7844,7 +7849,7 @@
7844
7849
  spineItem,
7845
7850
  restrictToScreen
7846
7851
  }) => {
7847
- const { height, width } = spineItem.layoutPosition;
7852
+ const { height, width } = spineItem.layout.layoutInfo;
7848
7853
  const numberOfPages = spineItemLocator.getSpineItemNumberOfPages({
7849
7854
  isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
7850
7855
  itemHeight: height,
@@ -7854,11 +7859,11 @@
7854
7859
  const spineItemPosition = spineItemLocator.getSpineItemPositionFromPageIndex({
7855
7860
  pageIndex: index,
7856
7861
  isUsingVerticalWriting: !!spineItem.isUsingVerticalWriting(),
7857
- itemLayout: spineItem.layoutPosition
7862
+ itemLayout: spineItem.layout.layoutInfo
7858
7863
  });
7859
7864
  const spinePosition = getSpinePositionFromSpineItemPosition({
7860
7865
  spineItemPosition,
7861
- itemLayout: spineLayout.getAbsolutePositionOf(spineItem)
7866
+ itemLayout: spineLayout.getSpineItemRelativeLayoutInfo(spineItem)
7862
7867
  });
7863
7868
  return {
7864
7869
  index,
@@ -7898,11 +7903,11 @@
7898
7903
  };
7899
7904
  };
7900
7905
  const isPositionWithinSpineItem = (position, spineItem) => {
7901
- const { bottom, left, right, top } = spineLayout.getAbsolutePositionOf(spineItem);
7906
+ const { bottom, left, right, top } = spineLayout.getSpineItemRelativeLayoutInfo(spineItem);
7902
7907
  return position.x >= left && position.x <= right && position.y <= bottom && position.y >= top;
7903
7908
  };
7904
7909
  const getSafeSpineItemPositionFromUnsafeSpineItemPosition = (unsafePosition, spineItem) => {
7905
- const { height, width } = spineLayout.getAbsolutePositionOf(spineItem);
7910
+ const { height, width } = spineLayout.getSpineItemRelativeLayoutInfo(spineItem);
7906
7911
  return {
7907
7912
  x: Math.min(Math.max(0, unsafePosition.x), width),
7908
7913
  y: Math.min(Math.max(0, unsafePosition.y), height)
@@ -7913,7 +7918,7 @@
7913
7918
  spineItem,
7914
7919
  spineItemPosition
7915
7920
  }) => {
7916
- const itemLayout = spineLayout.getAbsolutePositionOf(spineItem);
7921
+ const itemLayout = spineLayout.getSpineItemRelativeLayoutInfo(spineItem);
7917
7922
  return getSpinePositionFromSpineItemPosition({
7918
7923
  itemLayout,
7919
7924
  spineItemPosition
@@ -8108,7 +8113,7 @@
8108
8113
  minimumWidth = context.getPageSize().width * 2;
8109
8114
  }
8110
8115
  }
8111
- const itemLayout$ = item.layout({
8116
+ const itemLayout$ = item.layout.layout({
8112
8117
  minimumWidth,
8113
8118
  blankPagePosition,
8114
8119
  spreadPosition: context.state.isUsingSpreadMode ? isScreenStartItem ? context.isRTL() ? `right` : `left` : context.isRTL() ? `left` : `right` : `none`
@@ -8119,29 +8124,52 @@
8119
8124
  const currentValidEdgeYForVerticalPositioning = isScreenStartItem ? verticalOffset : verticalOffset - context.state.visibleAreaRect.height;
8120
8125
  const currentValidEdgeXForVerticalPositioning = isScreenStartItem ? 0 : horizontalOffset;
8121
8126
  if (context.isRTL()) {
8122
- item.adjustPositionOfElement({
8127
+ item.layout.adjustPositionOfElement({
8123
8128
  top: currentValidEdgeYForVerticalPositioning,
8124
8129
  left: currentValidEdgeXForVerticalPositioning
8125
8130
  });
8126
8131
  } else {
8127
- item.adjustPositionOfElement({
8132
+ item.layout.adjustPositionOfElement({
8128
8133
  top: currentValidEdgeYForVerticalPositioning,
8129
8134
  left: currentValidEdgeXForVerticalPositioning
8130
8135
  });
8131
8136
  }
8132
8137
  const newEdgeX = width + currentValidEdgeXForVerticalPositioning;
8133
8138
  const newEdgeY = height + currentValidEdgeYForVerticalPositioning;
8139
+ const layoutPosition2 = {
8140
+ left: currentValidEdgeXForVerticalPositioning,
8141
+ right: newEdgeX,
8142
+ top: currentValidEdgeYForVerticalPositioning,
8143
+ bottom: newEdgeY,
8144
+ height,
8145
+ width,
8146
+ x: currentValidEdgeXForVerticalPositioning,
8147
+ y: currentValidEdgeYForVerticalPositioning
8148
+ };
8134
8149
  return {
8135
8150
  horizontalOffset: newEdgeX,
8136
- verticalOffset: newEdgeY
8151
+ verticalOffset: newEdgeY,
8152
+ layoutPosition: layoutPosition2
8137
8153
  };
8138
8154
  }
8139
- item.adjustPositionOfElement(
8155
+ item.layout.adjustPositionOfElement(
8140
8156
  context.isRTL() ? { right: horizontalOffset, top: 0 } : { left: horizontalOffset, top: 0 }
8141
8157
  );
8158
+ const left = context.isRTL() ? context.state.visibleAreaRect.width - horizontalOffset - width : horizontalOffset;
8159
+ const layoutPosition = {
8160
+ right: context.isRTL() ? context.state.visibleAreaRect.width - horizontalOffset : horizontalOffset + width,
8161
+ left,
8162
+ x: left,
8163
+ top: verticalOffset,
8164
+ bottom: height,
8165
+ height,
8166
+ width,
8167
+ y: verticalOffset
8168
+ };
8142
8169
  return {
8143
8170
  horizontalOffset: horizontalOffset + width,
8144
- verticalOffset: 0
8171
+ verticalOffset: 0,
8172
+ layoutPosition
8145
8173
  };
8146
8174
  })
8147
8175
  );
@@ -8154,7 +8182,11 @@
8154
8182
  this.context = context;
8155
8183
  this.settings = settings;
8156
8184
  this.layoutSubject = new rxjs.Subject();
8185
+ this.spineItemsRelativeLayouts = [];
8157
8186
  spineItemsManager.items$.pipe(
8187
+ rxjs.tap(() => {
8188
+ this.spineItemsRelativeLayouts = [];
8189
+ }),
8158
8190
  rxjs.switchMap((items) => {
8159
8191
  const needsLayouts$ = items.map(
8160
8192
  (spineItem) => spineItem.needsLayout$.pipe(
@@ -8195,28 +8227,41 @@
8195
8227
  layoutInProgress.next(true);
8196
8228
  const manifest = this.context.manifest;
8197
8229
  const isGloballyPrePaginated = isFullyPrePaginated(manifest) ?? false;
8198
- return rxjs.from(this.spineItemsManager.items).pipe(
8230
+ const items$ = rxjs.from(this.spineItemsManager.items);
8231
+ return items$.pipe(
8199
8232
  rxjs.reduce(
8200
- (acc$, item, index) => acc$.pipe(
8233
+ (acc$, item, itemIndex) => acc$.pipe(
8201
8234
  rxjs.concatMap(
8202
- ({ horizontalOffset, verticalOffset }) => layoutItem({
8235
+ ({ horizontalOffset, verticalOffset, pages }) => layoutItem({
8203
8236
  context: this.context,
8204
8237
  horizontalOffset,
8205
- index,
8238
+ index: itemIndex,
8206
8239
  isGloballyPrePaginated,
8207
8240
  item,
8208
8241
  settings: this.settings,
8209
8242
  spineItemsManager: this.spineItemsManager,
8210
8243
  verticalOffset
8211
- })
8244
+ }).pipe(
8245
+ rxjs.map(
8246
+ ({
8247
+ horizontalOffset: newHorizontalOffset,
8248
+ verticalOffset: newVerticalOffset,
8249
+ layoutPosition
8250
+ }) => {
8251
+ this.spineItemsRelativeLayouts[itemIndex] = layoutPosition;
8252
+ return {
8253
+ horizontalOffset: newHorizontalOffset,
8254
+ verticalOffset: newVerticalOffset,
8255
+ pages: [...pages, layoutPosition]
8256
+ };
8257
+ }
8258
+ )
8259
+ )
8212
8260
  )
8213
8261
  ),
8214
- rxjs.of({ horizontalOffset: 0, verticalOffset: 0 })
8262
+ rxjs.of({ horizontalOffset: 0, verticalOffset: 0, pages: [] })
8215
8263
  ),
8216
8264
  rxjs.concatMap((layout$) => layout$),
8217
- rxjs.tap(() => {
8218
- Report.log(NAMESPACE, `layout`);
8219
- }),
8220
8265
  rxjs.finalize(() => {
8221
8266
  layoutInProgress.next(false);
8222
8267
  })
@@ -8225,7 +8270,7 @@
8225
8270
  rxjs.map(() => {
8226
8271
  const items = spineItemsManager.items;
8227
8272
  const spineItemsPagesAbsolutePositions = items.map((item) => {
8228
- const itemLayout = this.getAbsolutePositionOf(item);
8273
+ const itemLayout = this.getSpineItemRelativeLayoutInfo(item);
8229
8274
  const numberOfPages = getSpineItemNumberOfPages({
8230
8275
  isUsingVerticalWriting: !!item.isUsingVerticalWriting(),
8231
8276
  itemHeight: itemLayout.height,
@@ -8263,16 +8308,16 @@
8263
8308
  []
8264
8309
  );
8265
8310
  return {
8266
- spineItemsAbsolutePositions: items.map(
8267
- (item) => this.getAbsolutePositionOf(item)
8268
- ),
8269
- spineItemsPagesAbsolutePositions,
8311
+ spineItemsAbsolutePositions: [...this.spineItemsRelativeLayouts],
8270
8312
  pages
8271
8313
  };
8272
8314
  }),
8273
8315
  rxjs.share()
8274
8316
  );
8275
8317
  this.info$ = this.layout$.pipe(
8318
+ rxjs.tap((layout) => {
8319
+ Report.log(NAMESPACE, `layout:info`, layout);
8320
+ }),
8276
8321
  rxjs.shareReplay({ refCount: true, bufferSize: 1 })
8277
8322
  );
8278
8323
  rxjs.merge(this.layout$, this.info$).pipe(rxjs.takeUntil(this.destroy$)).subscribe();
@@ -8280,9 +8325,9 @@
8280
8325
  layout() {
8281
8326
  this.layoutSubject.next(void 0);
8282
8327
  }
8283
- getAbsolutePositionOf(spineItemOrIndex) {
8284
- var _a;
8285
- return ((_a = this.spineItemsManager.get(spineItemOrIndex)) == null ? void 0 : _a.layoutPosition) || {
8328
+ getSpineItemRelativeLayoutInfo(spineItemOrIndex) {
8329
+ const itemIndex = this.spineItemsManager.getSpineItemIndex(spineItemOrIndex) ?? 0;
8330
+ return this.spineItemsRelativeLayouts[itemIndex] || {
8286
8331
  left: 0,
8287
8332
  right: 0,
8288
8333
  top: 0,
@@ -8416,34 +8461,14 @@
8416
8461
  const adjustedValue = multiplier * pageSize;
8417
8462
  return Math.max(adjustedValue, pageSize);
8418
8463
  }
8419
- /**
8420
- * Returns the absolute layout position relative to the parent element which
8421
- * is supposedly and expectedly the spine element.
8422
- *
8423
- * @important
8424
- *
8425
- * This method is stable and does not consider scalings or transforms on the parents.
8426
- *
8427
- * It does assume and requires that:
8428
- * - the navigator element and the spine element are direct parents.
8429
- * - the spine items are correctly positioned in the DOM and with correct styles values.
8430
- */
8431
- get layoutPosition() {
8432
- const left = Math.round(this.containerElement.offsetLeft * 10) / 10;
8433
- const top = Math.round(this.containerElement.offsetTop * 10) / 10;
8434
- const width = Math.round(this.containerElement.offsetWidth * 10) / 10;
8435
- const height = Math.round(this.containerElement.offsetHeight * 10) / 10;
8436
- const normalizedValues = {
8437
- left,
8438
- top,
8439
- right: left + width,
8440
- bottom: top + height,
8441
- x: left,
8442
- y: top,
8464
+ get layoutInfo() {
8465
+ const style = this.containerElement.style;
8466
+ const width = style.width ? parseFloat(style.width) : 0;
8467
+ const height = style.height ? parseFloat(style.height) : 0;
8468
+ return {
8443
8469
  width,
8444
8470
  height
8445
8471
  };
8446
- return normalizedValues;
8447
8472
  }
8448
8473
  }
8449
8474
  class DefaultRenderer extends DocumentRenderer {
@@ -8518,21 +8543,23 @@
8518
8543
  resourcesHandler: this.resourcesHandler
8519
8544
  };
8520
8545
  this.renderer = rendererFactory ? rendererFactory(rendererParams) : new DefaultRenderer(rendererParams);
8521
- this.spineItemLayout = new SpineItemLayout(
8546
+ this.layout = new SpineItemLayout(
8522
8547
  item,
8523
8548
  this.containerElement,
8524
8549
  context,
8525
8550
  hookManager,
8526
8551
  this.renderer
8527
8552
  );
8528
- this.isReady$ = this.spineItemLayout.layoutProcess$.pipe(
8553
+ this.isReady$ = this.layout.layoutProcess$.pipe(
8529
8554
  operators.withLatestFrom(this.renderer.isLoaded$),
8530
8555
  operators.map(([event, loaded]) => !!(event.type === `end` && loaded)),
8531
8556
  operators.startWith(false),
8532
8557
  operators.distinctUntilChanged(),
8558
+ operators.tap((isReady) => {
8559
+ this.containerElement.dataset["isReady"] = isReady.toString();
8560
+ }),
8533
8561
  operators.shareReplay({ refCount: true, bufferSize: 1 })
8534
8562
  );
8535
- this.layout$ = this.spineItemLayout.layout$;
8536
8563
  this.needsLayout$ = rxjs.merge(this.unloaded$, this.loaded$);
8537
8564
  rxjs.merge(
8538
8565
  /**
@@ -8542,10 +8569,8 @@
8542
8569
  * to layout changes may rely on the isReady value.
8543
8570
  */
8544
8571
  this.isReady$,
8545
- this.spineItemLayout.layout$
8572
+ this.layout.layout$
8546
8573
  ).pipe(operators.takeUntil(this.destroy$)).subscribe();
8547
- this.layout = this.spineItemLayout.layout;
8548
- this.adjustPositionOfElement = this.spineItemLayout.adjustPositionOfElement;
8549
8574
  }
8550
8575
  get element() {
8551
8576
  return this.containerElement;
@@ -8561,9 +8586,6 @@
8561
8586
  get readingDirection() {
8562
8587
  return this.renderer.readingDirection;
8563
8588
  }
8564
- get layoutPosition() {
8565
- return this.spineItemLayout.layoutPosition;
8566
- }
8567
8589
  get loaded$() {
8568
8590
  return this.renderer.state$.pipe(
8569
8591
  operators.distinctUntilChanged(),
@@ -8594,6 +8616,7 @@
8594
8616
  position: absolute;
8595
8617
  overflow: hidden;
8596
8618
  `;
8619
+ element.dataset["isReady"] = `false`;
8597
8620
  hookManager.execute("item.onBeforeContainerCreated", void 0, { element });
8598
8621
  return element;
8599
8622
  };
@@ -8934,22 +8957,20 @@
8934
8957
  loadingEnhancer(
8935
8958
  webkitEnhancer(
8936
8959
  fontsEnhancer(
8937
- linksEnhancer(
8938
- accessibilityEnhancer(
8939
- resourcesEnhancer(
8940
- utilsEnhancer(
8941
- layoutEnhancer(
8942
- zoomEnhancer(
8943
- mediaEnhancer(
8944
- chromeEnhancer(
8945
- navigationEnhancer(
8960
+ accessibilityEnhancer(
8961
+ resourcesEnhancer(
8962
+ utilsEnhancer(
8963
+ layoutEnhancer(
8964
+ zoomEnhancer(
8965
+ navigationEnhancer(
8966
+ htmlEnhancer(
8967
+ mediaEnhancer(
8968
+ chromeEnhancer(
8946
8969
  themeEnhancer(
8947
8970
  paginationEnhancer(
8948
8971
  eventsEnhancer(
8949
- htmlEnhancer(
8950
- // __
8951
- createReader
8952
- )
8972
+ // __
8973
+ createReader
8953
8974
  )
8954
8975
  )
8955
8976
  )
@@ -8987,6 +9008,7 @@
8987
9008
  exports2.idle = idle;
8988
9009
  exports2.injectCSS = injectCSS;
8989
9010
  exports2.isHtmlElement = isHtmlElement;
9011
+ exports2.isHtmlTagElement = isHtmlTagElement;
8990
9012
  exports2.mapKeysTo = mapKeysTo;
8991
9013
  exports2.observeMutation = observeMutation;
8992
9014
  exports2.observeResize = observeResize;