@prose-reader/core 1.58.0 → 1.60.0

package/dist/index.js

@@ -1,5 +1,13 @@
-import { takeUntil, Subject, BehaviorSubject, map, combineLatest, switchMap, merge, EMPTY, fromEvent, withLatestFrom as withLatestFrom$1, NEVER, Observable, of, scheduled, animationFrameScheduler, distinctUntilChanged as distinctUntilChanged$1, startWith, filter as filter$1, debounceTime, combineLatestWith, tap as tap$1, shareReplay as shareReplay$1, from, interval, iif, identity, take as take$1, forkJoin } from "rxjs";
-import { withLatestFrom, distinctUntilChanged, shareReplay, tap, pairwise, switchMap as switchMap$1, filter, take, map as map$1, takeUntil as takeUntil$1, skip, share, exhaustMap, mergeMap, catchError, debounce, debounceTime as debounceTime$1, startWith as startWith$1, delay } from "rxjs/operators";
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
+var _context;
+import { takeUntil, Subject, combineLatest, map as map$1, switchMap, merge, EMPTY, fromEvent, withLatestFrom, NEVER, Observable, of, scheduled, animationFrameScheduler, distinctUntilChanged as distinctUntilChanged$1, startWith as startWith$1, BehaviorSubject, filter as filter$1, debounceTime, combineLatestWith, tap as tap$1, shareReplay as shareReplay$1, from, interval, iif, identity, take as take$1, forkJoin } from "rxjs";
+import { startWith, map, shareReplay, tap, pairwise, switchMap as switchMap$1, filter, take, distinctUntilChanged, takeUntil as takeUntil$1, skip, withLatestFrom as withLatestFrom$1, share, exhaustMap, mergeMap, catchError, debounce, debounceTime as debounceTime$1, delay } from "rxjs/operators";
 import { parseContentType, detectMimeTypeFromName } from "@prose-reader/shared";
 const chromeEnhancer = (next) => (options) => {
   const reader = next(options);
@@ -72,21 +80,98 @@ const getBase64FromBlob = (data) => {
     reader.readAsDataURL(data);
   });
 };
+function shallowMergeIfDefined(obj1, obj2) {
+  const result = { ...obj1 };
+  for (const key in obj2) {
+    if (Object.prototype.hasOwnProperty.call(obj2, key)) {
+      const value = obj2[key];
+      if (value !== void 0 || !(key in obj1)) {
+        result[key] = value;
+      }
+    }
+  }
+  return result;
+}
+class SettingsManagerOverload {
+  constructor(initialSettings, settingsManager) {
+    this.settingsManager = settingsManager;
+    this.inputSettings = shallowMergeIfDefined(this.getDefaultSettings(), initialSettings);
+    this.outputSettings = this.computeOutputSettings();
+    this.outputSettingsUpdateSubject = new Subject();
+    this.settings$ = combineLatest([
+      this.settingsManager.settings$,
+      this.outputSettingsUpdateSubject.pipe(startWith(this.outputSettings))
+    ]).pipe(
+      map(([parentSettings, settings]) => ({ ...parentSettings, ...settings })),
+      shareReplay(1)
+    );
+    this.settings$.subscribe();
+  }
+  _prepareUpdate(settings) {
+    const parentInputSettings = this.getCleanedParentInputSettings(settings);
+    const parentManagerPreparedUpdate = this.settingsManager._prepareUpdate(parentInputSettings);
+    this.inputSettings = { ...this.inputSettings, ...settings };
+    const outputSettings = this.computeOutputSettings();
+    const hasChanged = this.hasSettingsChanged(outputSettings);
+    console.log({ outputSettings, hasChanged, parentManagerPreparedUpdate });
+    return {
+      hasChanged: hasChanged || parentManagerPreparedUpdate.hasChanged,
+      commit: () => {
+        this.outputSettings = outputSettings;
+        if (!parentManagerPreparedUpdate.hasChanged && hasChanged) {
+          this.outputSettingsUpdateSubject.next(outputSettings);
+        }
+        parentManagerPreparedUpdate.commit();
+      }
+    };
+  }
+  update(settings) {
+    const { commit } = this._prepareUpdate(settings);
+    commit();
+  }
+  get settings() {
+    return {
+      ...this.settingsManager.settings,
+      ...this.outputSettings
+    };
+  }
+  destroy() {
+    this.outputSettingsUpdateSubject.complete();
+  }
+}
+let SettingsManager$1 = class SettingsManager extends SettingsManagerOverload {
+  computeOutputSettings() {
+    return this.inputSettings;
+  }
+  hasSettingsChanged(newOutputSettings) {
+    return !isShallowEqual(this.outputSettings, newOutputSettings);
+  }
+  getCleanedParentInputSettings(settings) {
+    const { fontJustification, fontScale, fontWeight, lineHeight, ...rest } = settings;
+    return rest;
+  }
+  getDefaultSettings() {
+    return {
+      fontScale: 1,
+      fontWeight: "publisher",
+      lineHeight: "publisher",
+      fontJustification: "publisher"
+    };
+  }
+};
 const fontsEnhancer = (next) => (options) => {
-  const {
-    fontScale = 1,
-    lineHeight = `publisher`,
-    fontWeight = `publisher`,
-    fontJustification = `publisher`
-  } = options;
+  const { fontScale, lineHeight, fontWeight, fontJustification } = options;
   const changes$ = new Subject();
-  const settings$ = new BehaviorSubject({
-    fontScale,
-    lineHeight,
-    fontWeight,
-    fontJustification
-  });
   const reader = next(options);
+  const settingsManager = new SettingsManager$1(
+    {
+      fontScale,
+      lineHeight,
+      fontWeight,
+      fontJustification
+    },
+    reader.settings
+  );
   const getStyle = () => `
     ${/*
         Ideally, we would like to use !important but it could break publisher specific
@@ -98,10 +183,10 @@ const fontsEnhancer = (next) => (options) => {
       */
   ``}
     body {
-      ${settings$.value.fontScale !== 1 ? `font-size: ${settings$.value.fontScale}em !important;` : ``}
-      ${settings$.value.lineHeight !== `publisher` ? `line-height: ${settings$.value.lineHeight} !important;` : ``}
-      ${settings$.value.fontWeight !== `publisher` ? `font-weight: ${settings$.value.fontWeight} !important;` : ``}
-      ${settings$.value.fontJustification !== `publisher` ? `text-align: ${settings$.value.fontJustification} !important;` : ``}
+      ${settingsManager.settings.fontScale !== 1 ? `font-size: ${settingsManager.settings.fontScale}em !important;` : ``}
+      ${settingsManager.settings.lineHeight !== `publisher` ? `line-height: ${settingsManager.settings.lineHeight} !important;` : ``}
+      ${settingsManager.settings.fontWeight !== `publisher` ? `font-weight: ${settingsManager.settings.fontWeight} !important;` : ``}
+      ${settingsManager.settings.fontJustification !== `publisher` ? `text-align: ${settingsManager.settings.fontJustification} !important;` : ``}
     }
   `;
   const applyChangeToSpineItem = (requireLayout) => {
@@ -125,55 +210,28 @@ const fontsEnhancer = (next) => (options) => {
   });
   const shouldRequireLayout = (source) => source.pipe(
     pairwise(),
-    map(([old, latest]) => {
+    map$1(([old, latest]) => {
       if (latest.fontScale !== old.fontScale) return true;
       if (latest.lineHeight !== old.lineHeight) return true;
       return false;
     })
   );
-  const newSettings$ = changes$.pipe(
-    withLatestFrom(settings$),
-    map(([changes, settings]) => ({
-      fontJustification: changes.fontJustification ?? settings.fontJustification,
-      fontWeight: changes.fontWeight ?? settings.fontWeight,
-      lineHeight: changes.lineHeight ?? settings.lineHeight,
-      fontScale: Math.max(0.01, changes.fontScale ?? settings.fontScale)
-    })),
-    distinctUntilChanged(isShallowEqual),
-    shareReplay(1)
-  );
-  newSettings$.subscribe(settings$);
-  settings$.pipe(shouldRequireLayout, tap(applyChangeToSpineItem), takeUntil(reader.$.destroy$)).subscribe();
-  const settingsMerge$ = combineLatest([reader.settings.settings$, settings$]).pipe(
-    map(([innerSettings, settings]) => ({
-      ...innerSettings,
-      ...settings
-    }))
-  );
-  const setSettings = (settings) => {
-    const { fontJustification: fontJustification2, fontScale: fontScale2, fontWeight: fontWeight2, lineHeight: lineHeight2, ...passthroughSettings } = settings;
-    changes$.next({ fontJustification: fontJustification2, fontScale: fontScale2, fontWeight: fontWeight2, lineHeight: lineHeight2 });
-    reader.settings.setSettings(passthroughSettings);
-  };
+  settingsManager.settings$.pipe(shouldRequireLayout, tap(applyChangeToSpineItem), takeUntil(reader.$.destroy$)).subscribe();
   return {
     ...reader,
     destroy: () => {
       changes$.complete();
-      settings$.complete();
+      settingsManager.destroy();
       reader.destroy();
     },
-    settings: {
-      ...reader.settings,
-      setSettings,
-      settings$: settingsMerge$
-    }
+    settings: settingsManager
   };
 };
 const hotkeysEnhancer = (next) => (options) => {
   const reader = next(options);
   const navigateOnKey = (document2) => fromEvent(document2, "keyup").pipe(
-    withLatestFrom$1(reader.settings.settings$),
-    map(([e, { pageTurnDirection }]) => {
+    withLatestFrom(reader.settings.settings$),
+    map$1(([e, { pageTurnDirection }]) => {
       if (pageTurnDirection === "horizontal") {
         if (e.key === `ArrowRight`) {
           reader.viewportNavigator.turnRight();
@@ -245,7 +303,7 @@ const createMovingSafePan$ = (reader) => {
   );
   const resetLockViewportFree$ = createResetLock$(viewportFree$).pipe(take(1));
   const pageTurnMode$ = reader.settings.settings$.pipe(
-    map$1(() => reader.settings.settings.computedPageTurnMode),
+    map(() => reader.settings.settings.computedPageTurnMode),
     distinctUntilChanged()
   );
   const handleViewportLock$ = pageTurnMode$.pipe(
@@ -257,7 +315,7 @@ const createMovingSafePan$ = (reader) => {
   return merge(updateOverlayElement$, handleViewportLock$);
 };
 const mapKeysTo = (keys) => {
-  return map$1((obj) => {
+  return map((obj) => {
     return Object.entries(obj).reduce(
       (acc, [key, entry]) => {
         if (keys.includes(key)) {
@@ -292,14 +350,37 @@ const fixReflowable = (reader) => {
 function isDefined(arg) {
   return arg !== null && arg !== void 0;
 }
+class SettingsManager2 extends SettingsManagerOverload {
+  computeOutputSettings() {
+    return this.inputSettings;
+  }
+  hasSettingsChanged(newOutputSettings) {
+    return !isShallowEqual(this.outputSettings, newOutputSettings);
+  }
+  getCleanedParentInputSettings(settings) {
+    const { layoutAutoResize, pageHorizontalMargin, pageVerticalMargin, ...rest } = settings;
+    return rest;
+  }
+  getDefaultSettings() {
+    return {
+      layoutAutoResize: "container",
+      pageHorizontalMargin: 24,
+      pageVerticalMargin: 24
+    };
+  }
+}
 const SHOULD_NOT_LAYOUT = false;
 const layoutEnhancer = (next) => (options) => {
-  const { pageHorizontalMargin = 24, pageVerticalMargin = 24 } = options;
+  const { pageHorizontalMargin, pageVerticalMargin, layoutAutoResize } = options;
   const reader = next(options);
-  const settingsSubject$ = new BehaviorSubject({
-    pageHorizontalMargin,
-    pageVerticalMargin
-  });
+  const settingsManager = new SettingsManager2(
+    {
+      pageHorizontalMargin,
+      pageVerticalMargin,
+      layoutAutoResize
+    },
+    reader.settings
+  );
   reader.hookManager.register(`onViewportOffsetAdjust`, () => {
     let hasRedrawn = false;
     reader.spine.manipulateSpineItems(({ frame }) => {
@@ -312,7 +393,7 @@ const layoutEnhancer = (next) => (options) => {
   });
   reader.hookManager.register(`item.onLayoutBeforeMeasurement`, ({ frame, minimumWidth, item, isImageType }) => {
     var _a, _b;
-    const { pageHorizontalMargin: pageHorizontalMargin2 = 0, pageVerticalMargin: pageVerticalMargin2 = 0 } = settingsSubject$.value;
+    const { pageHorizontalMargin: pageHorizontalMargin2 = 0, pageVerticalMargin: pageVerticalMargin2 = 0 } = settingsManager.settings;
     const pageSize = reader.context.getPageSize();
     if (item.renditionLayout === `reflowable` && frame.getIsReady() && !isImageType() && !frame.getViewportDimensions()) {
       let columnWidth = pageSize.width - pageHorizontalMargin2 * 2;
@@ -353,7 +434,7 @@ const layoutEnhancer = (next) => (options) => {
   let observer;
   if (options.layoutAutoResize === `container`) {
     reader.context.state$.pipe(
-      map$1((state) => state.containerElement),
+      map((state) => state.containerElement),
       filter(isDefined),
       distinctUntilChanged(),
       takeUntil$1(reader.$.destroy$)
@@ -366,7 +447,7 @@ const layoutEnhancer = (next) => (options) => {
   }
   const movingSafePan$ = createMovingSafePan$(reader);
   movingSafePan$.subscribe();
-  settingsSubject$.pipe(
+  settingsManager.settings$.pipe(
     mapKeysTo([`pageHorizontalMargin`, `pageVerticalMargin`]),
     distinctUntilChanged(isShallowEqual),
     skip(1),
@@ -375,32 +456,14 @@ const layoutEnhancer = (next) => (options) => {
     }),
     takeUntil$1(reader.$.destroy$)
   ).subscribe();
-  const settings$ = combineLatest([reader.settings.settings$, settingsSubject$.asObservable()]).pipe(
-    map$1(([innerSettings, settings]) => ({
-      ...innerSettings,
-      ...settings
-    }))
-  );
-  const setSettings = ({ pageVerticalMargin: pageVerticalMargin2, pageHorizontalMargin: pageHorizontalMargin2, ...rest }) => {
-    if (pageHorizontalMargin2 !== void 0 || pageVerticalMargin2 !== void 0) {
-      settingsSubject$.next({
-        pageHorizontalMargin: pageHorizontalMargin2 ?? settingsSubject$.value.pageHorizontalMargin,
-        pageVerticalMargin: pageVerticalMargin2 ?? settingsSubject$.value.pageVerticalMargin
-      });
-    }
-    reader.settings.setSettings(rest);
-  };
   return {
     ...reader,
     destroy: () => {
+      settingsManager.destroy();
       reader.destroy();
       observer == null ? void 0 : observer.disconnect();
     },
-    settings: {
-      ...reader.settings,
-      setSettings,
-      settings$
-    }
+    settings: settingsManager
   };
 };
 const ROOT_NAMESPACE = `@prose-reader/core`;
@@ -571,8 +634,8 @@ const createNavigator = (reader) => {
 };
 const createState = (reader) => {
   return reader.pagination.paginationInfo$.pipe(
-    withLatestFrom$1(reader.context.manifest$, reader.settings.settings$),
-    map(([paginationInfo, manifest, { computedPageTurnDirection }]) => {
+    withLatestFrom(reader.context.manifest$, reader.settings.settings$),
+    map$1(([paginationInfo, manifest, { computedPageTurnDirection }]) => {
       const numberOfSpineItems = (manifest == null ? void 0 : manifest.spineItems.length) ?? 0;
       const isAtAbsoluteBeginning = paginationInfo.beginSpineItemIndex === 0 && paginationInfo.beginPageIndexInSpineItem === 0;
       const isAtAbsoluteEnd = paginationInfo.endPageIndexInSpineItem === paginationInfo.endNumberOfPagesInSpineItem - 1 && paginationInfo.endSpineItemIndex === Math.max(numberOfSpineItems - 1, 0);
@@ -649,8 +712,8 @@ const getChaptersInfo = (reader) => {
 };
 const trackChapterInfo = (reader) => {
   return reader.spine.$.spineItems$.pipe(
-    startWith([]),
-    map(() => getChaptersInfo(reader))
+    startWith$1([]),
+    map$1(() => getChaptersInfo(reader))
   );
 };
 const NAMESPACE$6 = `pagination`;
@@ -752,8 +815,8 @@ const getNumberOfPagesForAllSpineItems = (reader) => reader.spineItemManager.get
 const trackTotalPages = (reader) => {
   const totalPages$ = reader.spine.$.layout$.pipe(
     debounceTime(10, animationFrameScheduler),
-    withLatestFrom$1(reader.pagination.paginationInfo$),
-    map(() => {
+    withLatestFrom(reader.pagination.paginationInfo$),
+    map$1(() => {
       const numberOfPagesPerItems = getNumberOfPagesForAllSpineItems(reader);
       return {
         numberOfPagesPerItems,
@@ -764,7 +827,7 @@ const trackTotalPages = (reader) => {
       };
     }),
     distinctUntilChanged$1(isShallowEqual),
-    startWith({
+    startWith$1({
       numberOfPagesPerItems: [],
       numberOfTotalPages: 0
     })
@@ -824,7 +887,7 @@ const trackPaginationInfo = (reader) => {
   });
   const extandedBasePagination$ = reader.pagination.paginationInfo$.pipe(
     combineLatestWith(chaptersInfo$),
-    map(([info, chaptersInfo]) => ({
+    map$1(([info, chaptersInfo]) => ({
       ...info,
       ...mapPaginationInfoToExtendedInfo(reader)(info, chaptersInfo)
     })),
@@ -834,7 +897,7 @@ const trackPaginationInfo = (reader) => {
     extandedBasePagination$,
     totalPages$
   ]).pipe(
-    map(([pageInfo, totalPageInfo]) => ({
+    map$1(([pageInfo, totalPageInfo]) => ({
       ...pageInfo,
       ...totalPageInfo,
       beginAbsolutePageIndex: totalPageInfo.numberOfPagesPerItems.slice(0, pageInfo.beginSpineItemIndex).reduce((acc, numberOfPagesForItem) => acc + numberOfPagesForItem, pageInfo.beginPageIndexInSpineItem ?? 0),
@@ -1233,22 +1296,22 @@ class Context {
     this.destroy$ = new Subject();
     this.state$ = this._stateSubject.pipe(distinctUntilChanged(isShallowEqual));
     this.manifest$ = this._stateSubject.pipe(
-      map$1((state) => state.manifest),
+      map((state) => state.manifest),
       filter(isDefined),
       distinctUntilChanged()
     );
     this.containerElement$ = this._stateSubject.pipe(
-      map$1((state) => state.containerElement),
+      map((state) => state.containerElement),
       filter(isDefined),
       distinctUntilChanged()
     );
     this.hasVerticalWriting$ = this._stateSubject.pipe(
-      map$1((state) => state.hasVerticalWriting),
+      map((state) => state.hasVerticalWriting),
       filter(isDefined),
       distinctUntilChanged()
     );
     this.isUsingSpreadMode$ = this._stateSubject.pipe(
-      map$1((state) => state.isUsingSpreadMode),
+      map((state) => state.isUsingSpreadMode),
       distinctUntilChanged()
     );
     this.isRTL = () => {
@@ -1441,9 +1504,9 @@ const createLoader = ({
   const unload$ = unloadSubject$.asObservable().pipe(
     // @todo remove iframe when viewport is free
     // @todo use takeUntil(load$) when it's the case to cancel
-    withLatestFrom(frameElementSubject$),
+    withLatestFrom$1(frameElementSubject$),
     filter(([_, frame]) => !!frame),
-    map$1(([, frame]) => {
+    map(([, frame]) => {
       hookManager.destroy(`item.onLoad`, item.id);
       frame == null ? void 0 : frame.remove();
       frameElementSubject$.next(void 0);
@@ -1452,12 +1515,12 @@ const createLoader = ({
     takeUntil$1(destroySubject$)
   );
   const load$ = loadSubject$.asObservable().pipe(
-    withLatestFrom(isLoadedSubject$),
+    withLatestFrom$1(isLoadedSubject$),
     filter(([_, isLoaded]) => !isLoaded),
     // let's ignore later load as long as the first one still runs
     exhaustMap(() => {
       return createFrame$().pipe(
-        mergeMap((frame) => waitForViewportFree$.pipe(map$1(() => frame))),
+        mergeMap((frame) => waitForViewportFree$.pipe(map(() => frame))),
         mergeMap((frame) => {
           parent.appendChild(frame);
           frameElementSubject$.next(frame);
@@ -1475,7 +1538,7 @@ const createLoader = ({
                   frame == null ? void 0 : frame.setAttribute(`srcdoc`, htmlDoc);
                 }
               }),
-              map$1(() => frame),
+              map(() => frame),
               catchError((e) => {
                 Report.error(`Error while trying to fetch or load resource for item ${item.id}`);
                 console.error(e);
@@ -1506,7 +1569,7 @@ const createLoader = ({
                 itemId: item.id,
                 frame
               }).filter((result) => result instanceof Observable);
-              return combineLatest([of(null), ...hookResults]).pipe(map$1(() => frame));
+              return combineLatest([of(null), ...hookResults]).pipe(map(() => frame));
             })
           );
         }),
@@ -1527,8 +1590,8 @@ const createLoader = ({
     makeItHot,
     takeUntil$1(destroySubject$)
   );
-  merge(load$.pipe(map$1(() => true)), unloadSubject$.pipe(map$1(() => false))).pipe(distinctUntilChanged(), takeUntil$1(destroySubject$)).subscribe(isLoadedSubject$);
-  merge(ready$.pipe(map$1(() => true)), unloadSubject$.pipe(map$1(() => false))).pipe(distinctUntilChanged(), takeUntil$1(destroySubject$)).subscribe(isReadySubject$);
+  merge(load$.pipe(map(() => true)), unloadSubject$.pipe(map(() => false))).pipe(distinctUntilChanged(), takeUntil$1(destroySubject$)).subscribe(isLoadedSubject$);
+  merge(ready$.pipe(map(() => true)), unloadSubject$.pipe(map(() => false))).pipe(distinctUntilChanged(), takeUntil$1(destroySubject$)).subscribe(isReadySubject$);
   unload$.subscribe();
   return {
     load: () => loadSubject$.next(),
@@ -1630,8 +1693,8 @@ const createFrameItem = ({
     return createHtmlPageFromResource(response, item);
   };
   const contentLayoutChange$ = merge(
-    unloaded$.pipe(map$1(() => ({ isFirstLayout: false }))),
-    ready$.pipe(map$1(() => ({ isFirstLayout: true })))
+    unloaded$.pipe(map(() => ({ isFirstLayout: false }))),
+    ready$.pipe(map(() => ({ isFirstLayout: true })))
   );
   const destroy = () => {
     unload();
@@ -1950,8 +2013,8 @@ const createCommonSpineItem = ({
     ...options
   });
   const contentLayout$ = spineItemFrame.$.contentLayoutChange$.pipe(
-    withLatestFrom(spineItemFrame.$.isReady$),
-    map$1(([data, isReady]) => ({
+    withLatestFrom$1(spineItemFrame.$.isReady$),
+    map(([data, isReady]) => ({
       isFirstLayout: data.isFirstLayout,
       isReady
     }))
@@ -3623,8 +3686,8 @@ const createSpine = ({
   ).pipe(
     switchMap$1(() => {
       return waitForViewportFree$.pipe(
-        withLatestFrom(currentNavigationPosition$),
-        map$1(([, currentNavigationPosition]) => {
+        withLatestFrom$1(currentNavigationPosition$),
+        map(([, currentNavigationPosition]) => {
           const focusedSpineItemIndex = spineItemManager.getFocusedSpineItemIndex();
           report.log(`update contents`, { focusedSpineItemIndex });
           if (focusedSpineItemIndex === void 0) return;
@@ -3909,7 +3972,7 @@ const createSpineItemManager = ({ context, settings }) => {
       itemIsReady$: orderedSpineItemsSubject$.asObservable().pipe(
         switchMap$1((items) => {
           const itemsIsReady$ = items.map(
-            (item) => item.$.isReady$.pipe(map$1((isReady) => ({ item: item.item, isReady })))
+            (item) => item.$.isReady$.pipe(map((isReady) => ({ item: item.item, isReady })))
           );
           return merge(...itemsIsReady$);
         })
@@ -4528,7 +4591,7 @@ const createScrollViewportNavigator = ({
     return false;
   };
   const runOnFreePageTurnModeOnly$ = (source) => settings.settings$.pipe(
-    map$1(({ computedPageTurnMode }) => computedPageTurnMode),
+    map(({ computedPageTurnMode }) => computedPageTurnMode),
     distinctUntilChanged(),
     switchMap$1((mode) => iif(() => mode === `controlled`, EMPTY, source))
   );
@@ -4571,7 +4634,7 @@ const createScrollViewportNavigator = ({
   };
   const navigationOnScroll$ = userScroll$.pipe(
     debounceTime$1(SCROLL_FINISHED_DEBOUNCE_TIMEOUT, animationFrameScheduler),
-    withLatestFrom(currentNavigationSubject$),
+    withLatestFrom$1(currentNavigationSubject$),
     switchMap$1(() => {
       var _a, _b;
       const navigation = getNavigationForPosition(
@@ -4588,11 +4651,11 @@ const createScrollViewportNavigator = ({
   );
   const state$ = merge(
     userScroll$.pipe(
-      map$1(() => `start`),
+      map(() => `start`),
       distinctUntilChanged()
     ),
-    userScrollEnd$.pipe(map$1(() => `end`))
-  ).pipe(startWith$1(`end`));
+    userScrollEnd$.pipe(map(() => `end`))
+  ).pipe(startWith(`end`));
   return {
     destroy: () => {
     },
@@ -4652,7 +4715,7 @@ const createManualViewportNavigator = ({
   );
   const cfiNavigation$ = navigationTriggerSubject$.pipe(
     filter((e) => e.type === `cfi`),
-    map$1(({ data: { animate, cfi } }) => {
+    map(({ data: { animate, cfi } }) => {
       const navigation = navigator2.getNavigationForCfi(cfi);
       Report.log(NAMESPACE$2, `goToCfi`, { cfi, animate, navigation });
       return {
@@ -4727,7 +4790,7 @@ const createManualViewportNavigator = ({
   );
   const leftPageNavigation$ = navigationTriggerSubject$.pipe(
     filter((e) => e.type === `leftPage`),
-    withLatestFrom(currentNavigationSubject$),
+    withLatestFrom$1(currentNavigationSubject$),
     switchMap$1(
       ([
         {
@@ -4743,7 +4806,7 @@ const createManualViewportNavigator = ({
   );
   const rightPageNavigation$ = navigationTriggerSubject$.pipe(
     filter((e) => e.type === `rightPage`),
-    withLatestFrom(currentNavigationSubject$),
+    withLatestFrom$1(currentNavigationSubject$),
     switchMap$1(
       ([
         {
@@ -4771,9 +4834,9 @@ const createManualViewportNavigator = ({
      * This is because manual navigation is not used with scroll where you can move within the same item. A manual
      * navigation would theoretically always move to different items.
      */
-    withLatestFrom(currentNavigationSubject$),
+    withLatestFrom$1(currentNavigationSubject$),
     filter(([navigation, currentNavigation]) => navigator2.areNavigationDifferent(navigation, currentNavigation)),
-    map$1(([navigation]) => navigation)
+    map(([navigation]) => navigation)
   );
   return {
     destroy: () => {
@@ -4876,7 +4939,7 @@ const createPanViewportNavigator = ({
   );
   const snapNavigation$ = navigationTriggerSubject$.pipe(
     filter((e) => e.type === `snap`),
-    withLatestFrom$1(settings.settings$),
+    withLatestFrom(settings.settings$),
     switchMap$1(
       ([
         {
@@ -5066,7 +5129,7 @@ const createViewportNavigator = ({
     skip(1)
   );
   const layout$ = merge(layoutSubject$, layoutChangeSettings$).pipe(
-    withLatestFrom(element$),
+    withLatestFrom$1(element$),
     tap(([, element]) => {
       if (settings.settings.computedPageTurnMode === `scrollable`) {
         element.style.removeProperty(`transform`);
@@ -5082,7 +5145,7 @@ const createViewportNavigator = ({
   layout$.subscribe();
   const navigation$ = merge(
     panViewportNavigator.$.navigation$.pipe(
-      map$1((event) => ({
+      map((event) => ({
         ...event,
         position: { x: event.x, y: event.y, spineItem: event.spineItem },
         animation: `snap`,
@@ -5090,7 +5153,7 @@ const createViewportNavigator = ({
       }))
     ),
     manualViewportNavigator.$.navigation$.pipe(
-      map$1((event) => ({
+      map((event) => ({
         ...event,
         position: { x: event.x, y: event.y, spineItem: event.spineItem },
         animation: event.animate ? `turn` : false,
@@ -5098,21 +5161,21 @@ const createViewportNavigator = ({
       }))
     ),
     adjustNavigationSubject$.pipe(
-      map$1((event) => ({
+      map((event) => ({
         ...event,
         triggeredBy: `adjust`,
         animation: event.animate ? `turn` : false
       }))
     ),
     scrollViewportNavigator.$.navigation$.pipe(
-      map$1((event) => ({
+      map((event) => ({
         ...event,
         triggeredBy: `scroll`,
         animation: event.animate ? `turn` : false
       }))
     )
   ).pipe(
-    map$1((event) => {
+    map((event) => {
       if (`lastUserExpectedNavigation` in event) {
         lastUserExpectedNavigation = event.lastUserExpectedNavigation;
       }
@@ -5132,10 +5195,10 @@ const createViewportNavigator = ({
     })
   );
   const manualAdjust$ = merge(
-    panViewportNavigator.$.moveToSubject$.asObservable().pipe(map$1((event) => ({ ...event, animation: false }))),
+    panViewportNavigator.$.moveToSubject$.asObservable().pipe(map((event) => ({ ...event, animation: false }))),
     navigationWhichRequireManualAdjust$
   ).pipe(
-    map$1(({ animation, position }) => {
+    map(({ animation, position }) => {
       const shouldAnimate = !(!animation || animation === `turn` && settings.settings.computedPageTurnAnimation === `none`);
       return {
         type: `manualAdjust`,
@@ -5147,7 +5210,7 @@ const createViewportNavigator = ({
     share()
   );
   const processManualAdjust$ = merge(manualAdjust$).pipe(
-    startWith$1(void 0),
+    startWith(void 0),
     pairwise(),
     tap(([prevEvent, currentEvent]) => {
       if ((prevEvent == null ? void 0 : prevEvent.type) === `manualAdjust` && (currentEvent == null ? void 0 : currentEvent.type) !== `manualAdjust`) {
@@ -5157,7 +5220,7 @@ const createViewportNavigator = ({
     }),
     switchMap$1(([, currentEvent]) => {
       if ((currentEvent == null ? void 0 : currentEvent.type) !== `manualAdjust`) return EMPTY;
-      const animationDuration = currentEvent.animation === `snap` ? settings.settings.computedSnapAnimationDuration : settings.settings.computedPageTurnAnimationDuration;
+      const animationDuration = currentEvent.animation === `snap` ? settings.settings.snapAnimationDuration : settings.settings.computedPageTurnAnimationDuration;
       const pageTurnAnimation = currentEvent.animation === `snap` ? `slide` : settings.settings.computedPageTurnAnimation;
       return of(currentEvent).pipe(
         /**
@@ -5222,11 +5285,11 @@ const createViewportNavigator = ({
     takeUntil$1(context.destroy$)
   );
   const adjustmentState$ = merge(
-    merge(manualAdjust$).pipe(map$1(() => `start`)),
-    merge(processManualAdjust$).pipe(map$1(() => `end`))
+    merge(manualAdjust$).pipe(map(() => `start`)),
+    merge(processManualAdjust$).pipe(map(() => `end`))
   );
   const state$ = combineLatest([...viewportNavigators.map(({ $: { state$: state$2 } }) => state$2), adjustmentState$]).pipe(
-    map$1((states) => states.every((state) => state === `end`) ? `free` : `busy`),
+    map((states) => states.every((state) => state === `end`) ? `free` : `busy`),
     distinctUntilChanged(),
     shareReplay(1),
     /**
@@ -5272,7 +5335,7 @@ const createViewportNavigator = ({
     ),
     share()
   );
-  const parentElementSub = parentElement$.pipe(filter(isDefined), withLatestFrom(spine.element$)).subscribe(([parentElement, spineElement]) => {
+  const parentElementSub = parentElement$.pipe(filter(isDefined), withLatestFrom$1(spine.element$)).subscribe(([parentElement, spineElement]) => {
     const element = createElement(parentElement.ownerDocument, hookManager);
     element.appendChild(spineElement);
     parentElement.appendChild(element);
@@ -5505,96 +5568,111 @@ const createCfiLocator = ({
     generateFromRange
   };
 };
-const getComputedSettings = (settings, context) => {
-  const manifest = context.manifest;
-  const hasVerticalWriting = context.state.hasVerticalWriting ?? false;
-  const computedSettings = {
-    computedPageTurnDirection: settings.pageTurnDirection,
-    computedPageTurnAnimation: settings.pageTurnAnimation,
-    computedPageTurnMode: `controlled`,
-    computedPageTurnAnimationDuration: 0,
-    computedSnapAnimationDuration: 0
-  };
-  if ((manifest == null ? void 0 : manifest.renditionFlow) === `scrolled-continuous`) {
-    computedSettings.computedPageTurnMode = `scrollable`;
-    computedSettings.computedPageTurnDirection = `vertical`;
-  } else if (manifest && settings.pageTurnMode === `scrollable` && (manifest.renditionLayout !== `pre-paginated` || !areAllItemsPrePaginated(manifest))) {
-    Report.warn(`pageTurnMode ${settings.pageTurnMode} incompatible with current book, switching back to default`);
-    computedSettings.computedPageTurnAnimation = `none`;
-    computedSettings.computedPageTurnMode = `controlled`;
-  } else if (settings.pageTurnMode === `scrollable`) {
-    computedSettings.computedPageTurnMode = `scrollable`;
-    computedSettings.computedPageTurnDirection = `vertical`;
-  }
-  if (hasVerticalWriting && computedSettings.computedPageTurnAnimation === `slide`) {
-    Report.warn(
-      `pageTurnAnimation ${computedSettings.computedPageTurnAnimation} incompatible with current book, switching back to default`
-    );
-    computedSettings.computedPageTurnAnimation = `none`;
-  }
-  if (computedSettings.computedPageTurnMode === `scrollable`) {
-    computedSettings.computedPageTurnAnimationDuration = 0;
-    computedSettings.computedPageTurnAnimation = `none`;
-  } else {
-    computedSettings.computedPageTurnAnimationDuration = settings.pageTurnAnimationDuration !== void 0 ? settings.pageTurnAnimationDuration : 300;
-  }
-  return computedSettings;
-};
-const defaultSettings = {
-  forceSinglePageMode: false,
-  pageTurnAnimation: `none`,
-  //   computedPageTurnAnimation: `none`,
-  pageTurnDirection: `horizontal`,
-  //   computedPageTurnDirection: `horizontal`,
-  pageTurnAnimationDuration: void 0,
-  //   computedPageTurnAnimationDuration: 0,
-  pageTurnMode: `controlled`,
-  //   computedPageTurnMode: `controlled`,
-  //   computedSnapAnimationDuration: 300,
-  navigationSnapThreshold: 0.3,
-  numberOfAdjacentSpineItemToPreLoad: 0
-};
-class SettingsManager {
+class ReaderSettingsManager {
   constructor(initialSettings, context) {
-    this._context = context;
+    __privateAdd(this, _context);
+    __privateSet(this, _context, context);
     const settingsWithDefaults = {
-      ...defaultSettings,
+      ...this.getDefaultSettings(),
       ...initialSettings
     };
-    const computedSettings = getComputedSettings(settingsWithDefaults, context);
-    const settings = { ...settingsWithDefaults, ...computedSettings };
-    this._settingsSubject$ = new BehaviorSubject(settings);
-    this.settings$ = this._settingsSubject$.asObservable().pipe(distinctUntilChanged(isShallowEqual));
+    const outputSettings = this.getOutputSettings(settingsWithDefaults);
+    this.outputSettings = outputSettings;
+    this.outputSettingsUpdateSubject = new Subject();
+    this.settings$ = this.outputSettingsUpdateSubject.asObservable().pipe(startWith(this.settings), shareReplay(1));
     const recomputeSettingsOnContextChange$ = combineLatest([context.hasVerticalWriting$, context.manifest$]).pipe(
       tap(() => {
-        this._updateSettings(this.settings);
+        this.update(this.settings);
       })
     );
-    const updateContextOnSettingsChanges$ = this._settingsSubject$.pipe(
+    const updateContextOnSettingsChanges$ = this.settings$.pipe(
       tap(({ forceSinglePageMode }) => {
         context.update({ forceSinglePageMode });
       })
     );
     merge(recomputeSettingsOnContextChange$, updateContextOnSettingsChanges$).pipe(takeUntil$1(context.destroy$)).subscribe();
+    this.settings$.subscribe();
+  }
+  getComputedSettings(settings) {
+    const manifest = __privateGet(this, _context).manifest;
+    const hasVerticalWriting = __privateGet(this, _context).state.hasVerticalWriting ?? false;
+    const computedSettings = {
+      computedPageTurnDirection: settings.pageTurnDirection,
+      computedPageTurnAnimation: settings.pageTurnAnimation,
+      computedPageTurnMode: `controlled`,
+      computedPageTurnAnimationDuration: 0
+    };
+    if ((manifest == null ? void 0 : manifest.renditionFlow) === `scrolled-continuous`) {
+      computedSettings.computedPageTurnMode = `scrollable`;
+      computedSettings.computedPageTurnDirection = `vertical`;
+    } else if (manifest && settings.pageTurnMode === `scrollable` && (manifest.renditionLayout !== `pre-paginated` || !areAllItemsPrePaginated(manifest))) {
+      Report.warn(`pageTurnMode ${settings.pageTurnMode} incompatible with current book, switching back to default`);
+      computedSettings.computedPageTurnAnimation = `none`;
+      computedSettings.computedPageTurnMode = `controlled`;
+    } else if (settings.pageTurnMode === `scrollable`) {
+      computedSettings.computedPageTurnMode = `scrollable`;
+      computedSettings.computedPageTurnDirection = `vertical`;
+    }
+    if (hasVerticalWriting && computedSettings.computedPageTurnAnimation === `slide`) {
+      Report.warn(
+        `pageTurnAnimation ${computedSettings.computedPageTurnAnimation} incompatible with current book, switching back to default`
+      );
+      computedSettings.computedPageTurnAnimation = `none`;
+    }
+    if (computedSettings.computedPageTurnMode === `scrollable`) {
+      computedSettings.computedPageTurnAnimationDuration = 0;
+      computedSettings.computedPageTurnAnimation = `none`;
+    } else {
+      computedSettings.computedPageTurnAnimationDuration = settings.pageTurnAnimationDuration !== void 0 ? settings.pageTurnAnimationDuration : 300;
+    }
+    return computedSettings;
   }
-  // @see https://github.com/microsoft/TypeScript/issues/17293
-  _updateSettings(settings) {
-    const computed = getComputedSettings(settings, this._context);
-    const newMergedSettings = { ...settings, ...computed };
-    this._settingsSubject$.next(newMergedSettings);
+  _prepareUpdate(settings) {
+    const state = this.getOutputSettings(settings);
+    const hasChanged = !isShallowEqual(this.outputSettings, state);
+    return {
+      hasChanged,
+      state,
+      commit: () => {
+        this.outputSettings = state;
+        if (hasChanged) {
+          this.outputSettingsUpdateSubject.next(state);
+        }
+      }
+    };
+  }
+  getOutputSettings(inputSettings) {
+    const computedSettings = this.getComputedSettings({ ...this.outputSettings, ...inputSettings });
+    return { ...this.outputSettings, ...inputSettings, ...computedSettings };
   }
-  setSettings(settings) {
-    if (Object.keys(settings).length === 0) return;
-    const newMergedSettings = { ...this._settingsSubject$.value, ...settings };
-    this._updateSettings(newMergedSettings);
+  getDefaultSettings() {
+    return {
+      forceSinglePageMode: false,
+      pageTurnAnimation: `none`,
+      //   computedPageTurnAnimation: `none`,
+      pageTurnDirection: `horizontal`,
+      //   computedPageTurnDirection: `horizontal`,
+      pageTurnAnimationDuration: void 0,
+      //   computedPageTurnAnimationDuration: 0,
+      pageTurnMode: `controlled`,
+      //   computedPageTurnMode: `controlled`,
+      snapAnimationDuration: 300,
+      navigationSnapThreshold: 0.3,
+      numberOfAdjacentSpineItemToPreLoad: 0
+    };
+  }
+  update(settings) {
+    const { commit } = this._prepareUpdate(settings);
+    commit();
   }
   get settings() {
-    return this._settingsSubject$.getValue();
+    return this.outputSettings;
   }
   destroy() {
-    this._settingsSubject$.complete();
+    this.outputSettingsUpdateSubject.complete();
   }
 }
+_context = new WeakMap();
 class HookManager {
   constructor() {
     this._hooks = [];
@@ -5677,7 +5755,7 @@ const createReader = (inputSettings) => {
   const viewportStateSubject = new BehaviorSubject(`free`);
   const hookManager = new HookManager();
   const context = new Context();
-  const settingsManager = new SettingsManager(inputSettings, context);
+  const settingsManager = new ReaderSettingsManager(inputSettings, context);
   const spineItemManager = createSpineItemManager({ context, settings: settingsManager });
   const pagination = createPagination({ context, spineItemManager });
   const elementSubject$ = new BehaviorSubject(void 0);
@@ -5789,9 +5867,9 @@ const createReader = (inputSettings) => {
     takeUntil$1(context.destroy$)
   ).subscribe();
   merge(context.state$, settingsManager.settings$).pipe(
-    map$1(() => void 0),
-    withLatestFrom(context.state$),
-    map$1(([, { hasVerticalWriting }]) => {
+    map(() => void 0),
+    withLatestFrom$1(context.state$),
+    map(([, { hasVerticalWriting }]) => {
       const manifest = context.manifest;
       return {
         hasVerticalWriting,
@@ -5801,7 +5879,7 @@ const createReader = (inputSettings) => {
       };
     }),
     distinctUntilChanged(isShallowEqual),
-    map$1(
+    map(
       ({
         hasVerticalWriting,
         renditionFlow,
@@ -5851,7 +5929,7 @@ const createReader = (inputSettings) => {
        * have an effect.
        * It can typically be used to hide a loading indicator.
        */
-      loadStatus$: context.manifest$.pipe(map$1((manifest) => manifest ? "ready" : "idle")),
+      loadStatus$: context.manifest$.pipe(map((manifest) => manifest ? "ready" : "idle")),
       /**
        * Dispatched when a change in selection happens
        */
@@ -6041,7 +6119,7 @@ const createResourcesManager = (context) => {
       return from(openDatabase(`prose-reader`)).pipe(
         switchMap$1(
           (db) => from(db.keys()).pipe(
-            map$1((keys) => keys.filter((key) => !key.toString().startsWith(uniqueID))),
+            map((keys) => keys.filter((key) => !key.toString().startsWith(uniqueID))),
             switchMap$1((keysToRemove) => {
               const promises = keysToRemove.map((key) => db.remove(key));
               return from(Promise.all(promises));
@@ -6286,7 +6364,7 @@ const loadingEnhancer = (next) => (options) => {
     }, {})
   );
   const updateEntriesLayout$ = (entries) => combineLatest([reader.spine.$.layout$, reader.theme.$.theme$]).pipe(
-    map$1(([, theme]) => ({
+    map(([, theme]) => ({
       width: reader.context.state.visibleAreaRect.width,
       theme
     })),
@@ -6305,7 +6383,7 @@ const loadingEnhancer = (next) => (options) => {
     })
   );
   const destroyEntries$ = (entries) => reader.spine.$.itemsBeforeDestroy$.pipe(
-    map$1(() => {
+    map(() => {
       Object.values(entries).forEach((element) => element.remove());
       return {};
     })