@d-i-t-a/reader 2.1.0-beta.1 → 2.1.0-beta.10

package/dist/esm/index.js

@@ -10118,9 +10118,9 @@ var require_source_map = __commonJS({
   }
 });
 
-// (disabled):path
+// (disabled):node_modules/path/path.js
 var require_path = __commonJS({
-  "(disabled):path"() {
+  "(disabled):node_modules/path/path.js"() {
     init_polyfills();
   }
 });
@@ -13677,6 +13677,231 @@ and ensure you are accounting for this risk.
   }
 });
 
+// node_modules/loglevel/lib/loglevel.js
+var require_loglevel = __commonJS({
+  "node_modules/loglevel/lib/loglevel.js"(exports, module) {
+    init_polyfills();
+    (function(root, definition) {
+      "use strict";
+      if (typeof define === "function" && define.amd) {
+        define(definition);
+      } else if (typeof module === "object" && module.exports) {
+        module.exports = definition();
+      } else {
+        root.log = definition();
+      }
+    })(exports, function() {
+      "use strict";
+      var noop = function() {
+      };
+      var undefinedType = "undefined";
+      var isIE2 = typeof window !== undefinedType && typeof window.navigator !== undefinedType && /Trident\/|MSIE /.test(window.navigator.userAgent);
+      var logMethods = [
+        "trace",
+        "debug",
+        "info",
+        "warn",
+        "error"
+      ];
+      function bindMethod(obj, methodName) {
+        var method = obj[methodName];
+        if (typeof method.bind === "function") {
+          return method.bind(obj);
+        } else {
+          try {
+            return Function.prototype.bind.call(method, obj);
+          } catch (e) {
+            return function() {
+              return Function.prototype.apply.apply(method, [obj, arguments]);
+            };
+          }
+        }
+      }
+      function traceForIE() {
+        if (console.log) {
+          if (console.log.apply) {
+            console.log.apply(console, arguments);
+          } else {
+            Function.prototype.apply.apply(console.log, [console, arguments]);
+          }
+        }
+        if (console.trace)
+          console.trace();
+      }
+      function realMethod(methodName) {
+        if (methodName === "debug") {
+          methodName = "log";
+        }
+        if (typeof console === undefinedType) {
+          return false;
+        } else if (methodName === "trace" && isIE2) {
+          return traceForIE;
+        } else if (console[methodName] !== void 0) {
+          return bindMethod(console, methodName);
+        } else if (console.log !== void 0) {
+          return bindMethod(console, "log");
+        } else {
+          return noop;
+        }
+      }
+      function replaceLoggingMethods(level, loggerName) {
+        for (var i = 0; i < logMethods.length; i++) {
+          var methodName = logMethods[i];
+          this[methodName] = i < level ? noop : this.methodFactory(methodName, level, loggerName);
+        }
+        this.log = this.debug;
+      }
+      function enableLoggingWhenConsoleArrives(methodName, level, loggerName) {
+        return function() {
+          if (typeof console !== undefinedType) {
+            replaceLoggingMethods.call(this, level, loggerName);
+            this[methodName].apply(this, arguments);
+          }
+        };
+      }
+      function defaultMethodFactory(methodName, level, loggerName) {
+        return realMethod(methodName) || enableLoggingWhenConsoleArrives.apply(this, arguments);
+      }
+      function Logger(name, defaultLevel, factory) {
+        var self2 = this;
+        var currentLevel;
+        defaultLevel = defaultLevel == null ? "WARN" : defaultLevel;
+        var storageKey = "loglevel";
+        if (typeof name === "string") {
+          storageKey += ":" + name;
+        } else if (typeof name === "symbol") {
+          storageKey = void 0;
+        }
+        function persistLevelIfPossible(levelNum) {
+          var levelName = (logMethods[levelNum] || "silent").toUpperCase();
+          if (typeof window === undefinedType || !storageKey)
+            return;
+          try {
+            window.localStorage[storageKey] = levelName;
+            return;
+          } catch (ignore) {
+          }
+          try {
+            window.document.cookie = encodeURIComponent(storageKey) + "=" + levelName + ";";
+          } catch (ignore) {
+          }
+        }
+        function getPersistedLevel() {
+          var storedLevel;
+          if (typeof window === undefinedType || !storageKey)
+            return;
+          try {
+            storedLevel = window.localStorage[storageKey];
+          } catch (ignore) {
+          }
+          if (typeof storedLevel === undefinedType) {
+            try {
+              var cookie = window.document.cookie;
+              var location = cookie.indexOf(encodeURIComponent(storageKey) + "=");
+              if (location !== -1) {
+                storedLevel = /^([^;]+)/.exec(cookie.slice(location))[1];
+              }
+            } catch (ignore) {
+            }
+          }
+          if (self2.levels[storedLevel] === void 0) {
+            storedLevel = void 0;
+          }
+          return storedLevel;
+        }
+        function clearPersistedLevel() {
+          if (typeof window === undefinedType || !storageKey)
+            return;
+          try {
+            window.localStorage.removeItem(storageKey);
+            return;
+          } catch (ignore) {
+          }
+          try {
+            window.document.cookie = encodeURIComponent(storageKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 UTC";
+          } catch (ignore) {
+          }
+        }
+        self2.name = name;
+        self2.levels = {
+          "TRACE": 0,
+          "DEBUG": 1,
+          "INFO": 2,
+          "WARN": 3,
+          "ERROR": 4,
+          "SILENT": 5
+        };
+        self2.methodFactory = factory || defaultMethodFactory;
+        self2.getLevel = function() {
+          return currentLevel;
+        };
+        self2.setLevel = function(level, persist) {
+          if (typeof level === "string" && self2.levels[level.toUpperCase()] !== void 0) {
+            level = self2.levels[level.toUpperCase()];
+          }
+          if (typeof level === "number" && level >= 0 && level <= self2.levels.SILENT) {
+            currentLevel = level;
+            if (persist !== false) {
+              persistLevelIfPossible(level);
+            }
+            replaceLoggingMethods.call(self2, level, name);
+            if (typeof console === undefinedType && level < self2.levels.SILENT) {
+              return "No console available for logging";
+            }
+          } else {
+            throw "log.setLevel() called with invalid level: " + level;
+          }
+        };
+        self2.setDefaultLevel = function(level) {
+          defaultLevel = level;
+          if (!getPersistedLevel()) {
+            self2.setLevel(level, false);
+          }
+        };
+        self2.resetLevel = function() {
+          self2.setLevel(defaultLevel, false);
+          clearPersistedLevel();
+        };
+        self2.enableAll = function(persist) {
+          self2.setLevel(self2.levels.TRACE, persist);
+        };
+        self2.disableAll = function(persist) {
+          self2.setLevel(self2.levels.SILENT, persist);
+        };
+        var initialLevel = getPersistedLevel();
+        if (initialLevel == null) {
+          initialLevel = defaultLevel;
+        }
+        self2.setLevel(initialLevel, false);
+      }
+      var defaultLogger = new Logger();
+      var _loggersByName = {};
+      defaultLogger.getLogger = function getLogger(name) {
+        if (typeof name !== "symbol" && typeof name !== "string" || name === "") {
+          throw new TypeError("You must supply a name when creating a logger.");
+        }
+        var logger = _loggersByName[name];
+        if (!logger) {
+          logger = _loggersByName[name] = new Logger(name, defaultLogger.getLevel(), defaultLogger.methodFactory);
+        }
+        return logger;
+      };
+      var _log = typeof window !== undefinedType ? window.log : void 0;
+      defaultLogger.noConflict = function() {
+        if (typeof window !== undefinedType && window.log === defaultLogger) {
+          window.log = _log;
+        }
+        return defaultLogger;
+      };
+      defaultLogger.getLoggers = function getLoggers() {
+        return _loggersByName;
+      };
+      defaultLogger["default"] = defaultLogger;
+      return defaultLogger;
+    });
+  }
+});
+
 // node_modules/debounce/index.js
 var require_debounce = __commonJS({
   "node_modules/debounce/index.js"(exports, module) {
@@ -34139,10 +34364,8 @@ function TaJsonDeserialize(json, type) {
 
 // src/model/Publication.ts
 var Publication = class extends import_publication.Publication {
-  static async fromUrl(url) {
-    const response = await fetch(url.href, {
-      credentials: "same-origin"
-    });
+  static async fromUrl(url, requestConfig) {
+    const response = await fetch(url.href, requestConfig);
     const manifestJSON = await response.json();
     let publication = TaJsonDeserialize(manifestJSON, Publication);
     publication.manifestUrl = url;
@@ -34318,7 +34541,7 @@ var Publication = class extends import_publication.Publication {
     const decodedHref = decodeURI(href) ?? "";
     return this.positions?.filter((p) => decodedHref.includes(p.href));
   }
-  async autoGeneratePositions(getContentBytesLength = fetchContentBytesLength) {
+  async autoGeneratePositions(requestConfig, getContentBytesLength = fetchContentBytesLength) {
     let startPosition = 0;
     let totalContentLength = 0;
     const positions = [];
@@ -34337,7 +34560,7 @@ var Publication = class extends import_publication.Publication {
           startPosition = startPosition + 1;
         } else {
           let href = this.getAbsoluteHref(link.Href);
-          let length = await getContentBytesLength(href);
+          let length = await getContentBytesLength(href, requestConfig);
           link.contentLength = length;
           totalContentLength += length;
           let positionLength = 1024;
@@ -34381,17 +34604,17 @@ var Publication = class extends import_publication.Publication {
     }
     this.positions = positions;
   }
-  async fetchPositionsFromService(href) {
-    const result = await fetch(href);
+  async fetchPositionsFromService(href, requestConfig) {
+    const result = await fetch(href, requestConfig);
     const content = await result.json();
     this.positions = content.positions;
   }
-  async fetchWeightsFromService(href) {
+  async fetchWeightsFromService(href, requestConfig) {
     if (this.isFixedLayout) {
       console.warn("Not fetching weights from service for fixed layout publication.");
       return;
     }
-    const result = await fetch(href);
+    const result = await fetch(href, requestConfig);
     const weights = await result.json();
     if (this.readingOrder !== void 0) {
       this.readingOrder.forEach((link) => {
@@ -34403,8 +34626,8 @@ var Publication = class extends import_publication.Publication {
 Publication = __decorateClass([
   (0, import_ta_json_x2.JsonObject)()
 ], Publication);
-var fetchContentBytesLength = async (href) => {
-  const r = await fetch(href);
+var fetchContentBytesLength = async (href, requestConfig) => {
+  const r = await fetch(href, requestConfig);
   const b = await r.blob();
   return b.size;
 };
@@ -34599,15 +34822,6 @@ function setAttr(element, attr, value) {
   element.setAttribute(attr, value);
 }
 
-// src/utils/index.ts
-init_polyfills();
-function delay(t, v) {
-  return new Promise(function(resolve) {
-    setTimeout(resolve.bind(null, v), t);
-  });
-}
-var IS_DEV = false;
-
 // src/utils/EventHandler.ts
 init_polyfills();
 
@@ -34637,7 +34851,7 @@ var Popup = class {
         absolute = absolute.substring(0, absolute.indexOf("#"));
         event.preventDefault();
         event.stopPropagation();
-        await fetch(absolute).then((r) => r.text()).then(async (data) => {
+        await fetch(absolute, this.navigator.requestConfig).then((r) => r.text()).then(async (data) => {
           const parser = new DOMParser();
           const doc = parser.parseFromString(data, "text/html");
           const element = doc.querySelector("#" + id2);
@@ -34687,7 +34901,7 @@ var Popup = class {
         const d2content = document.createElement("div");
         d2content.className = "d2-popover-content";
         d2wrapper.appendChild(d2content);
-        await fetch(absolute).then((r) => r.text()).then(async (data) => {
+        await fetch(absolute, this.navigator.requestConfig).then((r) => r.text()).then(async (data) => {
           d2content.innerHTML = data;
           let doc = this.navigator.iframes[0].contentDocument;
           if (doc) {
@@ -34813,6 +35027,7 @@ var Popup = class {
 };
 
 // src/utils/EventHandler.ts
+var import_loglevel = __toModule(require_loglevel());
 function addEventListenerOptional(element, eventType, eventListener) {
   if (element) {
     element.addEventListener(eventType, eventListener, true);
@@ -34844,20 +35059,17 @@ var EventHandler = class {
       return !link.Rel?.includes("external") && this.navigator.publication.getRelativeHref(clickedHref).includes(link.Href);
     });
     this.isReadingOrderInternal = (clickedLink) => {
-      if (IS_DEV)
-        console.log("clickedLink: ", clickedLink);
+      import_loglevel.default.log("clickedLink: ", clickedLink);
       const isEpubInternal = this.linkInPublication(this.navigator.publication.readingOrder, clickedLink.href);
       return isEpubInternal;
     };
     this.isResourceInternal = (clickedLink) => {
-      if (IS_DEV)
-        console.log("clickedLink: ", clickedLink);
+      import_loglevel.default.log("clickedLink: ", clickedLink);
       const isEpubInternal = this.linkInPublication(this.navigator.publication.resources, clickedLink.href);
       return isEpubInternal;
     };
     this.handleLinks = async (event) => {
-      if (IS_DEV)
-        console.log("R2 Click Handler");
+      import_loglevel.default.log("R2 Click Handler");
       const link = this.checkForLink(event);
       if (link) {
         const isSameOrigin = window.location.protocol === link.protocol && window.location.port === link.port && window.location.hostname === link.hostname;
@@ -34867,8 +35079,8 @@ var EventHandler = class {
           await this.popup.hidePopover();
         }
         const isInternal = link.href.indexOf("#");
-        if (!isSameOrigin && !isEpubInternal && !isResourceInternal) {
-          window.open(link.href, "_blank");
+        if (!isEpubInternal && !isResourceInternal) {
+          window.open(link.href, link.target ?? "_blank");
           event.preventDefault();
           event.stopPropagation();
         } else {
@@ -35354,6 +35566,7 @@ var FixedBookView = class {
 };
 
 // src/model/user-settings/UserSettings.ts
+var import_loglevel2 = __toModule(require_loglevel());
 var _UserSettings = class {
   constructor(store, headerMenu, api, injectables, layout) {
     this.USERSETTINGS = "userSetting";
@@ -35392,7 +35605,7 @@ var _UserSettings = class {
   }
   async isPaginated() {
     let scroll = await this.getPropertyAndFallback("verticalScroll", ReadiumCSS.SCROLL_KEY);
-    return scroll === false;
+    return !scroll;
   }
   async isScrollMode() {
     return !await this.isPaginated();
@@ -35412,8 +35625,7 @@ var _UserSettings = class {
           prop.value = settings.verticalScroll;
           await settings.saveProperty(prop);
         }
-        if (IS_DEV)
-          console.log(settings.verticalScroll);
+        import_loglevel2.default.log(settings.verticalScroll);
       }
       if (initialUserSettings.appearance) {
         settings.appearance = _UserSettings.appearanceValues.findIndex((el) => el === initialUserSettings.appearance);
@@ -35422,8 +35634,7 @@ var _UserSettings = class {
           prop.value = settings.appearance;
           await settings.saveProperty(prop);
         }
-        if (IS_DEV)
-          console.log(settings.appearance);
+        import_loglevel2.default.log(settings.appearance);
       }
       if (initialUserSettings.fontSize) {
         settings.fontSize = initialUserSettings.fontSize;
@@ -35432,8 +35643,7 @@ var _UserSettings = class {
           prop.value = settings.fontSize;
           await settings.saveProperty(prop);
         }
-        if (IS_DEV)
-          console.log(settings.fontSize);
+        import_loglevel2.default.log(settings.fontSize);
       }
       if (initialUserSettings.fontFamily) {
         settings.fontFamily = _UserSettings.fontFamilyValues.findIndex((el) => el === initialUserSettings.fontFamily);
@@ -35442,8 +35652,7 @@ var _UserSettings = class {
           prop.value = settings.fontFamily;
           await settings.saveProperty(prop);
         }
-        if (IS_DEV)
-          console.log(settings.fontFamily);
+        import_loglevel2.default.log(settings.fontFamily);
         if (settings.fontFamily !== 0) {
           settings.fontOverride = true;
         }
@@ -35455,8 +35664,7 @@ var _UserSettings = class {
           prop.value = settings.textAlignment;
           await settings.saveProperty(prop);
         }
-        if (IS_DEV)
-          console.log(settings.textAlignment);
+        import_loglevel2.default.log(settings.textAlignment);
       }
       if (initialUserSettings.columnCount) {
         settings.columnCount = _UserSettings.columnCountValues.findIndex((el) => el === initialUserSettings.columnCount);
@@ -35465,8 +35673,7 @@ var _UserSettings = class {
           prop.value = settings.columnCount;
           await settings.saveProperty(prop);
         }
-        if (IS_DEV)
-          console.log(settings.columnCount);
+        import_loglevel2.default.log(settings.columnCount);
       }
       if (initialUserSettings.wordSpacing) {
         settings.wordSpacing = initialUserSettings.wordSpacing;
@@ -35475,8 +35682,7 @@ var _UserSettings = class {
           prop.value = settings.wordSpacing;
           await settings.saveProperty(prop);
         }
-        if (IS_DEV)
-          console.log(settings.wordSpacing);
+        import_loglevel2.default.log(settings.wordSpacing);
       }
       if (initialUserSettings.letterSpacing) {
         settings.letterSpacing = initialUserSettings.letterSpacing;
@@ -35485,8 +35691,7 @@ var _UserSettings = class {
           prop.value = settings.letterSpacing;
           await settings.saveProperty(prop);
         }
-        if (IS_DEV)
-          console.log(settings.letterSpacing);
+        import_loglevel2.default.log(settings.letterSpacing);
       }
       if (initialUserSettings.pageMargins) {
         settings.pageMargins = initialUserSettings.pageMargins;
@@ -35495,8 +35700,7 @@ var _UserSettings = class {
           prop.value = settings.pageMargins;
           await settings.saveProperty(prop);
         }
-        if (IS_DEV)
-          console.log(settings.pageMargins);
+        import_loglevel2.default.log(settings.pageMargins);
       }
       if (initialUserSettings.lineHeight) {
         settings.lineHeight = initialUserSettings.lineHeight;
@@ -35505,8 +35709,7 @@ var _UserSettings = class {
           prop.value = settings.lineHeight;
           await settings.saveProperty(prop);
         }
-        if (IS_DEV)
-          console.log(settings.lineHeight);
+        import_loglevel2.default.log(settings.lineHeight);
       }
       settings.userProperties = settings.getUserSettings();
       await settings.initialise();
@@ -35515,9 +35718,7 @@ var _UserSettings = class {
     return new Promise((resolve) => resolve(settings));
   }
   stop() {
-    if (IS_DEV) {
-      console.log("book settings stop");
-    }
+    import_loglevel2.default.log("book settings stop");
   }
   async initialise() {
     this.appearance = await this.getPropertyAndFallback("appearance", ReadiumCSS.APPEARANCE_KEY);
@@ -35675,9 +35876,9 @@ var _UserSettings = class {
       this.view.iframe = iframe;
     }
     if (this.settingsView)
-      this.renderControls(this.settingsView);
+      _UserSettings.renderControls(this.settingsView);
   }
-  renderControls(element) {
+  static renderControls(element) {
     addEventListenerOptional(findElement(element, "ul"), "click", (event) => {
       event.stopPropagation();
     });
@@ -35724,9 +35925,7 @@ var _UserSettings = class {
     };
     if (this.api?.updateSettings) {
       this.api?.updateSettings(userSettings).then((_) => {
-        if (IS_DEV) {
-          console.log("api updated user settings", userSettings);
-        }
+        import_loglevel2.default.log("api updated user settings", JSON.stringify(userSettings));
       });
     }
   }
@@ -36457,11 +36656,12 @@ var HighlightType;
   HighlightType2[HighlightType2["PageBreak"] = 3] = "PageBreak";
   HighlightType2[HighlightType2["Definition"] = 4] = "Definition";
   HighlightType2[HighlightType2["LineFocus"] = 5] = "LineFocus";
+  HighlightType2[HighlightType2["Comment"] = 6] = "Comment";
 })(HighlightType || (HighlightType = {}));
 
 // src/modules/highlight/common/rect-utils.ts
 init_polyfills();
-var IS_DEV2 = false;
+var import_loglevel3 = __toModule(require_loglevel());
 function getClientRectsNoOverlap(range, doNotMergeHorizontallyAlignedRects) {
   const rangeClientRects = range.getClientRects();
   return getClientRectsNoOverlap_(rangeClientRects, doNotMergeHorizontallyAlignedRects);
@@ -36488,24 +36688,16 @@ function getClientRectsNoOverlap_(clientRects, doNotMergeHorizontallyAlignedRect
     const bigEnough = rect.width * rect.height > minArea;
     if (!bigEnough) {
       if (newRects.length > 1) {
-        if (IS_DEV2) {
-          console.log("CLIENT RECT: remove small");
-        }
+        import_loglevel3.default.log("CLIENT RECT: remove small");
         newRects.splice(j, 1);
       } else {
-        if (IS_DEV2) {
-          console.log("CLIENT RECT: remove small, but keep otherwise empty!");
-        }
+        import_loglevel3.default.log("CLIENT RECT: remove small, but keep otherwise empty!");
         break;
       }
     }
   }
-  if (IS_DEV2) {
-    checkOverlaps(newRects);
-  }
-  if (IS_DEV2) {
-    console.log(`CLIENT RECT: reduced ${originalRects.length} --> ${newRects.length}`);
-  }
+  checkOverlaps(newRects);
+  import_loglevel3.default.log(`CLIENT RECT: reduced ${originalRects.length} --> ${newRects.length}`);
   return newRects;
 }
 function almostEqual(a, b, tolerance) {
@@ -36622,9 +36814,7 @@ function mergeTouchingRects(rects, tolerance, doNotMergeHorizontallyAlignedRects
       const rect1 = rects[i];
       const rect2 = rects[j];
       if (rect1 === rect2) {
-        if (IS_DEV2) {
-          console.log("mergeTouchingRects rect1 === rect2 ??!");
-        }
+        import_loglevel3.default.log("mergeTouchingRects rect1 === rect2 ??!");
         continue;
       }
       const rectsLineUpVertically = almostEqual(rect1.top, rect2.top, tolerance) && almostEqual(rect1.bottom, rect2.bottom, tolerance);
@@ -36633,9 +36823,7 @@ function mergeTouchingRects(rects, tolerance, doNotMergeHorizontallyAlignedRects
       const aligned = rectsLineUpHorizontally && horizontalAllowed || rectsLineUpVertically && !rectsLineUpHorizontally;
       const canMerge = aligned && rectsTouchOrOverlap(rect1, rect2, tolerance);
       if (canMerge) {
-        if (IS_DEV2) {
-          console.log(`CLIENT RECT: merging two into one, VERTICAL: ${rectsLineUpVertically} HORIZONTAL: ${rectsLineUpHorizontally} (${doNotMergeHorizontallyAlignedRects})`);
-        }
+        import_loglevel3.default.log(`CLIENT RECT: merging two into one, VERTICAL: ${rectsLineUpVertically} HORIZONTAL: ${rectsLineUpHorizontally} (${doNotMergeHorizontallyAlignedRects})`);
         const newRects = rects.filter((rect) => {
           return rect !== rect1 && rect !== rect2;
         });
@@ -36653,9 +36841,7 @@ function replaceOverlappingRects(rects) {
       const rect1 = rects[i];
       const rect2 = rects[j];
       if (rect1 === rect2) {
-        if (IS_DEV2) {
-          console.log("replaceOverlappingRects rect1 === rect2 ??!");
-        }
+        import_loglevel3.default.log("replaceOverlappingRects rect1 === rect2 ??!");
         continue;
       }
       if (rectsTouchOrOverlap(rect1, rect2, -1)) {
@@ -36679,15 +36865,11 @@ function replaceOverlappingRects(rects) {
             toPreserve = rect1;
           }
         }
-        if (IS_DEV2) {
-          const toCheck = [];
-          toCheck.push(toPreserve);
-          Array.prototype.push.apply(toCheck, toAdd);
-          checkOverlaps(toCheck);
-        }
-        if (IS_DEV2) {
-          console.log(`CLIENT RECT: overlap, cut one rect into ${toAdd.length}`);
-        }
+        const toCheck = [];
+        toCheck.push(toPreserve);
+        Array.prototype.push.apply(toCheck, toAdd);
+        checkOverlaps(toCheck);
+        import_loglevel3.default.log(`CLIENT RECT: overlap, cut one rect into ${toAdd.length}`);
         const newRects = rects.filter((rect) => {
           return rect !== toRemove;
         });
@@ -36709,9 +36891,7 @@ function removeContainedRects(rects, tolerance) {
   for (const rect of rects) {
     const bigEnough = rect.width > 1 && rect.height > 1;
     if (!bigEnough) {
-      if (IS_DEV2) {
-        console.log("CLIENT RECT: remove tiny");
-      }
+      import_loglevel3.default.log("CLIENT RECT: remove tiny");
       rectsToKeep.delete(rect);
       continue;
     }
@@ -36723,9 +36903,7 @@ function removeContainedRects(rects, tolerance) {
         continue;
       }
       if (rectContains(possiblyContainingRect, rect, tolerance)) {
-        if (IS_DEV2) {
-          console.log("CLIENT RECT: remove contained");
-        }
+        import_loglevel3.default.log("CLIENT RECT: remove contained");
         rectsToKeep.delete(rect);
         break;
       }
@@ -36750,46 +36928,38 @@ function checkOverlaps(rects) {
           if (!has2) {
             stillOverlappingRects.push(rect2);
           }
-          if (IS_DEV2) {
-            console.log("CLIENT RECT: overlap ---");
-            console.log(`#1 TOP:${rect1.top} BOTTOM:${rect1.bottom} LEFT:${rect1.left} RIGHT:${rect1.right} WIDTH:${rect1.width} HEIGHT:${rect1.height}`);
-            console.log(`#2 TOP:${rect2.top} BOTTOM:${rect2.bottom} LEFT:${rect2.left} RIGHT:${rect2.right} WIDTH:${rect2.width} HEIGHT:${rect2.height}`);
-            const xOverlap = getRectOverlapX(rect1, rect2);
-            console.log(`xOverlap: ${xOverlap}`);
-            const yOverlap = getRectOverlapY(rect1, rect2);
-            console.log(`yOverlap: ${yOverlap}`);
-          }
+          import_loglevel3.default.log("CLIENT RECT: overlap ---");
+          import_loglevel3.default.log(`#1 TOP:${rect1.top} BOTTOM:${rect1.bottom} LEFT:${rect1.left} RIGHT:${rect1.right} WIDTH:${rect1.width} HEIGHT:${rect1.height}`);
+          import_loglevel3.default.log(`#2 TOP:${rect2.top} BOTTOM:${rect2.bottom} LEFT:${rect2.left} RIGHT:${rect2.right} WIDTH:${rect2.width} HEIGHT:${rect2.height}`);
+          const xOverlap = getRectOverlapX(rect1, rect2);
+          import_loglevel3.default.log(`xOverlap: ${xOverlap}`);
+          const yOverlap = getRectOverlapY(rect1, rect2);
+          import_loglevel3.default.log(`yOverlap: ${yOverlap}`);
         }
       }
     }
   }
   if (stillOverlappingRects.length) {
-    if (IS_DEV2) {
-      console.log(`CLIENT RECT: overlaps ${stillOverlappingRects.length}`);
-    }
+    import_loglevel3.default.log(`CLIENT RECT: overlaps ${stillOverlappingRects.length}`);
   }
 }
 
 // src/modules/highlight/renderer/iframe/selection.ts
 init_polyfills();
-var IS_DEV3 = false;
+var import_loglevel4 = __toModule(require_loglevel());
 function getCurrentSelectionInfo(win, getCssSelector) {
   const selection = win ? win.getSelection() : null;
   if (!selection) {
     return void 0;
   }
   if (selection.isCollapsed) {
-    if (IS_DEV3) {
-      console.log("^^^ SELECTION COLLAPSED.");
-    }
+    import_loglevel4.default.log("^^^ SELECTION COLLAPSED.");
     return void 0;
   }
   const rawText = selection.toString();
   const cleanText = rawText.trim().replace(/\n/g, " ").replace(/\s\s+/g, " ");
   if (cleanText.length === 0) {
-    if (IS_DEV3) {
-      console.log("^^^ SELECTION TEXT EMPTY.");
-    }
+    import_loglevel4.default.log("^^^ SELECTION TEXT EMPTY.");
     return void 0;
   }
   if (!selection.anchorNode || !selection.focusNode) {
@@ -36797,45 +36967,31 @@ function getCurrentSelectionInfo(win, getCssSelector) {
   }
   const r = selection.rangeCount === 1 ? selection.getRangeAt(0) : createOrderedRange(selection.anchorNode, selection.anchorOffset, selection.focusNode, selection.focusOffset);
   if (!r || r.collapsed) {
-    if (IS_DEV3) {
-      console.log("$$$$$$$$$$$$$$$$$ CANNOT GET NON-COLLAPSED SELECTION RANGE?!");
-    }
+    import_loglevel4.default.log("$$$$$$$$$$$$$$$$$ CANNOT GET NON-COLLAPSED SELECTION RANGE?!");
     return void 0;
   }
   const range = normalizeRange(r);
-  if (IS_DEV3) {
-    if (range.startContainer !== r.startContainer) {
-      if (IS_DEV3) {
-        console.log(">>>>>>>>>>>>>>>>>>>>>>> SELECTION RANGE NORMALIZE diff: startContainer");
-        console.log(range.startContainer);
-        console.log(r.startContainer);
-      }
-    }
-    if (range.startOffset !== r.startOffset) {
-      if (IS_DEV3) {
-        console.log(">>>>>>>>>>>>>>>>>>>>>>> SELECTION RANGE NORMALIZE diff: startOffset");
-        console.log(`${range.startOffset} !== ${r.startOffset}`);
-      }
-    }
-    if (range.endContainer !== r.endContainer) {
-      if (IS_DEV3) {
-        console.log(">>>>>>>>>>>>>>>>>>>>>>> SELECTION RANGE NORMALIZE diff: endContainer");
-        console.log(range.endContainer);
-        console.log(r.endContainer);
-      }
-    }
-    if (range.endOffset !== r.endOffset) {
-      if (IS_DEV3) {
-        console.log(">>>>>>>>>>>>>>>>>>>>>>> SELECTION RANGE NORMALIZE diff: endOffset");
-        console.log(`${range.endOffset} !== ${r.endOffset}`);
-      }
-    }
+  if (range.startContainer !== r.startContainer) {
+    import_loglevel4.default.log(">>>>>>>>>>>>>>>>>>>>>>> SELECTION RANGE NORMALIZE diff: startContainer");
+    import_loglevel4.default.log(range.startContainer);
+    import_loglevel4.default.log(r.startContainer);
+  }
+  if (range.startOffset !== r.startOffset) {
+    import_loglevel4.default.log(">>>>>>>>>>>>>>>>>>>>>>> SELECTION RANGE NORMALIZE diff: startOffset");
+    import_loglevel4.default.log(`${range.startOffset} !== ${r.startOffset}`);
+  }
+  if (range.endContainer !== r.endContainer) {
+    import_loglevel4.default.log(">>>>>>>>>>>>>>>>>>>>>>> SELECTION RANGE NORMALIZE diff: endContainer");
+    import_loglevel4.default.log(range.endContainer);
+    import_loglevel4.default.log(r.endContainer);
+  }
+  if (range.endOffset !== r.endOffset) {
+    import_loglevel4.default.log(">>>>>>>>>>>>>>>>>>>>>>> SELECTION RANGE NORMALIZE diff: endOffset");
+    import_loglevel4.default.log(`${range.endOffset} !== ${r.endOffset}`);
   }
   const rangeInfo = convertRange(range, getCssSelector);
   if (!rangeInfo) {
-    if (IS_DEV3) {
-      console.log("^^^ SELECTION RANGE INFO FAIL?!");
-    }
+    import_loglevel4.default.log("^^^ SELECTION RANGE INFO FAIL?!");
     return void 0;
   }
   return { rangeInfo, cleanText, rawText, range };
@@ -36846,26 +37002,18 @@ function createOrderedRange(startNode, startOffset, endNode, endOffset) {
     range.setStart(startNode, startOffset);
     range.setEnd(endNode, endOffset);
     if (!range.collapsed) {
-      if (IS_DEV3) {
-        console.log(">>> createOrderedRange RANGE OK");
-      }
+      import_loglevel4.default.log(">>> createOrderedRange RANGE OK");
       return range;
     }
-    if (IS_DEV3) {
-      console.log(">>> createOrderedRange COLLAPSED ... RANGE REVERSE?");
-    }
+    import_loglevel4.default.log(">>> createOrderedRange COLLAPSED ... RANGE REVERSE?");
     const rangeReverse = new Range();
     rangeReverse.setStart(endNode, endOffset);
     rangeReverse.setEnd(startNode, startOffset);
     if (!rangeReverse.collapsed) {
-      if (IS_DEV3) {
-        console.log(">>> createOrderedRange RANGE REVERSE OK.");
-      }
+      import_loglevel4.default.log(">>> createOrderedRange RANGE REVERSE OK.");
       return range;
     }
-    if (IS_DEV3) {
-      console.log(">>> createOrderedRange RANGE REVERSE ALSO COLLAPSED?!");
-    }
+    import_loglevel4.default.log(">>> createOrderedRange RANGE REVERSE ALSO COLLAPSED?!");
     return void 0;
   } catch (err) {
     console.warn(err.message);
@@ -36895,20 +37043,16 @@ function convertRange(range, getCssSelector) {
   const endContainerElementCssSelector = getCssSelector(endContainerElement);
   const commonElementAncestor = getCommonAncestorElement(range.startContainer, range.endContainer);
   if (!commonElementAncestor) {
-    if (IS_DEV3) {
-      console.log("^^^ NO RANGE COMMON ANCESTOR?!");
-    }
+    import_loglevel4.default.log("^^^ NO RANGE COMMON ANCESTOR?!");
     return void 0;
   }
   if (range.commonAncestorContainer) {
     const rangeCommonAncestorElement = range.commonAncestorContainer.nodeType === Node.ELEMENT_NODE ? range.commonAncestorContainer : range.commonAncestorContainer.parentNode;
     if (rangeCommonAncestorElement && rangeCommonAncestorElement.nodeType === Node.ELEMENT_NODE) {
       if (commonElementAncestor !== rangeCommonAncestorElement) {
-        if (IS_DEV3) {
-          console.log(">>>>>> COMMON ANCESTOR CONTAINER DIFF??!");
-          console.log(getCssSelector(commonElementAncestor));
-          console.log(getCssSelector(rangeCommonAncestorElement));
-        }
+        import_loglevel4.default.log(">>>>>> COMMON ANCESTOR CONTAINER DIFF??!");
+        import_loglevel4.default.log(getCssSelector(commonElementAncestor));
+        import_loglevel4.default.log(getCssSelector(rangeCommonAncestorElement));
       }
     }
   }
@@ -36928,47 +37072,35 @@ function convertRange(range, getCssSelector) {
 function convertRangeInfo(documant, rangeInfo) {
   const startElement = documant.querySelector(rangeInfo.startContainerElementCssSelector);
   if (!startElement) {
-    if (IS_DEV3) {
-      console.log("^^^ convertRangeInfo NO START ELEMENT CSS SELECTOR?!");
-    }
+    import_loglevel4.default.log("^^^ convertRangeInfo NO START ELEMENT CSS SELECTOR?!");
     return void 0;
   }
   let startContainer = startElement;
   if (rangeInfo.startContainerChildTextNodeIndex >= 0) {
     if (rangeInfo.startContainerChildTextNodeIndex >= startElement.childNodes.length) {
-      if (IS_DEV3) {
-        console.log("^^^ convertRangeInfo rangeInfo.startContainerChildTextNodeIndex >= startElement.childNodes.length?!");
-      }
+      import_loglevel4.default.log("^^^ convertRangeInfo rangeInfo.startContainerChildTextNodeIndex >= startElement.childNodes.length?!");
       return void 0;
     }
     startContainer = startElement.childNodes[rangeInfo.startContainerChildTextNodeIndex];
     if (startContainer.nodeType !== Node.TEXT_NODE) {
-      if (IS_DEV3) {
-        console.log("^^^ convertRangeInfo startContainer.nodeType !== Node.TEXT_NODE?!");
-      }
+      import_loglevel4.default.log("^^^ convertRangeInfo startContainer.nodeType !== Node.TEXT_NODE?!");
       return void 0;
     }
   }
   const endElement = documant.querySelector(rangeInfo.endContainerElementCssSelector);
   if (!endElement) {
-    if (IS_DEV3) {
-      console.log("^^^ convertRangeInfo NO END ELEMENT CSS SELECTOR?!");
-    }
+    import_loglevel4.default.log("^^^ convertRangeInfo NO END ELEMENT CSS SELECTOR?!");
     return void 0;
   }
   let endContainer = endElement;
   if (rangeInfo.endContainerChildTextNodeIndex >= 0) {
     if (rangeInfo.endContainerChildTextNodeIndex >= endElement.childNodes.length) {
-      if (IS_DEV3) {
-        console.log("^^^ convertRangeInfo rangeInfo.endContainerChildTextNodeIndex >= endElement.childNodes.length?!");
-      }
+      import_loglevel4.default.log("^^^ convertRangeInfo rangeInfo.endContainerChildTextNodeIndex >= endElement.childNodes.length?!");
       return void 0;
     }
     endContainer = endElement.childNodes[rangeInfo.endContainerChildTextNodeIndex];
     if (endContainer.nodeType !== Node.TEXT_NODE) {
-      if (IS_DEV3) {
-        console.log("^^^ convertRangeInfo endContainer.nodeType !== Node.TEXT_NODE?!");
-      }
+      import_loglevel4.default.log("^^^ convertRangeInfo endContainer.nodeType !== Node.TEXT_NODE?!");
       return void 0;
     }
   }
@@ -37335,6 +37467,7 @@ var AnnotationMarker;
   AnnotationMarker2[AnnotationMarker2["Underline"] = 1] = "Underline";
   AnnotationMarker2[AnnotationMarker2["Bookmark"] = 2] = "Bookmark";
   AnnotationMarker2[AnnotationMarker2["Custom"] = 3] = "Custom";
+  AnnotationMarker2[AnnotationMarker2["Comment"] = 4] = "Comment";
 })(AnnotationMarker || (AnnotationMarker = {}));
 
 // src/utils/IconLib.ts
@@ -37375,6 +37508,7 @@ var icons = {
 
 // src/modules/highlight/TextHighlighter.ts
 var lodash = __toModule(require_lodash());
+var import_loglevel5 = __toModule(require_loglevel());
 var HighlightContainer;
 (function(HighlightContainer2) {
   HighlightContainer2["R2_ID_HIGHLIGHTS_CONTAINER"] = "R2_ID_HIGHLIGHTS_CONTAINER";
@@ -37384,6 +37518,7 @@ var HighlightContainer;
   HighlightContainer2["R2_ID_SEARCH_CONTAINER"] = "R2_ID_SEARCH_CONTAINER";
   HighlightContainer2["R2_ID_DEFINITIONS_CONTAINER"] = "R2_ID_DEFINITIONS_CONTAINER";
   HighlightContainer2["R2_ID_LINEFOCUS_CONTAINER"] = "R2_ID_LINEFOCUS_CONTAINER";
+  HighlightContainer2["R2_ID_GUTTER_RIGHT_CONTAINER"] = "R2_ID_GUTTER_RIGHT_CONTAINER";
 })(HighlightContainer || (HighlightContainer = {}));
 var CLASS_HIGHLIGHT_CONTAINER = "R2_CLASS_HIGHLIGHT_CONTAINER";
 var CLASS_HIGHLIGHT_BOUNDING_AREA = "R2_CLASS_HIGHLIGHT_BOUNDING_AREA";
@@ -37411,6 +37546,7 @@ var _blacklistIdClassForCssSelectors = [
   HighlightContainer.R2_ID_BOOKMAKRS_CONTAINER,
   HighlightContainer.R2_ID_DEFINITIONS_CONTAINER,
   HighlightContainer.R2_ID_LINEFOCUS_CONTAINER,
+  HighlightContainer.R2_ID_GUTTER_RIGHT_CONTAINER,
   CLASS_HIGHLIGHT_CONTAINER,
   CLASS_HIGHLIGHT_AREA,
   CLASS_HIGHLIGHT_BOUNDING_AREA
@@ -37421,6 +37557,12 @@ var TextHighlighter = class {
   constructor(delegate, layerSettings, properties, hasEventListener, options, api) {
     this.lastSelectedHighlight = void 0;
     this.activeAnnotationMarkerId = void 0;
+    this.showTool = (0, import_debounce2.debounce)((b) => {
+      if (!this.isAndroid()) {
+        this.snapSelectionToWord(b);
+      }
+      this.toolboxShow();
+    }, navigator.userAgent.toLowerCase().indexOf("firefox") > -1 ? 200 : 100);
     this.isSelectionMenuOpen = false;
     this.selectionMenuOpened = (0, import_debounce2.debounce)(() => {
       if (!this.isSelectionMenuOpen) {
@@ -37825,8 +37967,6 @@ var TextHighlighter = class {
         colorButton.style.position = "relative";
         colorButton.style.display = "unset";
         colorElements.push(colorButton);
-        const highlightIcon2 = document.getElementById("highlightIcon");
-        const underlineIcon = document.getElementById("underlineIcon");
         if (colorIcon) {
           colorButton.addEventListener("click", function() {
             self2.setColor(color);
@@ -37834,12 +37974,18 @@ var TextHighlighter = class {
             if (colorIconSymbol) {
               colorIconSymbol.style.backgroundColor = color;
             }
+            const highlightIcon2 = document.getElementById("highlightIcon");
+            const underlineIcon = document.getElementById("underlineIcon");
+            const noteIcon = document.getElementById("noteIcon");
             if ((highlightIcon2?.getElementsByTagName?.("span").length ?? 0) > 0) {
               (highlightIcon2?.getElementsByTagName("span")[0]).style.background = self2.getColor();
             }
             if ((underlineIcon?.getElementsByTagName?.("span").length ?? 0) > 0) {
               (underlineIcon?.getElementsByTagName("span")[0]).style.borderBottomColor = self2.getColor();
             }
+            if ((noteIcon?.getElementsByTagName?.("span").length ?? 0) > 0) {
+              (noteIcon?.getElementsByTagName("span")[0]).style.borderBottomColor = self2.getColor();
+            }
             self2.toolboxMode("add");
           });
         }
@@ -37907,20 +38053,14 @@ var TextHighlighter = class {
       toolbox.style.display = "none";
     this.selectionMenuClosed();
   }
-  toolboxShowDelayed(ev) {
-    let self2 = this;
-    setTimeout(function() {
-      if (!self2.isAndroid()) {
-        self2.snapSelectionToWord(ev.detail === 1);
-      }
-      self2.toolboxShow();
-    }, 100);
+  toolboxShowDelayed(event) {
+    this.showTool(event.detail === 1);
   }
   snapSelectionToWord(trimmed = false) {
     let self2 = this;
     let doc = this.delegate.iframes[0].contentDocument;
     if (doc) {
-      let selection = self2.dom(doc.body)?.getWindow()?.getSelection();
+      let selection = self2.dom(doc.body)?.getSelection();
       if (self2.dom(doc.body)) {
         if (selection && !selection?.isCollapsed) {
           let removeTrailingPunctuation = function(text2) {
@@ -37934,7 +38074,7 @@ var TextHighlighter = class {
           let startOffsetTemp = text.length - text.trimStart().length;
           let endOffsetTemp = text.length - text.trimEnd().length;
           let length = text.length;
-          var regex_symbols = /[-!$%^&*()_+|~=`{}\[\]:\/;<>?,.@#]/;
+          var regex_symbols = /[-!$%^&*()_+|~=`{}[\]:/;<>?,.@#]/;
           text = text.replace(regex_symbols, "");
           startOffsetTemp = length - text.trimStart().length;
           text = removeTrailingPunctuation(text);
@@ -37989,7 +38129,6 @@ var TextHighlighter = class {
         return;
       }
       if (this.isIOS()) {
-        this.delegate.iframes[0].contentDocument?.body.removeEventListener("selectionchange", this.toolboxPlacement.bind(this));
         setTimeout(function() {
           let doc = self2.delegate.iframes[0].contentDocument;
           if (doc) {
@@ -37997,6 +38136,25 @@ var TextHighlighter = class {
             selection.removeAllRanges();
             setTimeout(function() {
               selection.addRange(range);
+              function getCssSelector(element) {
+                const options = {
+                  className: (str) => {
+                    return _blacklistIdClassForCssSelectors.indexOf(str) < 0;
+                  },
+                  idName: (str) => {
+                    return _blacklistIdClassForCssSelectors.indexOf(str) < 0;
+                  }
+                };
+                let doc2 = self2.delegate.iframes[0].contentDocument;
+                if (doc2) {
+                  return uniqueCssSelector(element, doc2, options);
+                } else {
+                  return void 0;
+                }
+              }
+              let win = self2.delegate.iframes[0].contentWindow;
+              const selectionInfo = getCurrentSelectionInfo(win, getCssSelector);
+              self2.delegate.annotationModule?.annotator?.saveTemporarySelectionInfo(selectionInfo);
             }, 5);
           }
         }, 100);
@@ -38039,6 +38197,7 @@ var TextHighlighter = class {
         let highlightIcon = document.getElementById("highlightIcon");
         let collapseIcon = document.getElementById("collapseIcon");
         let underlineIcon = document.getElementById("underlineIcon");
+        let noteIcon = document.getElementById("noteIcon");
         let colorIcon = document.getElementById("colorIcon");
         let speakIcon = document.getElementById("speakIcon");
         if (this.delegate.rights.enableAnnotations) {
@@ -38058,6 +38217,14 @@ var TextHighlighter = class {
               }
             }
           }
+          if (noteIcon) {
+            noteIcon.style.display = "unset";
+            if (colorIcon) {
+              if (noteIcon.getElementsByTagName("span").length > 0) {
+                noteIcon.getElementsByTagName("span")[0].style.borderBottomColor = this.getColor();
+              }
+            }
+          }
           if (colorIcon) {
             colorIcon.style.display = "unset";
             let colorIconSymbol = colorIcon.lastChild;
@@ -38069,7 +38236,10 @@ var TextHighlighter = class {
               self2.toolboxHide();
               highlightIcon?.removeEventListener("click", highlightEvent);
             };
-            highlightIcon.addEventListener("click", highlightEvent);
+            const clone = highlightIcon.cloneNode(true);
+            highlightIcon?.parentNode?.replaceChild(clone, highlightIcon);
+            highlightIcon = document.getElementById("highlightIcon");
+            highlightIcon?.addEventListener("click", highlightEvent);
           }
           if (underlineIcon) {
             let commentEvent = function() {
@@ -38077,7 +38247,21 @@ var TextHighlighter = class {
               self2.toolboxHide();
               underlineIcon?.removeEventListener("click", commentEvent);
             };
-            underlineIcon.addEventListener("click", commentEvent);
+            const clone = underlineIcon.cloneNode(true);
+            underlineIcon?.parentNode?.replaceChild(clone, underlineIcon);
+            underlineIcon = document.getElementById("underlineIcon");
+            underlineIcon?.addEventListener("click", commentEvent);
+          }
+          if (noteIcon) {
+            let commentEvent = function() {
+              self2.doHighlight(false, AnnotationMarker.Comment);
+              self2.toolboxHide();
+              noteIcon?.removeEventListener("click", commentEvent);
+            };
+            const clone = noteIcon.cloneNode(true);
+            noteIcon?.parentNode?.replaceChild(clone, noteIcon);
+            noteIcon = document.getElementById("noteIcon");
+            noteIcon?.addEventListener("click", commentEvent);
           }
         } else {
           if (highlightIcon) {
@@ -38086,6 +38270,9 @@ var TextHighlighter = class {
           if (underlineIcon) {
             underlineIcon.style.setProperty("display", "none");
           }
+          if (noteIcon) {
+            noteIcon.style.setProperty("display", "none");
+          }
           if (colorIcon) {
             colorIcon.style.setProperty("display", "none");
           }
@@ -38099,7 +38286,10 @@ var TextHighlighter = class {
               speakIcon?.removeEventListener("click", speakEvent);
               self2.speak();
             };
-            speakIcon.addEventListener("click", speakEvent);
+            const clone = speakIcon.cloneNode(true);
+            speakIcon?.parentNode?.replaceChild(clone, speakIcon);
+            speakIcon = document.getElementById("speakIcon");
+            speakIcon?.addEventListener("click", speakEvent);
           }
         } else {
           if (speakIcon) {
@@ -38111,7 +38301,7 @@ var TextHighlighter = class {
             if (menuItem.icon) {
               menuItem.icon.id = menuItem.id;
             }
-            const itemElement = document.getElementById(menuItem.id);
+            let itemElement = document.getElementById(menuItem.id);
             const self3 = this;
             function itemEvent() {
               itemElement?.removeEventListener("click", itemEvent);
@@ -38133,7 +38323,11 @@ var TextHighlighter = class {
               }
               let win = self3.delegate.iframes[0].contentWindow;
               if (win) {
-                const selectionInfo = getCurrentSelectionInfo(win, getCssSelector);
+                let selectionInfo = getCurrentSelectionInfo(win, getCssSelector);
+                if (selectionInfo === void 0) {
+                  let doc = self3.delegate.iframes[0].contentDocument;
+                  selectionInfo = self3.delegate.annotationModule?.annotator?.getTemporarySelectionInfo(doc);
+                }
                 if (selectionInfo !== void 0) {
                   if (menuItem.callback) {
                     menuItem.callback(selectionInfo.cleanText, selectionInfo.range?.startContainer.parentElement);
@@ -38149,13 +38343,12 @@ var TextHighlighter = class {
                           self3.delegate.annotationModule?.saveAnnotation(highlight[0]).then((anno) => {
                             if (menuItem?.note) {
                               if (anno.highlight) {
-                                anno.highlight.note = prompt("Add your note here:");
+                                self3.delegate.annotationModule?.api?.addCommentToAnnotation(anno).then((result) => {
+                                  self3.delegate.annotationModule?.updateAnnotation(result).then(async () => {
+                                    import_loglevel5.default.log("update highlight " + result.id);
+                                  });
+                                });
                               }
-                              self3.delegate.annotationModule?.updateAnnotation(anno).then(async () => {
-                                if (IS_DEV) {
-                                  console.log("update highlight " + anno.id);
-                                }
-                              });
                             }
                           });
                         } else if (self3.delegate.rights.enableBookmarks) {
@@ -38169,7 +38362,10 @@ var TextHighlighter = class {
               self3.callbackComplete();
             }
             if (itemElement) {
-              itemElement.addEventListener("click", itemEvent);
+              const clone = itemElement.cloneNode(true);
+              itemElement?.parentNode?.replaceChild(clone, itemElement);
+              itemElement = document.getElementById(menuItem.id);
+              itemElement?.addEventListener("click", itemEvent);
             }
           });
         }
@@ -38196,7 +38392,11 @@ var TextHighlighter = class {
     }
     let win = self2.delegate.iframes[0].contentWindow;
     if (win) {
-      const selectionInfo = getCurrentSelectionInfo(win, getCssSelector);
+      let selectionInfo = getCurrentSelectionInfo(win, getCssSelector);
+      if (selectionInfo === void 0) {
+        let doc = self2.delegate.iframes[0].contentDocument;
+        selectionInfo = this.delegate.annotationModule?.annotator?.getTemporarySelectionInfo(doc);
+      }
       if (selectionInfo) {
         if (this.options.onBeforeHighlight(selectionInfo) === true) {
           let createColor;
@@ -38246,7 +38446,11 @@ var TextHighlighter = class {
       let self2 = this;
       let win = self2.delegate.iframes[0].contentWindow;
       if (win) {
-        const selectionInfo = getCurrentSelectionInfo(win, getCssSelector);
+        let selectionInfo = getCurrentSelectionInfo(win, getCssSelector);
+        if (selectionInfo === void 0) {
+          let doc2 = self2.delegate.iframes[0].contentDocument;
+          selectionInfo = self2.delegate.annotationModule?.annotator?.getTemporarySelectionInfo(doc2);
+        }
         if (selectionInfo !== void 0) {
           this.delegate.ttsModule.speak(selectionInfo, true, () => {
           });
@@ -38341,11 +38545,9 @@ var TextHighlighter = class {
           range.detach();
           return rect;
         } catch (error) {
-          if (IS_DEV) {
-            console.log("measureTextNode " + error);
-            console.log("measureTextNode " + node);
-            console.log(node.textContent);
-          }
+          import_loglevel5.default.log("measureTextNode " + error);
+          import_loglevel5.default.log("measureTextNode " + node);
+          import_loglevel5.default.log(`${node.textContent}`);
         }
       };
       const body = findRequiredIframeElement(doc, "body");
@@ -38537,7 +38739,7 @@ var TextHighlighter = class {
               highlightArea.classList.remove("hover");
             }
           }
-        } else if (highlight.marker === AnnotationMarker.Underline) {
+        } else if (highlight.marker === AnnotationMarker.Underline || highlight.marker === AnnotationMarker.Comment) {
           if (typeof highlight.color === "object") {
             let color = highlight.color;
             highlightArea.style.setProperty("background-color", `rgba(${color.red}, ${color.green}, ${color.blue}, ${0})`, "important");
@@ -38611,7 +38813,7 @@ var TextHighlighter = class {
             highlightArea.classList.add("hover");
           }
         }
-      } else if (highlight.marker === AnnotationMarker.Underline) {
+      } else if (highlight.marker === AnnotationMarker.Underline || highlight.marker === AnnotationMarker.Comment) {
         if (typeof highlight.color === "object") {
           let color = highlight.color;
           highlightArea.style.setProperty("background-color", `rgba(${color.red}, ${color.green}, ${color.blue}, ${0.1})`, "important");
@@ -38797,9 +38999,7 @@ var TextHighlighter = class {
         const payload = {
           highlight: foundHighlight
         };
-        if (IS_DEV) {
-          console.log(payload);
-        }
+        import_loglevel5.default.log(JSON.stringify(payload));
         let self2 = this;
         let anno;
         if (self2.delegate.rights.enableAnnotations) {
@@ -38812,9 +39012,7 @@ var TextHighlighter = class {
           });
         }
         if (anno?.id) {
-          if (IS_DEV) {
-            console.log("selected highlight " + anno.id);
-          }
+          import_loglevel5.default.log("selected highlight " + anno.id);
           self2.lastSelectedHighlight = anno.id;
           let toolbox = document.getElementById("highlight-toolbox");
           if (toolbox) {
@@ -38822,27 +39020,24 @@ var TextHighlighter = class {
             toolbox.style.left = ev.clientX + "px";
             if (getComputedStyle(toolbox).display === "none") {
               let noteH = function() {
-                anno.highlight.note = prompt("Add your note here:");
-                self2.delegate.annotationModule?.updateAnnotation(anno).then(async () => {
-                  if (IS_DEV) {
-                    console.log("update highlight " + anno.id);
-                  }
+                self2.delegate.annotationModule?.api?.addCommentToAnnotation(anno).then((result) => {
+                  self2.delegate.annotationModule?.updateAnnotation(result).then(async () => {
+                    import_loglevel5.default.log("update highlight " + result.id);
+                    if (toolbox) {
+                      toolbox.style.display = "none";
+                    }
+                    self2.selectionMenuClosed();
+                  });
                   if (toolbox) {
                     toolbox.style.display = "none";
                   }
                   self2.selectionMenuClosed();
+                  commentIcon?.removeEventListener("click", noteH, false);
                 });
-                if (toolbox) {
-                  toolbox.style.display = "none";
-                }
-                self2.selectionMenuClosed();
-                commentIcon?.removeEventListener("click", noteH, false);
               }, deleteH = function() {
                 if (self2.delegate.rights.enableAnnotations) {
                   self2.delegate.annotationModule?.deleteSelectedHighlight(anno).then(async () => {
-                    if (IS_DEV) {
-                      console.log("delete highlight " + anno.id);
-                    }
+                    import_loglevel5.default.log("delete highlight " + anno.id);
                     if (toolbox) {
                       toolbox.style.display = "none";
                     }
@@ -38850,9 +39045,7 @@ var TextHighlighter = class {
                   });
                 } else if (self2.delegate.rights.enableBookmarks) {
                   self2.delegate.bookmarkModule?.deleteSelectedHighlight(anno).then(async () => {
-                    if (IS_DEV) {
-                      console.log("delete highlight " + anno.id);
-                    }
+                    import_loglevel5.default.log("delete highlight " + anno.id);
                     if (toolbox) {
                       toolbox.style.display = "none";
                     }
@@ -38921,7 +39114,7 @@ var TextHighlighter = class {
             popup.showPopup(foundElement.dataset.definition, ev);
           }
           let result = this.delegate.definitionsModule?.properties?.definitions?.filter((el) => el.order === Number(foundElement?.dataset.order))[0];
-          console.log(result);
+          import_loglevel5.default.log(result);
           if (this.delegate.definitionsModule?.api?.click) {
             this.delegate.definitionsModule.api?.click(lodash.omit(result, "callbacks"), lodash.omit(foundHighlight, "definition"));
             this.delegate.emit("definition.click", result, foundHighlight);
@@ -38940,7 +39133,9 @@ var TextHighlighter = class {
     if (!doc.getElementById(id2)) {
       let container = doc.createElement("div");
       container.setAttribute("id", id2);
-      container.style.setProperty("pointer-events", "none");
+      if (id2 !== HighlightContainer.R2_ID_GUTTER_RIGHT_CONTAINER) {
+        container.style.setProperty("pointer-events", "none");
+      }
       if (this.delegate.view?.layout === "fixed") {
         container.style.setProperty("position", "absolute");
         container.style.setProperty("top", "0");
@@ -39006,6 +39201,12 @@ var TextHighlighter = class {
             this.removeAllChildNodes(container);
           }
           break;
+        case HighlightType.Comment:
+          container = doc.getElementById(HighlightContainer.R2_ID_GUTTER_RIGHT_CONTAINER);
+          if (container) {
+            this.removeAllChildNodes(container);
+          }
+          break;
         default:
           container = doc.getElementById(HighlightContainer.R2_ID_HIGHLIGHTS_CONTAINER);
           if (container) {
@@ -39104,7 +39305,7 @@ var TextHighlighter = class {
       highlightArea.setAttribute("class", CLASS_HIGHLIGHT_AREA);
       highlightArea.dataset.marker = "" + highlight.marker;
       let extra = "";
-      if (drawUnderline && highlight.marker !== AnnotationMarker.Custom && highlight.marker !== AnnotationMarker.Bookmark) {
+      if (drawUnderline && highlight.marker !== AnnotationMarker.Custom && highlight.marker !== AnnotationMarker.Bookmark && highlight.marker !== AnnotationMarker.Comment) {
         let color = highlight.color;
         if (TextHighlighter.isHexColor(color)) {
           color = TextHighlighter.hexToRgbChannels(color);
@@ -39122,7 +39323,7 @@ var TextHighlighter = class {
           highlightArea.classList.add(highlight.style?.defaultClass);
           highlightArea.setAttribute("style", `mix-blend-mode: multiply; border-radius: ${roundedCorner}px !important; ${extra}`);
         }
-      } else if (highlight.marker === AnnotationMarker.Underline) {
+      } else if (highlight.marker === AnnotationMarker.Underline || highlight.marker === AnnotationMarker.Comment) {
         if (typeof highlight.color === "object") {
           let color = highlight.color;
           highlightArea.setAttribute("style", `mix-blend-mode: multiply; border-radius: ${roundedCorner}px !important; background-color: rgba(${color.red}, ${color.green}, ${color.blue}, ${0}) !important; ${extra}`);
@@ -39255,8 +39456,10 @@ var TextHighlighter = class {
       let half = third * 2;
       highlightAreaIcon.setAttribute("style", `position: absolute;top:${position}px;left:${parseInt(highlightBounding.style.left.replace("px", "")) + parseInt(highlightBounding.style.width.replace("px", "")) - half}px;height:${size}px; width:${size}px;`);
     } else {
-      if (highlight.note && highlight.marker !== AnnotationMarker.Custom && highlight.marker !== AnnotationMarker.Bookmark) {
+      if (highlight.note && highlight.marker !== AnnotationMarker.Custom && highlight.marker !== AnnotationMarker.Bookmark && highlight.marker !== AnnotationMarker.Comment && highlight.marker !== AnnotationMarker.Highlight && highlight.marker !== AnnotationMarker.Underline) {
         highlightAreaIcon.setAttribute("style", `position: absolute;top:${position - size / 2}px;left:${parseInt(highlightBounding.style.left.replace("px", "")) + parseInt(highlightBounding.style.width.replace("px", "")) - size / 2}px;height:${size}px; width:${size}px;`);
+      } else if (highlight.note && highlight.marker === AnnotationMarker.Comment || highlight.marker === AnnotationMarker.Highlight || highlight.marker === AnnotationMarker.Underline) {
+        highlightAreaIcon.setAttribute("style", `position: absolute;top:${position}px;left:${left + this.delegate.iframes[0].contentDocument?.scrollingElement?.scrollLeft}px;height:${size}px; width:${size}px;`);
       } else {
         highlightAreaIcon.setAttribute("style", `position: absolute;top:${position}px;left:${left + this.delegate.iframes[0].contentDocument?.scrollingElement?.scrollLeft}px;height:${size}px; width:${size}px;`);
       }
@@ -39267,7 +39470,7 @@ var TextHighlighter = class {
         highlightAreaIcon.id = highlight.icon?.id;
       } else if (highlight.icon?.svgPath) {
         highlightAreaIcon.innerHTML = iconTemplateColored(`${highlight.icon?.id}`, `${highlight.icon?.title}`, `${highlight.icon?.svgPath}`, `icon open`, size, `${highlight.icon?.color} !important`);
-      } else {
+      } else if (highlight.icon?.title) {
         highlightAreaIcon.innerHTML = highlight.icon?.title;
       }
     } else {
@@ -39276,7 +39479,11 @@ var TextHighlighter = class {
         if (TextHighlighter.isHexColor(color)) {
           color = TextHighlighter.hexToRgbChannels(color);
         }
-        highlightAreaIcon.innerHTML = iconTemplateColored(`note-icon`, `Note`, `<rect fill="none" height="24" width="24"/><path d="M19,5v9l-5,0l0,5H5V5H19 M19,3H5C3.9,3,3,3.9,3,5v14c0,1.1,0.9,2,2,2h10l6-6V5C21,3.9,20.1,3,19,3z M12,14H7v-2h5V14z M17,10H7V8h10V10z"/>`, `icon open`, size, `rgba(${color.red}, ${color.green}, ${color.blue}, 1) !important`);
+        if (highlight.marker === AnnotationMarker.Comment || highlight.marker === AnnotationMarker.Highlight || highlight.marker === AnnotationMarker.Underline) {
+          highlightAreaIcon.innerHTML = iconTemplateColored(``, ``, `<path d="M24 24H0V0h24v24z" fill="none"/><circle cx="12" cy="12" r="14"/>`, `icon open`, size / 2, `rgba(${color.red}, ${color.green}, ${color.blue}, 1) !important`);
+        } else {
+          highlightAreaIcon.innerHTML = iconTemplateColored(`note-icon`, `Note`, `<rect fill="none" height="24" width="24"/><path d="M19,5v9l-5,0l0,5H5V5H19 M19,3H5C3.9,3,3,3.9,3,5v14c0,1.1,0.9,2,2,2h10l6-6V5C21,3.9,20.1,3,19,3z M12,14H7v-2h5V14z M17,10H7V8h10V10z"/>`, `icon open`, size, `rgba(${color.red}, ${color.green}, ${color.blue}, 1) !important`);
+        }
       }
     }
     highlightAreaIcon.style.setProperty("pointer-events", "all");
@@ -39291,9 +39498,7 @@ var TextHighlighter = class {
         } else if (self2.delegate.rights.enableBookmarks) {
           anno = await self2.delegate.bookmarkModule?.getAnnotationByID(highlight.id);
         }
-        if (IS_DEV) {
-          console.log("selected highlight " + anno.id);
-        }
+        import_loglevel5.default.log("selected highlight " + anno.id);
         self2.lastSelectedHighlight = anno.id;
         let toolbox = document.getElementById("highlight-toolbox");
         if (toolbox) {
@@ -39301,30 +39506,25 @@ var TextHighlighter = class {
           toolbox.style.left = ev.clientX + "px";
           if (getComputedStyle(toolbox).display === "none") {
             let noteH = function() {
-              anno.highlight.note = prompt("Add your note here:");
-              self2.delegate.annotationModule?.updateAnnotation(anno).then(async () => {
-                if (IS_DEV) {
-                  console.log("update highlight " + anno.id);
-                }
+              self2.delegate.annotationModule?.api?.addCommentToAnnotation(anno).then((result) => {
+                self2.delegate.annotationModule?.updateAnnotation(result).then(async () => {
+                  import_loglevel5.default.log("update highlight " + result.id);
+                  toolbox.style.display = "none";
+                  self2.selectionMenuClosed();
+                });
                 toolbox.style.display = "none";
                 self2.selectionMenuClosed();
               });
-              toolbox.style.display = "none";
-              self2.selectionMenuClosed();
             }, deleteH = function() {
               if (self2.delegate.rights.enableAnnotations) {
                 self2.delegate.annotationModule?.deleteSelectedHighlight(anno).then(async () => {
-                  if (IS_DEV) {
-                    console.log("delete highlight " + anno.id);
-                  }
+                  import_loglevel5.default.log("delete highlight " + anno.id);
                   toolbox.style.display = "none";
                   self2.selectionMenuClosed();
                 });
               } else if (self2.delegate.rights.enableBookmarks) {
                 self2.delegate.bookmarkModule?.deleteSelectedHighlight(anno).then(async () => {
-                  if (IS_DEV) {
-                    console.log("delete highlight " + anno.id);
-                  }
+                  import_loglevel5.default.log("delete highlight " + anno.id);
                   toolbox.style.display = "none";
                   self2.selectionMenuClosed();
                 });
@@ -39407,7 +39607,6 @@ var TextHighlighter = class {
         tooltip.style.setProperty("background", "lightyellow");
         tooltip.style.setProperty("color", "black");
       }
-      highlightAreaIcon.insertBefore(tooltip, highlightAreaIcon.childNodes[0]);
     }
     if (highlight.note || highlight.marker === AnnotationMarker.Custom || highlight.marker === AnnotationMarker.Bookmark) {
       highlightParent.append(highlightAreaIcon);
@@ -39443,6 +39642,7 @@ var import_uuid = __toModule(require_uuid());
 
 // src/modules/highlight/common/selection.ts
 init_polyfills();
+var import_loglevel6 = __toModule(require_loglevel());
 var _getCssSelectorOptions = {
   className: (_str) => {
     return true;
@@ -39457,6 +39657,7 @@ var _getCssSelectorOptions = {
 
 // src/modules/AnnotationModule.ts
 var lodash2 = __toModule(require_lodash());
+var import_loglevel7 = __toModule(require_loglevel());
 var AnnotationModule = class {
   constructor(annotator, rights, publication, delegate, initialAnnotations, properties, highlighter, api, headerMenu) {
     this.hide = findElement(document, "#menu-button-hide");
@@ -39477,9 +39678,7 @@ var AnnotationModule = class {
     return annotations;
   }
   async stop() {
-    if (IS_DEV) {
-      console.log("Annotation module stop");
-    }
+    import_loglevel7.default.log("Annotation module stop");
   }
   async start() {
     this.delegate.annotationModule = this;
@@ -39525,7 +39724,7 @@ var AnnotationModule = class {
     setTimeout(async () => {
       await this.drawHighlights();
       await this.showHighlights();
-    }, 100);
+    }, 200);
   }
   initialize() {
     return new Promise(async (resolve) => {
@@ -39562,8 +39761,8 @@ var AnnotationModule = class {
                 return "";
               }
             } catch (err) {
-              console.log("uniqueCssSelector:");
-              console.log(err);
+              import_loglevel7.default.log("uniqueCssSelector:");
+              import_loglevel7.default.error(err);
               return "";
             }
           };
@@ -39584,9 +39783,7 @@ var AnnotationModule = class {
             let book = this.delegate.highlighter?.createHighlight(this.delegate.highlighter?.dom(doc.body).getWindow(), selectionInfo, menuItem.highlight.color, true, AnnotationMarker.Bookmark, menuItem.icon, menuItem.popup, menuItem.highlight.style);
             if (book) {
               this.saveAnnotation(book[0]).then((anno) => {
-                if (IS_DEV) {
-                  console.log("saved bookmark " + anno.id);
-                }
+                import_loglevel7.default.log("saved bookmark " + anno.id);
               });
             }
           }
@@ -39596,20 +39793,19 @@ var AnnotationModule = class {
     }
   }
   async scrollToHighlight(id2) {
-    if (IS_DEV) {
-      console.log("still need to scroll to " + id2);
-    }
-    var position = await this.annotator?.getAnnotationPosition(id2, this.delegate.iframes[0].contentWindow);
-    window.scrollTo(0, position - window.innerHeight / 3);
+    import_loglevel7.default.log("still need to scroll to " + id2);
+    var element = await this.annotator?.getAnnotationElement(id2, this.delegate.iframes[0].contentWindow);
+    element.scrollIntoView({
+      block: "center",
+      behavior: "smooth"
+    });
   }
   async updateLocalHighlight(annotation) {
     if (this.annotator) {
       let deleted = await this.annotator.deleteAnnotation(annotation.id);
       let added = await this.addAnnotation(annotation);
-      if (IS_DEV) {
-        console.log("Highlight deleted " + JSON.stringify(deleted));
-        console.log("Highlight added " + JSON.stringify(added));
-      }
+      import_loglevel7.default.log("Highlight deleted " + JSON.stringify(deleted));
+      import_loglevel7.default.log("Highlight added " + JSON.stringify(added));
       await this.showHighlights();
       await this.drawHighlights();
       return added;
@@ -39620,9 +39816,7 @@ var AnnotationModule = class {
   async deleteLocalHighlight(id2) {
     if (this.annotator) {
       var deleted = await this.annotator.deleteAnnotation(id2);
-      if (IS_DEV) {
-        console.log("Highlight deleted " + JSON.stringify(deleted));
-      }
+      import_loglevel7.default.log("Highlight deleted " + JSON.stringify(deleted));
       await this.showHighlights();
       await this.drawHighlights();
       return deleted;
@@ -39719,11 +39913,16 @@ var AnnotationModule = class {
         }
         if (annotation) {
           if (this.api?.addAnnotation) {
-            let result = await this.api.addAnnotation(annotation);
-            const saved = await this.annotator.saveAnnotation(result);
-            await this.showHighlights();
-            await this.drawHighlights();
-            return new Promise((resolve) => resolve(saved));
+            try {
+              let result = await this.api.addAnnotation(annotation);
+              const saved = await this.annotator.saveAnnotation(result);
+              await this.showHighlights();
+              await this.drawHighlights();
+              return new Promise((resolve) => resolve(saved));
+            } catch (error) {
+              await this.showHighlights();
+              await this.drawHighlights();
+            }
           } else {
             const saved = await this.annotator.saveAnnotation(annotation);
             await this.showHighlights();
@@ -39853,6 +40052,65 @@ var AnnotationModule = class {
       if (this.properties?.initialAnnotationColor) {
         this.highlighter.setColor(this.properties?.initialAnnotationColor);
       }
+      this.repositionGutters();
+    }
+  }
+  repositionGutters() {
+    let doc = this.delegate.iframes[0].contentDocument;
+    if (doc) {
+      this.commentGutter = doc.getElementById(HighlightContainer.R2_ID_GUTTER_RIGHT_CONTAINER);
+      if (this.delegate.view?.isScrollMode() && this.properties?.enableComments) {
+        this.commentGutter.style.removeProperty("display");
+      } else {
+        this.commentGutter.style.setProperty("display", "none");
+      }
+      if (this.commentGutter && this.delegate.view?.isScrollMode()) {
+        this.commentGutter.innerHTML = "";
+        let highlights = [];
+        if (this.annotator) {
+          highlights = this.annotator.getAnnotations();
+          if (highlights) {
+            highlights = highlights.filter((rangeRepresentation) => rangeRepresentation.highlight?.note?.length > 0);
+            highlights = this.syncPosition(highlights);
+            highlights = this.reposition(highlights);
+            highlights.forEach((rangeRepresentation) => {
+              let icon = document.createElement("i");
+              icon.innerHTML = "sticky_note_2";
+              icon.className = "material-icons";
+              icon.style.color = rangeRepresentation.highlight.color;
+              let container = doc.getElementById("R2_ID_HIGHLIGHTS_CONTAINER");
+              let highlightArea;
+              let highlightIcon;
+              if (container) {
+                highlightArea = container.querySelector(`#${rangeRepresentation.highlight.id}`);
+              }
+              let nodeList = highlightArea.getElementsByClassName(CLASS_HIGHLIGHT_AREA);
+              highlightIcon = nodeList[0];
+              const size = parseInt(highlightIcon.style.height.replace("px", ""));
+              const position = rangeRepresentation.highlight.position;
+              const highlightAreaIcon = doc.createElement("div");
+              highlightAreaIcon.setAttribute("style", `position: absolute;top:${position}px;display: flex;max-width: 250px !important;height:${size}px;width: 200px;align-items: center;`);
+              const iconSpan = doc.createElement("div");
+              highlightAreaIcon.appendChild(iconSpan);
+              let color = rangeRepresentation.highlight.color;
+              if (TextHighlighter.isHexColor(color)) {
+                color = TextHighlighter.hexToRgbChannels(color);
+              }
+              highlightAreaIcon.innerHTML = iconTemplateColored(``, ``, `<path d="M24 24H0V0h24v24z" fill="none"/><circle cx="12" cy="12" r="8"/>`, `icon open`, 10, `rgba(${color.red}, ${color.green}, ${color.blue}, 1) !important`);
+              const span = doc.createElement("div");
+              span.innerHTML = rangeRepresentation.highlight?.note;
+              span.setAttribute("style", `height:${size}px;overflow: hidden;padding-left: 5px;`);
+              highlightAreaIcon.appendChild(span);
+              addEventListenerOptional(highlightAreaIcon, "click", (event) => {
+                event.preventDefault();
+                event.stopPropagation();
+                this.scrollToHighlight(rangeRepresentation.highlight.id);
+              });
+              this.commentGutter?.appendChild(highlightAreaIcon);
+            });
+          }
+        }
+      }
     }
   }
   createTree(type, annotations, view) {
@@ -39985,23 +40243,17 @@ var AnnotationModule = class {
       this.delegate.stopReadAloud();
       this.delegate.navigate(locator);
     } else {
-      if (IS_DEV) {
-        console.log("annotation data missing: ", event);
-      }
+      import_loglevel7.default.log("annotation data missing: ", event);
     }
   }
   handleAnnotationLinkDeleteClick(type, event, locator) {
-    if (IS_DEV) {
-      console.log("annotation data locator: ", locator);
-    }
+    import_loglevel7.default.log("annotation data locator: ", locator);
     if (locator) {
       if (type === AnnotationType.Annotation) {
         this.deleteHighlight(locator);
       }
     } else {
-      if (IS_DEV) {
-        console.log("annotation data missing: ", event);
-      }
+      import_loglevel7.default.log("annotation data missing: ", event);
     }
   }
   static readableTimestamp(timestamp) {
@@ -40014,11 +40266,62 @@ var AnnotationModule = class {
   async getAnnotationByID(id2) {
     return this.annotator?.getAnnotationByID(id2);
   }
+  syncPosition(highlights) {
+    let doc = this.delegate.iframes[0].contentDocument;
+    const positionAnnotations = (newArray, currentElement) => {
+      let container = doc.getElementById("R2_ID_HIGHLIGHTS_CONTAINER");
+      let highlightArea;
+      let highlightIcon;
+      if (container) {
+        highlightArea = container.querySelector(`#${currentElement.highlight.id}`);
+      }
+      let nodeList = highlightArea.getElementsByClassName(CLASS_HIGHLIGHT_AREA);
+      highlightIcon = nodeList[0];
+      const newY = parseInt(highlightIcon.style.top.replace("px", ""));
+      const updatedAnnotation = __spreadProps(__spreadValues({}, currentElement), {
+        highlight: __spreadProps(__spreadValues({}, currentElement.highlight), {
+          position: newY
+        })
+      });
+      return [...newArray, updatedAnnotation];
+    };
+    return highlights.reduce(positionAnnotations, []);
+  }
+  reposition(highlights) {
+    let doc = this.delegate.iframes[0].contentDocument;
+    const positionAnnotations = (newArray, currentElement, currentIndex) => {
+      const high = highlights[0];
+      let container = doc.getElementById("R2_ID_HIGHLIGHTS_CONTAINER");
+      let highlightArea;
+      let highlightIcon;
+      if (container) {
+        highlightArea = container.querySelector(`#${high.highlight.id}`);
+      }
+      let nodeList = highlightArea.getElementsByClassName(CLASS_HIGHLIGHT_AREA);
+      highlightIcon = nodeList[0];
+      const size = parseInt(highlightIcon.style.height.replace("px", ""));
+      let originY = currentElement.highlight.position;
+      const preY = newArray[currentIndex - 1] && newArray[currentIndex - 1].highlight.position;
+      const preHeight = size;
+      const preBottomY = currentIndex === 0 ? 0 : preY + preHeight + 0;
+      const newY = preBottomY > originY ? preBottomY : originY;
+      const updatedAnnotation = __spreadProps(__spreadValues({}, currentElement), {
+        highlight: __spreadProps(__spreadValues({}, currentElement.highlight), {
+          position: newY
+        })
+      });
+      return [...newArray, updatedAnnotation];
+    };
+    return highlights.sort(function(a, b) {
+      return a.highlight.position - b.highlight.position;
+    }).reduce(positionAnnotations, []);
+  }
 };
 
 // src/modules/BookmarkModule.ts
 init_polyfills();
 var import_uuid2 = __toModule(require_uuid());
+var import_loglevel8 = __toModule(require_loglevel());
 var BookmarkModule = class {
   static async create(config2) {
     const module = new this(config2.annotator, config2.rights || { enableBookmarks: false }, config2.publication, config2.delegate, config2, config2.initialAnnotations, config2.api, config2.headerMenu);
@@ -40036,9 +40339,7 @@ var BookmarkModule = class {
     this.api = api;
   }
   stop() {
-    if (IS_DEV) {
-      console.log("Bookmark module stop");
-    }
+    import_loglevel8.default.log("Bookmark module stop");
   }
   async start() {
     this.delegate.bookmarkModule = this;
@@ -40088,17 +40389,13 @@ var BookmarkModule = class {
       if (this.api?.deleteBookmark) {
         await this.api?.deleteBookmark(bookmark);
         let deleted = await this.annotator.deleteBookmark(bookmark);
-        if (IS_DEV) {
-          console.log("Bookmark deleted " + JSON.stringify(deleted));
-        }
+        import_loglevel8.default.log("Bookmark deleted " + JSON.stringify(deleted));
         await this.showBookmarks();
         await this.drawBookmarks();
         return deleted;
       } else {
         let deleted = await this.annotator.deleteBookmark(bookmark);
-        if (IS_DEV) {
-          console.log("Bookmark deleted " + JSON.stringify(deleted));
-        }
+        import_loglevel8.default.log("Bookmark deleted " + JSON.stringify(deleted));
         await this.showBookmarks();
         await this.drawBookmarks();
         return deleted;
@@ -40155,20 +40452,15 @@ var BookmarkModule = class {
             if (result) {
               bookmark = result;
             }
-            if (IS_DEV)
-              console.log(bookmark);
+            import_loglevel8.default.log(bookmark);
             let saved = this.annotator.saveBookmark(bookmark);
-            if (IS_DEV) {
-              console.log("Bookmark added " + JSON.stringify(saved));
-            }
+            import_loglevel8.default.log("Bookmark added " + JSON.stringify(saved));
             this.showBookmarks();
             await this.drawBookmarks();
             return saved;
           } else {
             let saved = this.annotator.saveBookmark(bookmark);
-            if (IS_DEV) {
-              console.log("Bookmark added " + JSON.stringify(saved));
-            }
+            import_loglevel8.default.log("Bookmark added " + JSON.stringify(saved));
             this.showBookmarks();
             await this.drawBookmarks();
             return saved;
@@ -40257,16 +40549,18 @@ var BookmarkModule = class {
       }
     };
     if (win !== null) {
-      const selectionInfo = getCurrentSelectionInfo(win, getCssSelector);
+      let selectionInfo = getCurrentSelectionInfo(win, getCssSelector);
+      if (selectionInfo === void 0) {
+        let doc3 = self2.delegate.iframes[0].contentDocument;
+        selectionInfo = this.delegate.annotationModule?.annotator?.getTemporarySelectionInfo(doc3);
+      }
       let doc2 = self2.delegate.iframes[0].contentDocument;
       if (selectionInfo && doc2) {
         let book = this.delegate.highlighter?.createHighlight(this.delegate.highlighter?.dom(doc2.body).getWindow(), selectionInfo, menuItem.highlight?.color, true, AnnotationMarker.Bookmark, menuItem.icon, menuItem.popup, menuItem.highlight?.style);
         this.delegate.iframes[0].contentDocument?.getSelection()?.removeAllRanges();
         if (book) {
           return this.saveAnnotation(book[0]).then((anno) => {
-            if (IS_DEV) {
-              console.log("saved bookmark " + anno?.id);
-            }
+            import_loglevel8.default.log("saved bookmark " + anno?.id);
           });
         }
       }
@@ -40444,9 +40738,7 @@ var BookmarkModule = class {
   async deleteLocalHighlight(id2) {
     if (this.annotator) {
       var deleted = await this.annotator.deleteAnnotation(id2);
-      if (IS_DEV) {
-        console.log("Highlight deleted " + JSON.stringify(deleted));
-      }
+      import_loglevel8.default.log("Highlight deleted " + JSON.stringify(deleted));
       await this.showBookmarks();
       await this.drawBookmarks();
       return deleted;
@@ -40556,23 +40848,17 @@ var BookmarkModule = class {
       this.delegate.stopReadAloud();
       this.delegate.navigate(locator);
     } else {
-      if (IS_DEV) {
-        console.log("bookmark data missing: ", event);
-      }
+      import_loglevel8.default.log("bookmark data missing: ", event);
     }
   }
   handleAnnotationLinkDeleteClick(type, event, locator) {
-    if (IS_DEV) {
-      console.log("bookmark data locator: ", locator);
-    }
+    import_loglevel8.default.log("bookmark data locator: ", locator);
     if (locator) {
       if (type === AnnotationType.Bookmark) {
         this.deleteBookmark(locator);
       }
     } else {
-      if (IS_DEV) {
-        console.log("bookmark data missing: ", event);
-      }
+      import_loglevel8.default.log("bookmark data missing: ", event);
     }
   }
   static readableTimestamp(timestamp) {
@@ -40593,6 +40879,7 @@ var import_media_overlay = __toModule(require_media_overlay());
 
 // src/modules/mediaoverlays/MediaOverlaySettings.ts
 init_polyfills();
+var import_loglevel9 = __toModule(require_loglevel());
 var R2_MO_CLASS_ACTIVE = "r2-mo-active";
 var _MEDIAOVERLAYREFS = class {
 };
@@ -40624,7 +40911,7 @@ var MediaOverlaySettings = class {
     this.api = api;
     this.headerMenu = headerMenu;
     this.initialise();
-    console.log(this.api);
+    import_loglevel9.default.log(this.api);
   }
   static create(config2) {
     const settings = new this(config2.store, config2.api, config2.headerMenu);
@@ -40632,42 +40919,34 @@ var MediaOverlaySettings = class {
       let initialSettings = config2.initialMediaOverlaySettings;
       if (initialSettings?.color) {
         settings.color = initialSettings.color;
-        if (IS_DEV)
-          console.log(settings.color);
+        import_loglevel9.default.log(settings.color);
       }
       if (initialSettings?.autoScroll) {
         settings.autoScroll = initialSettings.autoScroll;
-        if (IS_DEV)
-          console.log(settings.autoScroll);
+        import_loglevel9.default.log(settings.autoScroll);
       }
       if (initialSettings?.autoTurn) {
         settings.autoTurn = initialSettings.autoTurn;
-        if (IS_DEV)
-          console.log(settings.autoTurn);
+        import_loglevel9.default.log(settings.autoScroll);
       }
       if (initialSettings?.volume) {
         settings.volume = initialSettings.volume;
-        if (IS_DEV)
-          console.log(settings.volume);
+        import_loglevel9.default.log(settings.volume);
       }
       if (initialSettings?.rate) {
         settings.rate = initialSettings.rate;
-        if (IS_DEV)
-          console.log(settings.rate);
+        import_loglevel9.default.log(settings.rate);
       }
       if (initialSettings?.wait) {
         settings.wait = initialSettings.wait;
-        if (IS_DEV)
-          console.log(settings.wait);
+        import_loglevel9.default.log(settings.wait);
       }
     }
     settings.initializeSelections();
     return settings;
   }
   stop() {
-    if (IS_DEV) {
-      console.log("MediaOverlay settings stop");
-    }
+    import_loglevel9.default.log("MediaOverlay settings stop");
   }
   initialise() {
     this.autoScroll = this.getProperty(MEDIAOVERLAYREFS.AUTO_SCROLL_KEY) != null ? this.getProperty(MEDIAOVERLAYREFS.AUTO_SCROLL_KEY).value : this.autoScroll;
@@ -40733,9 +41012,7 @@ var MediaOverlaySettings = class {
     this.applyMediaOverlaySettings(syncSettings);
     if (this.api?.updateSettings) {
       this.api?.updateSettings(syncSettings).then(async (settings) => {
-        if (IS_DEV) {
-          console.log("api updated sync settings", settings);
-        }
+        import_loglevel9.default.log("api updated sync settings", settings);
       });
     }
   }
@@ -40790,8 +41067,7 @@ var MediaOverlaySettings = class {
       this.settingsChangeCallback();
     }
     if (mediaOverlaySettings.autoScroll !== void 0) {
-      if (IS_DEV)
-        console.log("autoScroll " + this.autoScroll);
+      import_loglevel9.default.log("autoScroll " + this.autoScroll);
       this.autoScroll = mediaOverlaySettings.autoScroll;
       let prop = this.userProperties.getByRef(MEDIAOVERLAYREFS.AUTO_SCROLL_REF);
       if (prop) {
@@ -40801,8 +41077,7 @@ var MediaOverlaySettings = class {
       this.settingsChangeCallback();
     }
     if (mediaOverlaySettings.autoTurn !== void 0) {
-      if (IS_DEV)
-        console.log("autoTurn " + this.autoTurn);
+      import_loglevel9.default.log("autoTurn " + this.autoTurn);
       this.autoTurn = mediaOverlaySettings.autoTurn;
       let prop = this.userProperties.getByRef(MEDIAOVERLAYREFS.AUTO_TURN_REF);
       if (prop) {
@@ -40812,8 +41087,7 @@ var MediaOverlaySettings = class {
       this.settingsChangeCallback();
     }
     if (mediaOverlaySettings.volume) {
-      if (IS_DEV)
-        console.log("volume " + this.volume);
+      import_loglevel9.default.log("volume " + this.volume);
       this.volume = mediaOverlaySettings.volume;
       let prop = this.userProperties.getByRef(MEDIAOVERLAYREFS.VOLUME_REF);
       if (prop) {
@@ -40823,8 +41097,7 @@ var MediaOverlaySettings = class {
       this.settingsChangeCallback();
     }
     if (mediaOverlaySettings.rate) {
-      if (IS_DEV)
-        console.log("rate " + this.rate);
+      import_loglevel9.default.log("rate " + this.rate);
       this.rate = mediaOverlaySettings.rate;
       let prop = this.userProperties.getByRef(MEDIAOVERLAYREFS.RATE_REF);
       if (prop) {
@@ -40902,6 +41175,7 @@ var MediaOverlaySettings = class {
 };
 
 // src/modules/mediaoverlays/MediaOverlayModule.ts
+var import_loglevel10 = __toModule(require_loglevel());
 var MediaOverlayModule = class {
   constructor(delegate, publication, settings, properties) {
     this.play = findElement(document, "#menu-button-play");
@@ -40910,8 +41184,7 @@ var MediaOverlayModule = class {
     this.pid = void 0;
     this.__ontimeupdate = false;
     this.ontimeupdate = async (_v) => {
-      if (IS_DEV)
-        console.log("ontimeupdate");
+      import_loglevel10.default.log("ontimeupdate");
       this.trackCurrentTime();
     };
     this.ensureOnTimeUpdate = (remove, replace) => {
@@ -40944,13 +41217,11 @@ var MediaOverlayModule = class {
     return mediaOverlay;
   }
   stop() {
-    if (IS_DEV)
-      console.log("MediaOverlay module stop");
+    import_loglevel10.default.log("MediaOverlay module stop");
   }
   start() {
     this.delegate.mediaOverlayModule = this;
-    if (IS_DEV)
-      console.log("MediaOverlay module start");
+    import_loglevel10.default.log("MediaOverlay module start");
   }
   async initialize() {
     return new Promise(async (resolve) => {
@@ -40977,14 +41248,13 @@ var MediaOverlayModule = class {
       const moUrlFull = moUrlObjFull.toString();
       let response;
       try {
-        response = await fetch(moUrlFull);
+        response = await fetch(moUrlFull, this.delegate.requestConfig);
       } catch (e) {
         console.error(e, moUrlFull);
         return;
       }
       if (!response.ok) {
-        if (IS_DEV)
-          console.log("BAD RESPONSE?!");
+        import_loglevel10.default.log("BAD RESPONSE?!");
       }
       let moJson;
       try {
@@ -40993,8 +41263,7 @@ var MediaOverlayModule = class {
         console.error(e);
       }
       if (!moJson) {
-        if (IS_DEV)
-          console.log("## moJson" + moJson);
+        import_loglevel10.default.log("## moJson" + moJson);
         return;
       }
       link.MediaOverlays = TaJsonDeserialize(moJson, import_media_overlay.MediaOverlayNode);
@@ -41080,8 +41349,7 @@ var MediaOverlayModule = class {
     }
   }
   findDepthFirstTextAudioPair(textHref, mo, textFragmentIDChain) {
-    if (IS_DEV)
-      console.log("findDepthFirstTextAudioPair()");
+    import_loglevel10.default.log("findDepthFirstTextAudioPair()");
     let isTextUrlMatch;
     let isFragmentIDMatch;
     if (mo.Text) {
@@ -41102,21 +41370,16 @@ var MediaOverlayModule = class {
         isTextUrlMatch = false;
       }
     }
-    if (IS_DEV) {
-      console.log("isFragmentIDMatch: " + isFragmentIDMatch);
-      console.log("isTextUrlMatch: " + isTextUrlMatch);
-    }
+    import_loglevel10.default.log("isFragmentIDMatch: " + isFragmentIDMatch);
+    import_loglevel10.default.log("isTextUrlMatch: " + isTextUrlMatch);
     if (!mo.Children || !mo.Children.length) {
-      if (IS_DEV)
-        console.log("findDepthFirstTextAudioPair() - leaf text/audio pair");
+      import_loglevel10.default.log("findDepthFirstTextAudioPair() - leaf text/audio pair");
       if (!isTextUrlMatch) {
-        if (IS_DEV)
-          console.log("findDepthFirstTextAudioPair() - leaf - !isTextUrlMatch");
+        import_loglevel10.default.log("findDepthFirstTextAudioPair() - leaf - !isTextUrlMatch");
         return void 0;
       }
       if (isFragmentIDMatch || isTextUrlMatch && !textFragmentIDChain) {
-        if (IS_DEV)
-          console.log("findDepthFirstTextAudioPair() - leaf - isFragmentIDMatch || (isTextUrlMatch && !textFragmentIDChain");
+        import_loglevel10.default.log("findDepthFirstTextAudioPair() - leaf - isFragmentIDMatch || (isTextUrlMatch && !textFragmentIDChain");
         return mo;
       }
       return void 0;
@@ -41124,34 +41387,25 @@ var MediaOverlayModule = class {
     const textFragmentIDChainOriginal = textFragmentIDChain;
     let frags = textFragmentIDChain;
     for (const child of mo.Children) {
-      if (IS_DEV) {
-        console.log("findDepthFirstTextAudioPair() - child");
-        console.log(JSON.stringify(child));
-      }
+      import_loglevel10.default.log("findDepthFirstTextAudioPair() - child");
+      import_loglevel10.default.log(JSON.stringify(child));
       const match = this.findDepthFirstTextAudioPair(textHref, child, frags);
       if (match === null) {
-        if (IS_DEV) {
-          console.log("findDepthFirstTextAudioPair() - child - match null (skip)");
-        }
+        import_loglevel10.default.log("findDepthFirstTextAudioPair() - child - match null (skip)");
         frags = void 0;
       }
       if (match) {
-        if (IS_DEV) {
-          console.log("findDepthFirstTextAudioPair() - child - match");
-          console.log(JSON.stringify(match));
-        }
+        import_loglevel10.default.log("findDepthFirstTextAudioPair() - child - match");
+        import_loglevel10.default.log(JSON.stringify(match));
         return match;
       }
     }
     if (isFragmentIDMatch) {
-      if (IS_DEV)
-        console.log("findDepthFirstTextAudioPair() - post isFragmentIDMatch");
+      import_loglevel10.default.log("findDepthFirstTextAudioPair() - post isFragmentIDMatch");
       const match = this.findDepthFirstTextAudioPair(textHref, mo, void 0);
       if (match) {
-        if (IS_DEV) {
-          console.log("findDepthFirstTextAudioPair() - post isFragmentIDMatch - match");
-          console.log(JSON.stringify(match));
-        }
+        import_loglevel10.default.log("findDepthFirstTextAudioPair() - post isFragmentIDMatch - match");
+        import_loglevel10.default.log(JSON.stringify(match));
         return match;
       } else {
         return match;
@@ -41167,8 +41421,7 @@ var MediaOverlayModule = class {
     if (this.mediaOverlayTextAudioPair) {
       try {
         if (this.currentAudioEnd && this.audioElement.currentTime >= this.currentAudioEnd - 0.05) {
-          if (IS_DEV)
-            console.log("ontimeupdate - mediaOverlaysNext()");
+          import_loglevel10.default.log("ontimeupdate - mediaOverlaysNext()");
           this.mediaOverlaysNext();
         }
         const match_i = this.mediaOverlayTextAudioPair.Text.lastIndexOf("#");
@@ -41180,13 +41433,11 @@ var MediaOverlayModule = class {
     }
   }
   mediaOverlaysNext(escape2) {
-    if (IS_DEV)
-      console.log("mediaOverlaysNext()");
+    import_loglevel10.default.log("mediaOverlaysNext()");
     if (this.mediaOverlayRoot && this.mediaOverlayTextAudioPair) {
       const nextTextAudioPair = this.findNextTextAudioPair(this.mediaOverlayRoot, this.mediaOverlayTextAudioPair, { prev: void 0 }, escape2 ? true : false);
       if (!nextTextAudioPair) {
-        if (IS_DEV)
-          console.log("mediaOverlaysNext() - navLeftOrRight()");
+        import_loglevel10.default.log("mediaOverlaysNext() - navLeftOrRight()");
         this.mediaOverlaysStop();
         if (this.currentLinks.length > 1 && this.currentLinkIndex === 0) {
           this.currentLinkIndex++;
@@ -41206,25 +41457,21 @@ var MediaOverlayModule = class {
           const hrefUrlObj1 = new URL("https://dita.digital/" + this.mediaOverlayTextAudioPair.Text);
           const hrefUrlObj2 = new URL("https://dita.digital/" + nextTextAudioPair.Text);
           if (hrefUrlObj1.pathname !== hrefUrlObj2.pathname) {
-            if (IS_DEV) {
-              console.log("mediaOverlaysNext() SWITCH! " + hrefUrlObj1.pathname + " != " + hrefUrlObj2.pathname);
-            }
+            import_loglevel10.default.log("mediaOverlaysNext() SWITCH! " + hrefUrlObj1.pathname + " != " + hrefUrlObj2.pathname);
             switchDoc = true;
           }
         }
         if (switchDoc) {
           this.mediaOverlaysStop();
         } else {
-          if (IS_DEV)
-            console.log("mediaOverlaysNext() - playMediaOverlaysAudio()");
+          import_loglevel10.default.log("mediaOverlaysNext() - playMediaOverlaysAudio()");
           setTimeout(async () => {
             await this.playMediaOverlaysAudio(nextTextAudioPair, void 0, void 0);
           }, 0);
         }
       }
     } else {
-      if (IS_DEV)
-        console.log("mediaOverlaysNext() - navLeftOrRight() 2");
+      import_loglevel10.default.log("mediaOverlaysNext() - navLeftOrRight() 2");
       this.mediaOverlaysStop();
       if (this.currentLinks.length > 1 && this.currentLinkIndex === 0) {
         this.currentLinkIndex++;
@@ -41241,15 +41488,13 @@ var MediaOverlayModule = class {
     }
   }
   mediaOverlaysStop() {
-    if (IS_DEV)
-      console.log("mediaOverlaysStop()");
+    import_loglevel10.default.log("mediaOverlaysStop()");
     this.mediaOverlaysPause();
     this.mediaOverlayRoot = void 0;
     this.mediaOverlayTextAudioPair = void 0;
   }
   mediaOverlaysPause() {
-    if (IS_DEV)
-      console.log("mediaOverlaysPause()");
+    import_loglevel10.default.log("mediaOverlaysPause()");
     this.mediaOverlayHighlight(void 0);
     if (this.audioElement) {
       this.audioElement.pause();
@@ -41258,36 +41503,28 @@ var MediaOverlayModule = class {
   findNextTextAudioPair(mo, moToMatch, previousMo, escape2) {
     if (!mo.Children || !mo.Children.length) {
       if (previousMo?.prev === moToMatch) {
-        if (IS_DEV)
-          console.log("findNextTextAudioPair() - prevMo === moToMatch");
+        import_loglevel10.default.log("findNextTextAudioPair() - prevMo === moToMatch");
         return mo;
       }
-      if (IS_DEV) {
-        console.log("findNextTextAudioPair() - set previous");
-        console.log(JSON.stringify(mo));
-      }
+      import_loglevel10.default.log("findNextTextAudioPair() - set previous");
+      import_loglevel10.default.log(JSON.stringify(mo));
       previousMo.prev = mo;
       return void 0;
     }
     for (const child of mo.Children) {
-      if (IS_DEV) {
-        console.log("findNextTextAudioPair() - child");
-        console.log(JSON.stringify(child));
-      }
+      import_loglevel10.default.log("findNextTextAudioPair() - child");
+      import_loglevel10.default.log(JSON.stringify(child));
       const match = this.findNextTextAudioPair(child, moToMatch, previousMo, escape2);
       if (match) {
-        if (IS_DEV) {
-          console.log("findNextTextAudioPair() - match");
-          console.log(JSON.stringify(match));
-        }
+        import_loglevel10.default.log("findNextTextAudioPair() - match");
+        import_loglevel10.default.log(JSON.stringify(match));
         return match;
       }
     }
     return void 0;
   }
   async playMediaOverlaysAudio(moTextAudioPair, begin, end) {
-    if (IS_DEV)
-      console.log("playMediaOverlaysAudio()");
+    import_loglevel10.default.log("playMediaOverlaysAudio()");
     this.mediaOverlayTextAudioPair = moTextAudioPair;
     if (!moTextAudioPair.Audio) {
       return;
@@ -41311,14 +41548,14 @@ var MediaOverlayModule = class {
           try {
             this.currentAudioBegin = parseFloat(b);
           } catch (err) {
-            console.log(err);
+            import_loglevel10.default.error(err);
           }
           if (matches.length >= 3) {
             const e = matches[3];
             try {
               this.currentAudioEnd = parseFloat(e);
             } catch (err) {
-              console.log(err);
+              import_loglevel10.default.error(err);
             }
           }
         }
@@ -41327,9 +41564,7 @@ var MediaOverlayModule = class {
       this.currentAudioBegin = begin;
       this.currentAudioEnd = end;
     }
-    if (IS_DEV) {
-      console.log(`${urlFull} => [${this.currentAudioBegin}-${this.currentAudioEnd}]`);
-    }
+    import_loglevel10.default.log(`${urlFull} => [${this.currentAudioBegin}-${this.currentAudioEnd}]`);
     const playClip = async (initial) => {
       if (!this.audioElement) {
         return;
@@ -41337,9 +41572,7 @@ var MediaOverlayModule = class {
       const timeToSeekTo = this.currentAudioBegin ? this.currentAudioBegin : 0;
       if (initial || this.audioElement.paused) {
         if (initial && !timeToSeekTo || this.audioElement.currentTime === timeToSeekTo) {
-          if (IS_DEV) {
-            console.log("playMediaOverlaysAudio() - playClip() - _currentAudioElement.play()");
-          }
+          import_loglevel10.default.log("playMediaOverlaysAudio() - playClip() - _currentAudioElement.play()");
           this.ensureOnTimeUpdate(false, false);
           this.audioElement.playbackRate = this.settings.rate;
           this.audioElement.volume = this.settings.volume;
@@ -41358,14 +41591,10 @@ var MediaOverlayModule = class {
             checkReady();
           }
         } else {
-          if (IS_DEV) {
-            console.log("playMediaOverlaysAudio() - playClip() - ontimeupdateSeeked");
-          }
+          import_loglevel10.default.log("playMediaOverlaysAudio() - playClip() - ontimeupdateSeeked");
           const ontimeupdateSeeked = async (_ev) => {
             this.audioElement.removeEventListener("timeupdate", ontimeupdateSeeked);
-            if (IS_DEV) {
-              console.log("playMediaOverlaysAudio() - playClip() - ontimeupdateSeeked - .play()");
-            }
+            import_loglevel10.default.log("playMediaOverlaysAudio() - playClip() - ontimeupdateSeeked - .play()");
             this.ensureOnTimeUpdate(false, false);
             if (this.audioElement) {
               this.audioElement.playbackRate = this.settings.rate;
@@ -41393,13 +41622,9 @@ var MediaOverlayModule = class {
         const contiguous = this.previousAudioUrl === this.currentAudioUrl && typeof this.previousAudioEnd !== "undefined" && this.previousAudioEnd > timeToSeekTo - 0.02 && this.previousAudioEnd <= timeToSeekTo && this.audioElement.currentTime >= timeToSeekTo - 0.1;
         this.ensureOnTimeUpdate(false, false);
         if (contiguous) {
-          if (IS_DEV) {
-            console.log("playMediaOverlaysAudio() - playClip() - ensureOnTimeUpdate");
-          }
+          import_loglevel10.default.log("playMediaOverlaysAudio() - playClip() - ensureOnTimeUpdate");
         } else {
-          if (IS_DEV) {
-            console.log("playMediaOverlaysAudio() - playClip() - currentTime = timeToSeekTo");
-          }
+          import_loglevel10.default.log("playMediaOverlaysAudio() - playClip() - currentTime = timeToSeekTo");
           this.audioElement.currentTime = timeToSeekTo;
         }
       }
@@ -41407,9 +41632,7 @@ var MediaOverlayModule = class {
     this.previousAudioUrl = this.currentAudioUrl;
     if (!this.currentAudioUrl || urlNoQuery !== this.currentAudioUrl) {
       this.currentAudioUrl = urlNoQuery;
-      if (IS_DEV) {
-        console.log("playMediaOverlaysAudio() - RESET: " + this.previousAudioUrl + " => " + this.currentAudioUrl);
-      }
+      import_loglevel10.default.log("playMediaOverlaysAudio() - RESET: " + this.previousAudioUrl + " => " + this.currentAudioUrl);
       this.audioElement = document.getElementById("AUDIO_MO_ID");
       if (this.audioElement) {
         this.audioElement.pause();
@@ -41426,23 +41649,21 @@ var MediaOverlayModule = class {
       this.audioElement.playbackRate = this.settings.rate;
       document.body.appendChild(this.audioElement);
       this.audioElement.addEventListener("error", (ev) => {
-        console.log("-1) error: " + (this.currentAudioUrl !== ev.currentTarget.src ? this.currentAudioUrl + " -- " : "") + ev.currentTarget.src.substr(ev.currentTarget.src.lastIndexOf("/")));
+        import_loglevel10.default.log("-1) error: " + (this.currentAudioUrl !== ev.currentTarget.src ? this.currentAudioUrl + " -- " : "") + ev.currentTarget.src.substr(ev.currentTarget.src.lastIndexOf("/")));
         if (this.audioElement && this.audioElement.error) {
-          console.log(this.audioElement.error.code);
-          console.log(this.audioElement.error.message);
+          import_loglevel10.default.log(this.audioElement.error.code);
+          import_loglevel10.default.log(this.audioElement.error.message);
         }
       });
       const oncanplaythrough = async (ev) => {
         const currentAudioElement = ev.currentTarget;
         currentAudioElement.removeEventListener("canplaythrough", oncanplaythrough);
-        if (IS_DEV)
-          console.log("oncanplaythrough");
+        import_loglevel10.default.log("oncanplaythrough");
         await playClip(true);
       };
       this.audioElement.addEventListener("canplaythrough", oncanplaythrough);
       const onended = async (_ev) => {
-        if (IS_DEV)
-          console.log("onended");
+        import_loglevel10.default.log("onended");
         if (this.currentLinks.length > 1 && this.currentLinkIndex === 0) {
           this.currentLinkIndex++;
           await this.playLink();
@@ -41459,42 +41680,35 @@ var MediaOverlayModule = class {
       this.audioElement.playbackRate = this.settings.rate;
       this.audioElement.setAttribute("src", this.currentAudioUrl);
     } else {
-      if (IS_DEV)
-        console.log("playMediaOverlaysAudio() - playClip()");
+      import_loglevel10.default.log("playMediaOverlaysAudio() - playClip()");
       await playClip(false);
     }
   }
   async playMediaOverlays(textHref, rootMo, textFragmentIDChain) {
-    if (IS_DEV)
-      console.log("playMediaOverlays()");
+    import_loglevel10.default.log("playMediaOverlays()");
     let textFragmentIDChain_ = textFragmentIDChain ? textFragmentIDChain.filter((id2) => id2) : void 0;
     if (textFragmentIDChain_ && textFragmentIDChain_.length === 0) {
       textFragmentIDChain_ = void 0;
     }
     let moTextAudioPair = this.findDepthFirstTextAudioPair(textHref, rootMo, textFragmentIDChain_);
     if (!moTextAudioPair && textFragmentIDChain_) {
-      if (IS_DEV) {
-        console.log("playMediaOverlays() - findDepthFirstTextAudioPair() SECOND CHANCE ");
-        console.log(JSON.stringify(textFragmentIDChain_, null, 4));
-        console.log(JSON.stringify(rootMo, null, 4));
-      }
+      import_loglevel10.default.log("playMediaOverlays() - findDepthFirstTextAudioPair() SECOND CHANCE ");
+      import_loglevel10.default.log(JSON.stringify(textFragmentIDChain_, null, 4));
+      import_loglevel10.default.log(JSON.stringify(rootMo, null, 4));
       moTextAudioPair = this.findDepthFirstTextAudioPair(textHref, rootMo, void 0);
     }
     if (moTextAudioPair) {
       if (moTextAudioPair.Audio) {
-        if (IS_DEV)
-          console.log("playMediaOverlays() - playMediaOverlaysAudio()");
+        import_loglevel10.default.log("playMediaOverlays() - playMediaOverlaysAudio()");
         this.mediaOverlayRoot = rootMo;
         await this.playMediaOverlaysAudio(moTextAudioPair, void 0, void 0);
       }
     } else {
-      if (IS_DEV)
-        console.log("playMediaOverlays() - !moTextAudioPair " + textHref);
+      import_loglevel10.default.log("playMediaOverlays() - !moTextAudioPair " + textHref);
     }
   }
   mediaOverlayHighlight(id2) {
-    if (IS_DEV)
-      console.log("moHighlight:  ## " + id2);
+    import_loglevel10.default.log("moHighlight:  ## " + id2);
     let classActive = this.publication.Metadata?.MediaOverlay?.ActiveClass;
     if (!classActive) {
       classActive = this.settings.color;
@@ -41539,6 +41753,7 @@ var MediaOverlayModule = class {
 
 // src/modules/positions/TimelineModule.ts
 init_polyfills();
+var import_loglevel11 = __toModule(require_loglevel());
 var TimelineModule = class {
   static async create(config2) {
     const timeline = new this(config2.delegate, config2.publication);
@@ -41550,9 +41765,7 @@ var TimelineModule = class {
     this.publication = publication;
   }
   async stop() {
-    if (IS_DEV) {
-      console.log("Timeline module stop");
-    }
+    import_loglevel11.default.log("Timeline module stop");
   }
   async start() {
     this.delegate.timelineModule = this;
@@ -41621,8 +41834,7 @@ var TimelineModule = class {
               title: link.Title
             };
           }
-          if (IS_DEV)
-            console.log(position);
+          import_loglevel11.default.log(position);
           this.delegate.navigate(position);
         });
         if (tocHrefAbs === this.delegate.currentChapterLink.href) {
@@ -41642,8 +41854,22 @@ var TimelineModule = class {
 // src/modules/protection/ContentProtectionModule.ts
 init_polyfills();
 var import_debounce3 = __toModule(require_debounce());
+
+// src/utils/index.ts
+init_polyfills();
+var import_loglevel12 = __toModule(require_loglevel());
+function delay(t, v) {
+  return new Promise(function(resolve) {
+    setTimeout(resolve.bind(null, v), t);
+  });
+}
+var IS_DEV = false;
+import_loglevel12.default.setLevel(IS_DEV ? "trace" : "warn", true);
+
+// src/modules/protection/ContentProtectionModule.ts
 var import_browserslist_useragent_regexp = __toModule(require_lib7());
 var import_devtools_detector = __toModule(require_devtools_detector());
+var import_loglevel13 = __toModule(require_loglevel());
 var ContentProtectionModule = class {
   constructor(delegate, properties) {
     this.hasEventListener = false;
@@ -41674,7 +41900,7 @@ var ContentProtectionModule = class {
           window.sessionStorage.clear();
           window.location.replace(window.location.origin);
         }
-        if (typeof config2.api?.inspectDetected === "function") {
+        if (config2.detectInspect && typeof config2.api?.inspectDetected === "function") {
           config2.api.inspectDetected();
         }
       }
@@ -41705,18 +41931,14 @@ var ContentProtectionModule = class {
       var self2 = this;
       this.mutationObserver = new MutationObserver(function(mutations) {
         mutations.forEach(function(mutation) {
-          if (IS_DEV) {
-            console.log(mutation.type);
-          }
+          import_loglevel13.default.log(mutation.type);
           self2.isHacked = true;
         });
       });
     }
   }
   async stop() {
-    if (IS_DEV) {
-      console.log("Protection module stop");
-    }
+    import_loglevel13.default.log("Protection module stop");
     this.mutationObserver.disconnect();
     if (this.properties?.disableKeys) {
       removeEventListenerOptional(this.delegate.mainElement, "keydown", this.disableSave);
@@ -41948,18 +42170,14 @@ var ContentProtectionModule = class {
     return true;
   }
   preventCopy(event) {
-    if (IS_DEV) {
-      console.log("copy action initiated");
-    }
+    import_loglevel13.default.log("copy action initiated");
     event.clipboardData.setData("text/plain", "copy not allowed");
     event.stopPropagation();
     event.preventDefault();
     return false;
   }
   beforePrint(event) {
-    if (IS_DEV) {
-      console.log("before print");
-    }
+    import_loglevel13.default.log("before print");
     if (this.delegate && this.delegate.headerMenu) {
       this.delegate.headerMenu.style.display = "none";
       this.delegate.mainElement.style.display = "none";
@@ -41969,9 +42187,7 @@ var ContentProtectionModule = class {
     return false;
   }
   afterPrint(event) {
-    if (IS_DEV) {
-      console.log("after print");
-    }
+    import_loglevel13.default.log("after print");
     if (this.delegate && this.delegate.headerMenu) {
       this.delegate.headerMenu.style.removeProperty("display");
       this.delegate.mainElement.style.removeProperty("display");
@@ -42061,14 +42277,12 @@ var ContentProtectionModule = class {
           rect.width = width;
           rect.left = left;
         } catch (error) {
-          if (IS_DEV) {
-            console.log("error " + error);
-            console.log(rect);
-            console.log(rect.node);
-            console.log("scrambledTextContent " + rect.scrambledTextContent);
-            console.log("textContent " + rect.textContent);
-            console.log("isObfuscated " + rect.isObfuscated);
-          }
+          import_loglevel13.default.log("error " + error);
+          import_loglevel13.default.log(rect);
+          import_loglevel13.default.log(rect.node);
+          import_loglevel13.default.log("scrambledTextContent " + rect.scrambledTextContent);
+          import_loglevel13.default.log("textContent " + rect.textContent);
+          import_loglevel13.default.log("isObfuscated " + rect.isObfuscated);
         }
       });
     }
@@ -42124,17 +42338,14 @@ var ContentProtectionModule = class {
       range.detach();
       return rect;
     } catch (error) {
-      if (IS_DEV) {
-        console.log("measureTextNode " + error);
-        console.log("measureTextNode " + node);
-        console.log(node.textContent);
-      }
+      import_loglevel13.default.log("measureTextNode " + error);
+      import_loglevel13.default.log("measureTextNode " + node);
+      import_loglevel13.default.log(node.textContent);
     }
   }
   isBeingHacked(element) {
     if (element.style.animation || element.style.transition || element.style.position || element.hasAttribute("style")) {
-      if (IS_DEV)
-        console.log("content being hacked");
+      import_loglevel13.default.log("content being hacked");
       return true;
     }
     return false;
@@ -42298,6 +42509,7 @@ async function searchDocDomSeek(searchInput, doc, href, title, fullWordSearch =
 }
 
 // src/modules/search/SearchModule.ts
+var import_loglevel14 = __toModule(require_loglevel());
 var SearchModule = class {
   constructor(delegate, publication, properties, highlighter, api, headerMenu) {
     this.currentChapterSearchResult = [];
@@ -42316,9 +42528,7 @@ var SearchModule = class {
     return search;
   }
   async stop() {
-    if (IS_DEV) {
-      console.log("Search module stop");
-    }
+    import_loglevel14.default.log("Search module stop");
     removeEventListenerOptional(this.searchInput, "keypress", this.handleSearch.bind(this));
     removeEventListenerOptional(this.searchGo, "click", this.handleSearch.bind(this));
   }
@@ -42737,9 +42947,9 @@ var SearchModule = class {
       }
       if (tocItem) {
         let href = this.publication.getAbsoluteHref(tocItem.Href);
-        await fetch(href).then((r) => r.text()).then(async (data) => {
+        await fetch(href, this.delegate.requestConfig).then((r) => r.text()).then(async (data) => {
           let parser = new DOMParser();
-          let doc = parser.parseFromString(data, "application/xhtml+xml");
+          let doc = parser.parseFromString(this.delegate.requestConfig?.encoded ? this.decodeBase64(data) : data, "application/xhtml+xml");
           if (tocItem) {
             searchDocDomSeek(term, doc, tocItem.Href, tocItem.Title).then((result) => {
               result.forEach((searchItem) => {
@@ -42755,6 +42965,16 @@ var SearchModule = class {
       }
     }
   }
+  decodeBase64(base64) {
+    const text = atob(base64);
+    const length = text.length;
+    const bytes = new Uint8Array(length);
+    for (let i = 0; i < length; i++) {
+      bytes[i] = text.charCodeAt(i);
+    }
+    const decoder = new TextDecoder();
+    return decoder.decode(bytes);
+  }
   async searchChapter(term) {
     let localSearchResultBook = [];
     const linkHref = this.publication.getAbsoluteHref(this.publication.readingOrder[this.delegate.currentResource() ?? 0].Href);
@@ -42764,9 +42984,9 @@ var SearchModule = class {
     }
     if (tocItem) {
       let href = this.publication.getAbsoluteHref(tocItem.Href);
-      await fetch(href).then((r) => r.text()).then(async (data) => {
+      await fetch(href, this.delegate.requestConfig).then((r) => r.text()).then(async (data) => {
         let parser = new DOMParser();
-        let doc = parser.parseFromString(data, "application/xhtml+xml");
+        let doc = parser.parseFromString(this.delegate.requestConfig?.encoded ? this.decodeBase64(data) : data, "application/xhtml+xml");
         if (tocItem) {
           searchDocDomSeek(term, doc, tocItem.Href, tocItem.Title).then((result) => {
             result.forEach((searchItem) => {
@@ -42835,6 +43055,7 @@ var SearchModule = class {
 
 // src/modules/TTS/TTSSettings.ts
 init_polyfills();
+var import_loglevel15 = __toModule(require_loglevel());
 var _TTSREFS = class {
 };
 var TTSREFS = _TTSREFS;
@@ -42876,42 +43097,34 @@ var TTSSettings = class {
       let initialTTSSettings = config2.initialTTSSettings;
       if (initialTTSSettings?.rate) {
         settings.rate = initialTTSSettings.rate;
-        if (IS_DEV)
-          console.log(settings.rate);
+        import_loglevel15.default.log(settings.rate);
       }
       if (initialTTSSettings?.pitch) {
         settings.pitch = initialTTSSettings.pitch;
-        if (IS_DEV)
-          console.log(settings.pitch);
+        import_loglevel15.default.log(settings.pitch);
       }
       if (initialTTSSettings?.volume) {
         settings.volume = initialTTSSettings.volume;
-        if (IS_DEV)
-          console.log(settings.volume);
+        import_loglevel15.default.log(settings.volume);
       }
       if (initialTTSSettings?.color) {
         settings.color = initialTTSSettings.color;
-        if (IS_DEV)
-          console.log(settings.color);
+        import_loglevel15.default.log(settings.color);
       }
       if (initialTTSSettings?.autoScroll) {
         settings.autoScroll = initialTTSSettings.autoScroll;
-        if (IS_DEV)
-          console.log(settings.autoScroll);
+        import_loglevel15.default.log(settings.autoScroll);
       }
       if (initialTTSSettings?.voice) {
         settings.voice = initialTTSSettings.voice;
-        if (IS_DEV)
-          console.log(settings.voice);
+        import_loglevel15.default.log(settings.voice);
       }
     }
     settings.initializeSelections();
     return settings;
   }
   stop() {
-    if (IS_DEV) {
-      console.log("tts settings stop");
-    }
+    import_loglevel15.default.log("tts settings stop");
   }
   initialise() {
     this.autoScroll = this.getProperty(TTSREFS.AUTO_SCROLL_KEY) != null ? this.getProperty(TTSREFS.AUTO_SCROLL_KEY).value : this.autoScroll;
@@ -42984,9 +43197,7 @@ var TTSSettings = class {
     this.applyTTSSettings(ttsSettings);
     if (this.api?.updateSettings) {
       this.api?.updateSettings(ttsSettings).then(async (settings) => {
-        if (IS_DEV) {
-          console.log("api updated tts settings", settings);
-        }
+        import_loglevel15.default.log("api updated tts settings", settings);
       });
     }
   }
@@ -43034,8 +43245,7 @@ var TTSSettings = class {
   }
   applyTTSSettings(ttsSettings) {
     if (ttsSettings.rate) {
-      if (IS_DEV)
-        console.log("rate " + this.rate);
+      import_loglevel15.default.log("rate " + this.rate);
       this.rate = ttsSettings.rate;
       let prop = this.userProperties.getByRef(TTSREFS.RATE_REF);
       if (prop) {
@@ -43046,8 +43256,7 @@ var TTSSettings = class {
       this.restartCallback();
     }
     if (ttsSettings.pitch) {
-      if (IS_DEV)
-        console.log("pitch " + this.pitch);
+      import_loglevel15.default.log("pitch " + this.pitch);
       this.pitch = ttsSettings.pitch;
       let prop = this.userProperties.getByRef(TTSREFS.PITCH_REF);
       if (prop) {
@@ -43058,8 +43267,7 @@ var TTSSettings = class {
       this.restartCallback();
     }
     if (ttsSettings.volume) {
-      if (IS_DEV)
-        console.log("volume " + this.volume);
+      import_loglevel15.default.log("volume " + this.volume);
       this.volume = ttsSettings.volume;
       let prop = this.userProperties.getByRef(TTSREFS.VOLUME_REF);
       if (prop) {
@@ -43079,8 +43287,7 @@ var TTSSettings = class {
       this.settingsChangeCallback();
     }
     if (ttsSettings.autoScroll !== void 0) {
-      if (IS_DEV)
-        console.log("autoScroll " + this.autoScroll);
+      import_loglevel15.default.log("autoScroll " + this.autoScroll);
       this.autoScroll = ttsSettings.autoScroll;
       let prop = this.userProperties.getByRef(TTSREFS.AUTO_SCROLL_REF);
       if (prop) {
@@ -43090,8 +43297,7 @@ var TTSSettings = class {
       this.settingsChangeCallback();
     }
     if (ttsSettings.voice) {
-      if (IS_DEV)
-        console.log("voice " + this.voice);
+      import_loglevel15.default.log("voice " + this.voice);
       this.voice = ttsSettings.voice;
       let prop = this.userProperties.getByRef(TTSREFS.VOICE_REF);
       if (prop) {
@@ -43180,9 +43386,6 @@ init_polyfills();
 
 // src/utils/HTMLTemplates.ts
 init_polyfills();
-var simpleUpLinkTemplate = (href, _label, ariaLabel) => `
-<a rel="up" href='${href}' aria-label="${ariaLabel}" style="padding: 0px"><i class="material-icons show-on-large">arrow_back_ios</i></a>
-`;
 var readerLoading = `${icons.loading}`;
 var readerError = `
     <span>
@@ -43430,15 +43633,14 @@ var SampleReadEventHandler = class {
 
 // src/navigator/IFrameNavigator.ts
 var import_eventemitter3 = __toModule(require_eventemitter3());
+var import_loglevel16 = __toModule(require_loglevel());
 var IFrameNavigator = class extends import_eventemitter3.default {
-  constructor(settings, annotator = void 0, upLinkConfig = void 0, initialLastReadingPosition = void 0, publication, material, api, rights, tts, injectables, attributes, services, sample) {
+  constructor(settings, annotator = void 0, initialLastReadingPosition = void 0, publication, api, rights, tts, injectables, attributes, services, sample, requestConfig) {
     super();
     this.iframes = [];
     this.sideNavExpanded = false;
-    this.material = false;
     this.currentChapterLink = { href: "" };
     this.currentSpreadLinks = {};
-    this.upLink = void 0;
     this.rights = {
       autoGeneratePositions: false,
       enableAnnotations: false,
@@ -43467,10 +43669,8 @@ var IFrameNavigator = class extends import_eventemitter3.default {
       }
       if (lastReadingPosition) {
         const linkHref = this.publication.getAbsoluteHref(lastReadingPosition.href);
-        if (IS_DEV)
-          console.log(lastReadingPosition.href);
-        if (IS_DEV)
-          console.log(linkHref);
+        import_loglevel16.default.log(lastReadingPosition.href);
+        import_loglevel16.default.log(linkHref);
         lastReadingPosition.href = linkHref;
         await this.navigate(lastReadingPosition);
       }
@@ -43503,10 +43703,8 @@ var IFrameNavigator = class extends import_eventemitter3.default {
     this.eventHandler = new EventHandler(this);
     this.touchEventHandler = new TouchEventHandler(this);
     this.keyboardEventHandler = new KeyboardEventHandler(this);
-    this.upLinkConfig = upLinkConfig;
     this.initialLastReadingPosition = initialLastReadingPosition;
     this.publication = publication;
-    this.material = material;
     this.api = api;
     this.rights = rights ?? {
       autoGeneratePositions: false,
@@ -43529,17 +43727,16 @@ var IFrameNavigator = class extends import_eventemitter3.default {
     this.attributes = attributes || { margin: 0 };
     this.services = services;
     this.sample = sample;
+    this.requestConfig = requestConfig;
     this.sampleReadEventHandler = new SampleReadEventHandler(this);
   }
   static async create(config2) {
-    const navigator2 = new this(config2.settings, config2.annotator || void 0, config2.upLink || void 0, config2.initialLastReadingPosition || void 0, config2.publication, config2.material, config2.api, config2.rights, config2.tts, config2.injectables, config2.attributes || { margin: 0 }, config2.services, config2.sample);
+    const navigator2 = new this(config2.settings, config2.annotator || void 0, config2.initialLastReadingPosition || void 0, config2.publication, config2.api, config2.rights, config2.tts, config2.injectables, config2.attributes || { margin: 0 }, config2.services, config2.sample, config2.requestConfig);
     await navigator2.start(config2.mainElement, config2.headerMenu, config2.footerMenu);
     return new Promise((resolve) => resolve(navigator2));
   }
   stop() {
-    if (IS_DEV) {
-      console.log("Iframe navigator stop");
-    }
+    import_loglevel16.default.log("Iframe navigator stop");
     removeEventListenerOptional(this.previousChapterAnchorElement, "click", this.handlePreviousChapterClick.bind(this));
     removeEventListenerOptional(this.nextChapterAnchorElement, "click", this.handleNextChapterClick.bind(this));
     removeEventListenerOptional(this.previousChapterTopAnchorElement, "click", this.handlePreviousPageClick.bind(this));
@@ -43747,7 +43944,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
       this.setupEvents();
       return await this.loadManifest();
     } catch (err) {
-      console.error(err);
+      import_loglevel16.default.error(err);
       this.abortOnError(err);
       return Promise.reject(err);
     }
@@ -44030,22 +44227,6 @@ var IFrameNavigator = class extends import_eventemitter3.default {
           this.landmarksSection.parentElement?.removeChild(this.landmarksSection);
         }
       }
-      if ((this.links || this.linksTopLeft) && this.upLinkConfig && this.upLinkConfig.url) {
-        const upUrl = this.upLinkConfig.url;
-        const upLabel = this.upLinkConfig.label || "";
-        const upAriaLabel = this.upLinkConfig.ariaLabel || upLabel;
-        var upHTML = simpleUpLinkTemplate(upUrl.href, upLabel, upAriaLabel);
-        const upParent = document.createElement("li");
-        upParent.classList.add("uplink-wrapper");
-        upParent.innerHTML = upHTML;
-        if (this.links) {
-          this.links.insertBefore(upParent, this.links.firstChild);
-          this.upLink = findRequiredElement(this.links, "a[rel=up]");
-        } else {
-          this.linksTopLeft.insertBefore(upParent, this.linksTopLeft.firstChild);
-          this.upLink = findRequiredElement(this.linksTopLeft, "a[rel=up]");
-        }
-      }
       let lastReadingPosition = void 0;
       if (this.annotator) {
         lastReadingPosition = await this.annotator.getLastReadingPosition();
@@ -44057,10 +44238,8 @@ var IFrameNavigator = class extends import_eventemitter3.default {
       }
       if (lastReadingPosition) {
         const linkHref = this.publication.getAbsoluteHref(lastReadingPosition.href);
-        if (IS_DEV)
-          console.log(lastReadingPosition.href);
-        if (IS_DEV)
-          console.log(linkHref);
+        import_loglevel16.default.log(lastReadingPosition.href);
+        import_loglevel16.default.log(linkHref);
         lastReadingPosition.href = linkHref;
         await this.navigate(lastReadingPosition);
       } else if (startUrl) {
@@ -44076,7 +44255,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
       }
       return new Promise((resolve) => resolve());
     } catch (err) {
-      console.error(err);
+      import_loglevel16.default.error(err);
       this.abortOnError(err);
       return new Promise((_, reject) => reject(err)).catch(() => {
       });
@@ -44258,7 +44437,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
       }, 200);
       return new Promise((resolve) => resolve());
     } catch (err) {
-      console.error(err);
+      import_loglevel16.default.error(err);
       this.abortOnError(err);
       return Promise.reject(err);
     }
@@ -44385,7 +44564,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
                 if (isSameOrigin) {
                   this.iframes[0].src = this.currentChapterLink.href;
                 } else {
-                  fetch(this.currentChapterLink.href).then((r) => r.text()).then(async (content2) => {
+                  fetch(this.currentChapterLink.href, this.requestConfig).then((r) => r.text()).then(async (content2) => {
                     writeIframeDoc.call(this, content2, this.currentChapterLink.href);
                   });
                 }
@@ -44406,7 +44585,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
                       if (isSameOrigin) {
                         this.iframes[1].src = href;
                       } else {
-                        fetch(href).then((r) => r.text()).then(async (content2) => {
+                        fetch(href, this.requestConfig).then((r) => r.text()).then(async (content2) => {
                           writeIframe2Doc.call(this, content2, href);
                           this.currentSpreadLinks.right = {
                             href
@@ -44435,7 +44614,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
                     if (isSameOrigin) {
                       this.iframes[0].src = href;
                     } else {
-                      fetch(href).then((r) => r.text()).then(async (content2) => {
+                      fetch(href, this.requestConfig).then((r) => r.text()).then(async (content2) => {
                         writeIframeDoc.call(this, content2, href);
                       });
                     }
@@ -44456,7 +44635,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
                   if (isSameOrigin) {
                     this.iframes[1].src = this.currentChapterLink.href;
                   } else {
-                    fetch(this.currentChapterLink.href).then((r) => r.text()).then(async (content2) => {
+                    fetch(this.currentChapterLink.href, this.requestConfig).then((r) => r.text()).then(async (content2) => {
                       writeIframe2Doc.call(this, content2, this.currentChapterLink.href);
                     });
                   }
@@ -44475,7 +44654,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
               if (isSameOrigin) {
                 this.iframes[0].src = this.currentChapterLink.href;
               } else {
-                fetch(this.currentChapterLink.href).then((r) => r.text()).then(async (content2) => {
+                fetch(this.currentChapterLink.href, this.requestConfig).then((r) => r.text()).then(async (content2) => {
                   writeIframeDoc.call(this, content2, this.currentChapterLink.href);
                 });
               }
@@ -44493,7 +44672,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
             if (isSameOrigin) {
               this.iframes[0].src = this.currentChapterLink.href;
             } else {
-              fetch(this.currentChapterLink.href).then((r) => r.text()).then(async (content2) => {
+              fetch(this.currentChapterLink.href, this.requestConfig).then((r) => r.text()).then(async (content2) => {
                 writeIframeDoc.call(this, content2, this.currentChapterLink.href);
               });
             }
@@ -44526,7 +44705,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
                 }
               }
             } else {
-              fetch(this.currentChapterLink.href).then((r) => r.text()).then(async (content) => {
+              fetch(this.currentChapterLink.href, this.requestConfig).then((r) => r.text()).then(async (content) => {
                 writeIframeDoc.call(this, content, this.currentChapterLink.href);
               });
               if (this.iframes.length === 2) {
@@ -44537,7 +44716,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
                     this.currentSpreadLinks.right = {
                       href
                     };
-                    fetch(href).then((r) => r.text()).then(async (content) => {
+                    fetch(href, this.requestConfig).then((r) => r.text()).then(async (content) => {
                       writeIframe2Doc.call(this, content, href);
                     });
                   }
@@ -44560,14 +44739,14 @@ var IFrameNavigator = class extends import_eventemitter3.default {
                     this.iframes[1].src = this.currentChapterLink.href;
                   }
                 } else {
-                  fetch(href).then((r) => r.text()).then(async (content) => {
+                  fetch(href, this.requestConfig).then((r) => r.text()).then(async (content) => {
                     writeIframeDoc.call(this, content, href);
                   });
                   if (this.iframes.length === 2) {
                     this.currentSpreadLinks.right = {
                       href: this.currentChapterLink.href
                     };
-                    fetch(this.currentChapterLink.href).then((r) => r.text()).then(async (content) => {
+                    fetch(this.currentChapterLink.href, this.requestConfig).then((r) => r.text()).then(async (content) => {
                       writeIframe2Doc.call(this, content, this.currentChapterLink.href);
                     });
                   }
@@ -44583,7 +44762,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
               if (isSameOrigin) {
                 this.iframes[1].src = this.currentChapterLink.href;
               } else {
-                fetch(this.currentChapterLink.href).then((r) => r.text()).then(async (content) => {
+                fetch(this.currentChapterLink.href, this.requestConfig).then((r) => r.text()).then(async (content) => {
                   writeIframe2Doc.call(this, content, this.currentChapterLink.href);
                 });
               }
@@ -44596,7 +44775,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
           if (isSameOrigin) {
             this.iframes[0].src = this.currentChapterLink.href;
           } else {
-            fetch(this.currentChapterLink.href).then((r) => r.text()).then(async (content) => {
+            fetch(this.currentChapterLink.href, this.requestConfig).then((r) => r.text()).then(async (content) => {
               writeIframeDoc.call(this, content, this.currentChapterLink.href);
             });
           }
@@ -44608,7 +44787,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
         if (isSameOrigin) {
           this.iframes[0].src = this.currentChapterLink.href;
         } else {
-          fetch(this.currentChapterLink.href).then((r) => r.text()).then(async (content) => {
+          fetch(this.currentChapterLink.href, this.requestConfig).then((r) => r.text()).then(async (content) => {
             writeIframeDoc.call(this, content, this.currentChapterLink.href);
           });
         }
@@ -44793,10 +44972,8 @@ var IFrameNavigator = class extends import_eventemitter3.default {
     const position = __spreadValues({}, locator);
     position.locations = locations;
     const linkHref = this.publication.getAbsoluteHref(locator.href);
-    if (IS_DEV)
-      console.log(locator.href);
-    if (IS_DEV)
-      console.log(linkHref);
+    import_loglevel16.default.log(locator.href);
+    import_loglevel16.default.log(linkHref);
     position.href = linkHref;
     this.stopReadAloud();
     this.navigate(position);
@@ -44847,7 +45024,7 @@ var IFrameNavigator = class extends import_eventemitter3.default {
   snapToSelector(selector2) {
     const doc = this.iframes[0].contentDocument;
     if (doc) {
-      console.log(selector2);
+      import_loglevel16.default.log(selector2);
       let result = doc.querySelectorAll(selector2);
       if (result.length > 0)
         this.view?.snap(result[0]);
@@ -45543,15 +45720,11 @@ var IFrameNavigator = class extends import_eventemitter3.default {
           }
           if (this.api?.updateCurrentLocation) {
             this.api?.updateCurrentLocation(position).then(async (_) => {
-              if (IS_DEV) {
-                console.log("api updated current location", position);
-              }
+              import_loglevel16.default.log("api updated current location", position);
               return this.annotator?.saveLastReadingPosition(position);
             });
           } else {
-            if (IS_DEV) {
-              console.log("save last reading position", position);
-            }
+            import_loglevel16.default.log("save last reading position", position);
             this.annotator.saveLastReadingPosition(position);
           }
         }
@@ -45788,8 +45961,12 @@ var _LocalAnnotator = class {
       const uniqueStr = `${rangeRepresentation.highlight.selectionInfo.rangeInfo.startContainerElementCssSelector}${rangeRepresentation.highlight.selectionInfo.rangeInfo.startContainerChildTextNodeIndex}${rangeRepresentation.highlight.selectionInfo.rangeInfo.startOffset}${rangeRepresentation.highlight.selectionInfo.rangeInfo.endContainerElementCssSelector}${rangeRepresentation.highlight.selectionInfo.rangeInfo.endContainerChildTextNodeIndex}${rangeRepresentation.highlight.selectionInfo.rangeInfo.endOffset}`;
       const sha256Hex = SHA256.hash(uniqueStr);
       rangeRepresentation.highlight.id = "R2_HIGHLIGHT_" + sha256Hex;
-      var rangeColor;
-      rangeColor = rangeRepresentation.color;
+      let rangeColor;
+      if (rangeRepresentation.highlight.color) {
+        rangeColor = rangeRepresentation.highlight.color;
+      } else if (rangeRepresentation.color) {
+        rangeColor = rangeRepresentation.color;
+      }
       if (TextHighlighter.isHexColor(rangeColor)) {
         rangeColor = TextHighlighter.hexToRgbString(rangeColor);
       }
@@ -45801,6 +45978,21 @@ var _LocalAnnotator = class {
     this.store.set(_LocalAnnotator.ANNOTATIONS, JSON.stringify(annotationsToStore));
     return annotationsToStore;
   }
+  saveTemporarySelectionInfo(selectionInfo) {
+    this.store.set(_LocalAnnotator.SELECTIONINFO, JSON.stringify(selectionInfo));
+  }
+  getTemporarySelectionInfo(doc) {
+    const selectionInfos = this.store.get(_LocalAnnotator.SELECTIONINFO);
+    if (selectionInfos) {
+      let selectionInfo = JSON.parse(selectionInfos);
+      selectionInfo.range = convertRangeInfo(doc, selectionInfo.rangeInfo);
+      return selectionInfo;
+    }
+    return [];
+  }
+  deleteTemporarySelectionInfo() {
+    this.store.remove(_LocalAnnotator.SELECTIONINFO);
+  }
   saveAnnotation(annotation) {
     let savedAnnotations = this.store.get(_LocalAnnotator.ANNOTATIONS);
     if (savedAnnotations) {
@@ -45851,7 +46043,7 @@ var _LocalAnnotator = class {
     const savedAnnotations = this.store.get(_LocalAnnotator.ANNOTATIONS);
     if (savedAnnotations) {
       const annotations = JSON.parse(savedAnnotations);
-      const filtered = annotations.filter((el) => el.id === id2);
+      const filtered = annotations.filter((el) => el.highlight?.id === id2 || el.id === id2);
       if (filtered.length > 0) {
         let foundElement = iframeWin.document.getElementById(`${filtered[0].highlight.id}`);
         if (foundElement) {
@@ -45873,6 +46065,33 @@ var _LocalAnnotator = class {
     }
     return null;
   }
+  getAnnotationElement(id2, iframeWin) {
+    const savedAnnotations = this.store.get(_LocalAnnotator.ANNOTATIONS);
+    if (savedAnnotations) {
+      const annotations = JSON.parse(savedAnnotations);
+      const filtered = annotations.filter((el) => el.highlight?.id === id2);
+      if (filtered.length > 0) {
+        let foundElement = iframeWin.document.getElementById(`${filtered[0].highlight.id}`);
+        if (foundElement) {
+          let position = 0;
+          if (foundElement.hasChildNodes) {
+            for (let i = 0; i < foundElement.childNodes.length; i++) {
+              let childNode = foundElement.childNodes[i];
+              let top = parseInt(childNode.style.top.replace("px", ""));
+              if (top < position || position === 0) {
+                position = top;
+                return childNode;
+              }
+            }
+          } else {
+            position = parseInt(foundElement.style.top.replace("px", ""));
+          }
+          return foundElement;
+        }
+      }
+    }
+    return null;
+  }
   getAnnotation(highlight) {
     const savedAnnotations = this.store.get(_LocalAnnotator.ANNOTATIONS);
     if (savedAnnotations) {
@@ -45900,6 +46119,7 @@ var LocalAnnotator = _LocalAnnotator;
 LocalAnnotator.LAST_READING_POSITION = "last-reading-position";
 LocalAnnotator.BOOKMARKS = "bookmarks";
 LocalAnnotator.ANNOTATIONS = "annotations";
+LocalAnnotator.SELECTIONINFO = "selectionInfo";
 
 // src/store/LocalStorageStore.ts
 init_polyfills();
@@ -46022,6 +46242,7 @@ function convertAndCamel(o) {
 
 // src/modules/highlight/LayerSettings.ts
 init_polyfills();
+var import_loglevel17 = __toModule(require_loglevel());
 var LayerSettings = class {
   constructor(store) {
     this.LAYERSETTINGS = "layerSetting";
@@ -46033,9 +46254,7 @@ var LayerSettings = class {
     return new Promise((resolve) => resolve(settings));
   }
   async stop() {
-    if (IS_DEV) {
-      console.log("MediaOverlay settings stop");
-    }
+    import_loglevel17.default.log("MediaOverlay settings stop");
   }
   async initialize() {
     this.userProperties = await this.getLayerSettings();
@@ -46079,6 +46298,7 @@ var LayerSettings = class {
 
 // src/modules/pagebreak/PageBreakModule.ts
 init_polyfills();
+var import_loglevel18 = __toModule(require_loglevel());
 var PageBreakModule = class {
   static async create(config2) {
     const pageBreak = new this(config2.delegate, config2.publication, config2, config2.headerMenu);
@@ -46092,9 +46312,7 @@ var PageBreakModule = class {
     this.properties = properties;
   }
   async stop() {
-    if (IS_DEV) {
-      console.log("Page Break module stop");
-    }
+    import_loglevel18.default.log("Page Break module stop");
   }
   async start() {
     this.delegate.pageBreakModule = this;
@@ -46160,16 +46378,15 @@ var PageBreakModule = class {
             return "";
           }
         } catch (err) {
-          console.log("uniqueCssSelector:");
-          console.log(err);
+          import_loglevel18.default.log("uniqueCssSelector:");
+          import_loglevel18.default.error(err);
           return "";
         }
       }
       if (pageBreaks) {
         for (let i = 0; i < pageBreaks.length; i++) {
           let img = pageBreaks[i];
-          if (IS_DEV)
-            console.log(img);
+          import_loglevel18.default.log(img);
           let title = img.innerHTML;
           let hide = false;
           if (img.innerHTML.length === 0) {
@@ -46242,6 +46459,7 @@ var PageBreakModule = class {
 init_polyfills();
 var import_sanitize_html2 = __toModule(require_sanitize_html());
 var import_debounce6 = __toModule(require_debounce());
+var import_loglevel19 = __toModule(require_loglevel());
 var TTSModule2 = class {
   constructor(delegate, tts, rights, highlighter, properties, api, headerMenu) {
     this.voices = [];
@@ -46316,7 +46534,12 @@ var TTSModule2 = class {
     if (window.speechSynthesis.speaking && this.speaking && startX === this.startX && startY === this.startY) {
       let doc = this.delegate.iframes[0].contentDocument;
       if (doc) {
-        const selection = this.highlighter.dom(doc.body).getSelection();
+        let selection = this.highlighter.dom(doc.body).getSelection();
+        if (selection.isCollapsed) {
+          let doc2 = this.delegate.iframes[0].contentDocument;
+          const selectionInfo = this.delegate.annotationModule?.annotator?.getTemporarySelectionInfo(doc2);
+          selection.addRange(selectionInfo.range);
+        }
         let range = selection.getRangeAt(0);
         let node = selection.anchorNode;
         while (range.toString().indexOf(" ") !== 0) {
@@ -46359,16 +46582,14 @@ var TTSModule2 = class {
     }
     let s = setSpeech();
     s.then(async (voices) => {
-      if (IS_DEV)
-        console.log(voices);
+      import_loglevel19.default.log(voices);
       this.voices = [];
       voices.forEach((voice) => {
         if (voice.localService === true) {
           this.voices.push(voice);
         }
       });
-      if (IS_DEV)
-        console.log(this.voices);
+      import_loglevel19.default.log(this.voices);
       if (first) {
         if (this.headerMenu) {
           var preferredLanguageSelector = findElement(this.headerMenu, "#preferred-languages");
@@ -46413,20 +46634,25 @@ var TTSModule2 = class {
       let rootEl = iframe.contentWindow?.document.body;
       let doc = this.delegate.iframes[0].contentDocument;
       if (doc) {
-        const selection = this.highlighter.dom(doc.body).getSelection();
+        let selection = this.highlighter.dom(doc.body).getSelection();
+        if (selection.isCollapsed) {
+          let doc2 = self2.delegate.iframes[0].contentDocument;
+          const selectionInfo2 = self2.delegate.annotationModule?.annotator?.getTemporarySelectionInfo(doc2);
+          selection.addRange(selectionInfo2.range);
+        }
         if (rootEl) {
           var ttsQueue = this.generateTtsQueue(rootEl);
           if (!ttsQueue.length) {
             return;
           }
           var idx = this.findTtsQueueItemIndex(ttsQueue, selection.anchorNode, selection.anchorNode, selection.anchorOffset, rootEl);
-          const ttsQueueItem = getTtsQueueItemRef(ttsQueue, idx);
           var idxEnd = this.findTtsQueueItemIndex(ttsQueue, selection.focusNode, selection.focusNode, selection.focusOffset, rootEl);
+          const ttsQueueItem = getTtsQueueItemRef(ttsQueue, idx);
           const ttsQueueItemEnd = getTtsQueueItemRef(ttsQueue, idxEnd);
           var restOfTheText;
           if (ttsQueueItem && selectionInfo && selectionInfo.cleanText) {
             const sentence = getTtsQueueItemRefText(ttsQueueItem);
-            let startIndex = sentence.indexOf(selectionInfo.cleanText);
+            let startIndex = selectionInfo.rangeInfo.startOffset;
             let textToBeSpoken = selectionInfo.cleanText;
             if (ttsQueueItemEnd && idx + 1 === idxEnd) {
               const sentenceEnd = getTtsQueueItemRefText(ttsQueueItemEnd);
@@ -46434,26 +46660,36 @@ var TTSModule2 = class {
               textToBeSpoken = sentence.slice(startIndex, sentence.length);
               restOfTheText = selectionInfo.cleanText.replace(textToBeSpoken, "").trim();
             } else if (idxEnd > idx) {
-              let mergedSentenses = "";
+              let mergedSentences = "";
               for (let i = idx + 1; i < idxEnd; i++) {
                 const ttsQueueItemInBetween = getTtsQueueItemRef(ttsQueue, i);
                 if (ttsQueueItemInBetween) {
                   const sentenceInBetween = getTtsQueueItemRefText(ttsQueueItemInBetween);
-                  mergedSentenses += sentenceInBetween;
+                  mergedSentences += sentenceInBetween;
                   restOfTheText = selectionInfo.cleanText.replace(sentenceInBetween, "");
                 }
               }
               if (ttsQueueItemEnd) {
                 const sentenceEnd = getTtsQueueItemRefText(ttsQueueItemEnd);
-                mergedSentenses += " " + sentenceEnd;
+                mergedSentences += " " + sentenceEnd;
               }
-              startIndex = (sentence + " " + mergedSentenses).indexOf(selectionInfo.cleanText);
+              startIndex = (sentence + " " + mergedSentences).indexOf(selectionInfo.cleanText);
               textToBeSpoken = sentence.slice(startIndex, sentence.length);
               restOfTheText = restOfTheText.replace(textToBeSpoken, "").trim();
             }
             utterance = new SpeechSynthesisUtterance(textToBeSpoken);
+            import_loglevel19.default.log(selectionInfo);
+            import_loglevel19.default.log(textToBeSpoken, selectionInfo.range?.commonAncestorContainer.textContent);
+            import_loglevel19.default.log(ttsQueueItem);
+            import_loglevel19.default.log(ttsQueueItem.item.textNodes);
+            import_loglevel19.default.log(startIndex);
+            import_loglevel19.default.log(ttsQueueItem.item.combinedText);
+            let node = ttsQueueItem.item.textNodes.filter((node2) => {
+              return node2 === selectionInfo.range?.commonAncestorContainer;
+            })[0];
+            import_loglevel19.default.log(node);
             utterance.onboundary = (ev) => {
-              this.updateTTSInfo(ttsQueueItem, ev.charIndex + startIndex, ev.charLength, utterance.text);
+              this.updateTTSInfo(ttsQueueItem, ev.charIndex, ev.charLength, startIndex, utterance.text);
             };
           }
         }
@@ -46464,8 +46700,7 @@ var TTSModule2 = class {
     utterance.rate = this.tts.rate;
     utterance.pitch = this.tts.pitch;
     utterance.volume = this.tts.volume;
-    if (IS_DEV)
-      console.log("this.tts.voice.lang", this.tts.voice.lang);
+    import_loglevel19.default.log("this.tts.voice.lang", this.tts.voice.lang);
     var initialVoiceHasHyphen = true;
     if (this.tts.voice && this.tts.voice.lang) {
       initialVoiceHasHyphen = this.tts.voice.lang.indexOf("-") !== -1;
@@ -46474,10 +46709,8 @@ var TTSModule2 = class {
         initialVoiceHasHyphen = true;
       }
     }
-    if (IS_DEV)
-      console.log("initialVoiceHasHyphen", initialVoiceHasHyphen);
-    if (IS_DEV)
-      console.log("voices", this.voices);
+    import_loglevel19.default.log("initialVoiceHasHyphen", initialVoiceHasHyphen);
+    import_loglevel19.default.log("voices", this.voices);
     var initialVoice;
     if (initialVoiceHasHyphen === true) {
       initialVoice = this.tts.voice && this.tts.voice.lang && this.tts.voice.name ? this.voices.filter((v) => {
@@ -46495,11 +46728,9 @@ var TTSModule2 = class {
         initialVoice = this.tts.voice && this.tts.voice.lang ? this.voices.filter((v) => v.lang === this.tts.voice.lang)[0] : void 0;
       }
     }
-    if (IS_DEV)
-      console.log("initialVoice", initialVoice);
+    import_loglevel19.default.log("initialVoice", initialVoice);
     var publicationVoiceHasHyphen = self2.delegate.publication.Metadata.Language[0].indexOf("-") !== -1;
-    if (IS_DEV)
-      console.log("publicationVoiceHasHyphen", publicationVoiceHasHyphen);
+    import_loglevel19.default.log("publicationVoiceHasHyphen", publicationVoiceHasHyphen);
     var publicationVoice;
     if (publicationVoiceHasHyphen === true) {
       publicationVoice = this.tts.voice && this.tts.voice.usePublication ? this.voices.filter((v) => {
@@ -46511,11 +46742,9 @@ var TTSModule2 = class {
         return v.lang.startsWith(self2.delegate.publication.Metadata.Language[0]) || v.lang.endsWith(self2.delegate.publication.Metadata.Language[0].toUpperCase());
       })[0] : void 0;
     }
-    if (IS_DEV)
-      console.log("publicationVoice", publicationVoice);
+    import_loglevel19.default.log("publicationVoice", publicationVoice);
     var defaultVoiceHasHyphen = navigator.language.indexOf("-") !== -1;
-    if (IS_DEV)
-      console.log("defaultVoiceHasHyphen", defaultVoiceHasHyphen);
+    import_loglevel19.default.log("defaultVoiceHasHyphen", defaultVoiceHasHyphen);
     var defaultVoice;
     if (defaultVoiceHasHyphen === true) {
       defaultVoice = this.voices.filter((voice) => {
@@ -46534,30 +46763,23 @@ var TTSModule2 = class {
         return lang.includes(navigator.language) && voice.localService === true;
       })[0];
     }
-    if (IS_DEV)
-      console.log("defaultVoice", defaultVoice);
+    import_loglevel19.default.log("defaultVoice", defaultVoice);
     if (initialVoice) {
-      if (IS_DEV)
-        console.log("initialVoice");
+      import_loglevel19.default.log("initialVoice");
       utterance.voice = initialVoice;
     } else if (publicationVoice) {
-      if (IS_DEV)
-        console.log("publicationVoice");
+      import_loglevel19.default.log("publicationVoice");
       utterance.voice = publicationVoice;
     } else if (defaultVoice) {
-      if (IS_DEV)
-        console.log("defaultVoice");
+      import_loglevel19.default.log("defaultVoice");
       utterance.voice = defaultVoice;
     }
     if (utterance.voice !== void 0 && utterance.voice !== null) {
       utterance.lang = utterance.voice.lang;
-      if (IS_DEV)
-        console.log("utterance.voice.lang", utterance.voice.lang);
-      if (IS_DEV)
-        console.log("utterance.lang", utterance.lang);
+      import_loglevel19.default.log("utterance.voice.lang", utterance.voice.lang);
+      import_loglevel19.default.log("utterance.lang", utterance.lang);
     }
-    if (IS_DEV)
-      console.log("navigator.language", navigator.language);
+    import_loglevel19.default.log("navigator.language", navigator.language);
     setTimeout(() => {
       window.speechSynthesis.speak(utterance);
     }, 0);
@@ -46572,7 +46794,7 @@ var TTSModule2 = class {
               const sentence = getTtsQueueItemRefText(ttsQueueItem);
               utterance = new SpeechSynthesisUtterance(sentence);
               utterance.onboundary = (ev) => {
-                self2.updateTTSInfo(ttsQueueItem, ev.charIndex, ev.charLength, utterance.text);
+                self2.updateTTSInfo(ttsQueueItem, ev.charIndex, ev.charLength, 0, utterance.text);
               };
               setTimeout(() => {
                 window.speechSynthesis.speak(utterance);
@@ -46584,7 +46806,7 @@ var TTSModule2 = class {
             if (ttsQueueItem) {
               utterance = new SpeechSynthesisUtterance(restOfTheText);
               utterance.onboundary = (ev) => {
-                self2.updateTTSInfo(ttsQueueItem, ev.charIndex, ev.charLength, utterance.text);
+                self2.updateTTSInfo(ttsQueueItem, ev.charIndex, ev.charLength, 0, utterance.text);
               };
               setTimeout(() => {
                 window.speechSynthesis.speak(utterance);
@@ -46592,16 +46814,14 @@ var TTSModule2 = class {
               onend();
             }
             if (idx > idxEnd) {
-              if (IS_DEV)
-                console.log("utterance ended");
+              import_loglevel19.default.log("utterance ended");
               self2.highlighter.doneSpeaking();
               self2.api?.finished();
               self2.delegate.emit("readaloud.finished", "finished");
             }
           }
         } else {
-          if (IS_DEV)
-            console.log("utterance ended");
+          import_loglevel19.default.log("utterance ended");
           self2.highlighter.doneSpeaking();
           self2.api?.finished();
           self2.delegate.emit("readaloud.finished", "finished");
@@ -46718,9 +46938,7 @@ var TTSModule2 = class {
     }
   }
   stop() {
-    if (IS_DEV) {
-      console.log("TTS module stop");
-    }
+    import_loglevel19.default.log("TTS module stop");
     removeEventListenerOptional(document, "wheel", this.wheel.bind(this));
     removeEventListenerOptional(this.body, "wheel", this.wheel.bind(this));
     removeEventListenerOptional(document, "keydown", this.wheel.bind(this));
@@ -46878,8 +47096,7 @@ var TTSModule2 = class {
     utterance.rate = this.tts.rate;
     utterance.pitch = this.tts.pitch;
     utterance.volume = this.tts.volume;
-    if (IS_DEV)
-      console.log("this.tts.voice.lang", this.tts.voice.lang);
+    import_loglevel19.default.log("this.tts.voice.lang", this.tts.voice.lang);
     var initialVoiceHasHyphen = true;
     if (this.tts.voice && this.tts.voice.lang) {
       initialVoiceHasHyphen = this.tts.voice.lang.indexOf("-") !== -1;
@@ -46888,10 +47105,8 @@ var TTSModule2 = class {
         initialVoiceHasHyphen = true;
       }
     }
-    if (IS_DEV)
-      console.log("initialVoiceHasHyphen", initialVoiceHasHyphen);
-    if (IS_DEV)
-      console.log("voices", this.voices);
+    import_loglevel19.default.log("initialVoiceHasHyphen", initialVoiceHasHyphen);
+    import_loglevel19.default.log("voices", this.voices);
     var initialVoice;
     if (initialVoiceHasHyphen === true) {
       initialVoice = this.tts.voice && this.tts.voice.lang && this.tts.voice.name ? this.voices.filter((v) => {
@@ -46909,12 +47124,10 @@ var TTSModule2 = class {
         initialVoice = this.tts.voice && this.tts.voice.lang ? this.voices.filter((v) => v.lang === this.tts.voice.lang)[0] : void 0;
       }
     }
-    if (IS_DEV)
-      console.log("initialVoice", initialVoice);
+    import_loglevel19.default.log("initialVoice", initialVoice);
     var self2 = this;
     var publicationVoiceHasHyphen = self2.delegate.publication.Metadata.Language[0].indexOf("-") !== -1;
-    if (IS_DEV)
-      console.log("publicationVoiceHasHyphen", publicationVoiceHasHyphen);
+    import_loglevel19.default.log("publicationVoiceHasHyphen", publicationVoiceHasHyphen);
     var publicationVoice;
     if (publicationVoiceHasHyphen === true) {
       publicationVoice = this.tts.voice && this.tts.voice.usePublication ? this.voices.filter((v) => {
@@ -46926,11 +47139,9 @@ var TTSModule2 = class {
         return v.lang.startsWith(self2.delegate.publication.Metadata.Language[0]) || v.lang.endsWith(self2.delegate.publication.Metadata.Language[0].toUpperCase());
       })[0] : void 0;
     }
-    if (IS_DEV)
-      console.log("publicationVoice", publicationVoice);
+    import_loglevel19.default.log("publicationVoice", publicationVoice);
     var defaultVoiceHasHyphen = navigator.language.indexOf("-") !== -1;
-    if (IS_DEV)
-      console.log("defaultVoiceHasHyphen", defaultVoiceHasHyphen);
+    import_loglevel19.default.log("defaultVoiceHasHyphen", defaultVoiceHasHyphen);
     var defaultVoice;
     if (defaultVoiceHasHyphen === true) {
       defaultVoice = this.voices.filter((voice) => {
@@ -46949,33 +47160,26 @@ var TTSModule2 = class {
         return lang.includes(navigator.language) && voice.localService === true;
       })[0];
     }
-    if (IS_DEV)
-      console.log("defaultVoice", defaultVoice);
+    import_loglevel19.default.log("defaultVoice", defaultVoice);
     if (initialVoice) {
-      if (IS_DEV)
-        console.log("initialVoice");
+      import_loglevel19.default.log("initialVoice");
       utterance.voice = initialVoice;
     } else if (publicationVoice) {
-      if (IS_DEV)
-        console.log("publicationVoice");
+      import_loglevel19.default.log("publicationVoice");
       utterance.voice = publicationVoice;
     } else if (defaultVoice) {
-      if (IS_DEV)
-        console.log("defaultVoice");
+      import_loglevel19.default.log("defaultVoice");
       utterance.voice = defaultVoice;
     }
     if (utterance.voice !== void 0 && utterance.voice !== null) {
       utterance.lang = utterance.voice.lang;
-      if (IS_DEV)
-        console.log("utterance.voice.lang", utterance.voice.lang);
-      if (IS_DEV)
-        console.log("utterance.lang", utterance.lang);
+      import_loglevel19.default.log("utterance.voice.lang", utterance.voice.lang);
+      import_loglevel19.default.log("utterance.lang", utterance.lang);
     }
-    if (IS_DEV)
-      console.log("navigator.language", navigator.language);
+    import_loglevel19.default.log("navigator.language", navigator.language);
     utterance.onboundary = (ev) => {
-      console.log(ev.name);
-      this.updateTTSInfo(ttsQueueItem, ev.charIndex, ev.charLength, utterance.text);
+      import_loglevel19.default.log(ev.name);
+      this.updateTTSInfo(ttsQueueItem, ev.charIndex, ev.charLength, 0, utterance.text);
     };
     setTimeout(() => {
       window.speechSynthesis.speak(utterance);
@@ -46989,44 +47193,40 @@ var TTSModule2 = class {
       }
     };
   }
-  updateTTSInfo(ttsQueueItem, charIndex, charLength, utteranceText) {
+  updateTTSInfo(ttsQueueItem, charIndex, charLength, startIndex, utteranceText) {
     if (!ttsQueueItem) {
       return void 0;
     }
+    import_loglevel19.default.log(ttsQueueItem, charIndex, charLength, utteranceText);
     const ttsQueueItemText = utteranceText ? utteranceText : getTtsQueueItemRefText(ttsQueueItem);
     if (charIndex >= 0 && utteranceText) {
       const start = utteranceText.slice(0, charIndex + 1).search(/\S+$/);
       const right = utteranceText.slice(charIndex).search(/\s/);
       const word = right < 0 ? utteranceText.slice(start) : utteranceText.slice(start, right + charIndex);
       const end = start + word.length;
-      let useStart = false;
-      if (!charLength) {
+      if (charLength === void 0) {
+        const match = utteranceText.substring(charIndex).match(/^[a-z\d']*/i);
+        if (match) {
+          charLength = match[0].length;
+        }
+      }
+      if (charLength === void 0) {
         charLength = word.length;
-        useStart = true;
-      } else {
-        useStart = false;
       }
-      this.wrapHighlightWord(ttsQueueItem, utteranceText, useStart ? start : charIndex, charLength, word, start, end);
+      this.wrapHighlightWord(ttsQueueItem, utteranceText, charIndex + startIndex, charLength, word, start, end);
     }
     return ttsQueueItemText;
   }
   wrapHighlightWord(ttsQueueItemRef, utteranceText, charIndex, charLength, word, start, end) {
+    import_loglevel19.default.log(ttsQueueItemRef);
+    import_loglevel19.default.log(utteranceText);
+    import_loglevel19.default.log(charIndex, charLength, word, start, end);
     if (this._ttsQueueItemHighlightsWord) {
       this.delegate.highlighter?.destroyHighlights(HighlightType.ReadAloud);
       this._ttsQueueItemHighlightsWord = void 0;
     }
     const ttsQueueItem = ttsQueueItemRef.item;
-    let txtToCheck = ttsQueueItemRef.item.combinedText;
     let charIndexAdjusted = charIndex;
-    if (IS_DEV) {
-      if (utteranceText !== txtToCheck) {
-        console.log("TTS utteranceText DIFF?? ", `[[${utteranceText}]]`, `[[${txtToCheck}]]`);
-      }
-      const ttsWord = utteranceText.substr(charIndex, charLength);
-      if (ttsWord !== word) {
-        console.log("TTS word DIFF?? ", `[[${ttsWord}]]`, `[[${word}]]`, `${charIndex}--${charLength}`, `${start}--${end - start}`);
-      }
-    }
     let acc = 0;
     let rangeStartNode;
     let rangeStartOffset = -1;
@@ -47063,8 +47263,8 @@ var TTSModule2 = class {
             return "";
           }
         } catch (err) {
-          console.log("uniqueCssSelector:");
-          console.log(err);
+          import_loglevel19.default.log("uniqueCssSelector:");
+          import_loglevel19.default.error(err);
           return "";
         }
       };
@@ -47171,6 +47371,7 @@ function getTtsQueueItemRefText(obj) {
 init_polyfills();
 var lodash3 = __toModule(require_lodash());
 var import_debounce7 = __toModule(require_debounce());
+var import_loglevel20 = __toModule(require_loglevel());
 var DefinitionsModule = class {
   constructor(delegate, publication, properties, highlighter, api) {
     this.currentChapterPopupResult = [];
@@ -47195,9 +47396,7 @@ var DefinitionsModule = class {
     return search;
   }
   async stop() {
-    if (IS_DEV) {
-      console.log("Definitions module stop");
-    }
+    import_loglevel20.default.log("Definitions module stop");
   }
   async start() {
     this.delegate.definitionsModule = this;
@@ -47319,6 +47518,7 @@ var DefinitionsModule = class {
 
 // src/modules/linefocus/LineFocusModule.ts
 init_polyfills();
+var import_loglevel21 = __toModule(require_loglevel());
 var DEFAULT_BACKGROUND_COLOR_OPACITY2 = 0.5;
 var LineFocusModule = class {
   constructor(delegate, properties, highlighter, api) {
@@ -47343,9 +47543,7 @@ var LineFocusModule = class {
     return search;
   }
   async stop() {
-    if (IS_DEV) {
-      console.log("Definitions module stop");
-    }
+    import_loglevel21.default.log("Definitions module stop");
     this.hasEventListener = false;
     removeEventListenerOptional(document, "keydown", this.keydown.bind(this));
     removeEventListenerOptional(document, "keyup", this.keyup.bind(this));
@@ -47740,11 +47938,9 @@ var LineFocusModule = class {
       range.detach();
       return rect;
     } catch (error) {
-      if (IS_DEV) {
-        console.log("measureTextNode " + error);
-        console.log("measureTextNode " + node);
-        console.log(node.textContent);
-      }
+      import_loglevel21.default.log("measureTextNode " + error);
+      import_loglevel21.default.log("measureTextNode " + node);
+      import_loglevel21.default.log(`${node.textContent}`);
     }
   }
   measureImageNodes(node) {
@@ -47755,17 +47951,16 @@ var LineFocusModule = class {
       range.detach();
       return rect;
     } catch (error) {
-      if (IS_DEV) {
-        console.log("measureTextNode " + error);
-        console.log("measureTextNode " + node);
-        console.log(node.textContent);
-      }
+      import_loglevel21.default.log("measureTextNode " + error);
+      import_loglevel21.default.log("measureTextNode " + node);
+      import_loglevel21.default.log(`${node.textContent}`);
     }
   }
 };
 
 // src/modules/history/HistoryModule.ts
 init_polyfills();
+var import_loglevel22 = __toModule(require_loglevel());
 var HistoryModule = class {
   constructor(annotator, delegate, publication, properties, headerMenu) {
     this.history = [];
@@ -47781,9 +47976,7 @@ var HistoryModule = class {
     return pageBreak;
   }
   async stop() {
-    if (IS_DEV) {
-      console.log("Page Break module stop");
-    }
+    import_loglevel22.default.log("Page Break module stop");
     removeEventListenerOptional(this.historyForwardAnchorElement, "click", this.handleHistoryForwardClick.bind(this));
     removeEventListenerOptional(this.historyBackAnchorElement, "click", this.handleHistoryBackClick.bind(this));
   }
@@ -47821,10 +48014,8 @@ var HistoryModule = class {
         lastInHistory = this.history[this.history.length - 1];
         if (lastInHistory && lastInHistory.href !== lastReadingPosition.href || lastInHistory === void 0) {
           const linkHref = this.publication.getAbsoluteHref(lastReadingPosition.href);
-          if (IS_DEV)
-            console.log(lastReadingPosition.href);
-          if (IS_DEV)
-            console.log(linkHref);
+          import_loglevel22.default.log(lastReadingPosition.href);
+          import_loglevel22.default.log(linkHref);
           lastReadingPosition.href = linkHref;
           this.history.push(lastReadingPosition);
           this.historyCurrentIndex = this.history.length - 1;
@@ -47874,6 +48065,7 @@ var HistoryModule = class {
 
 // src/modules/citation/CitationModule.ts
 init_polyfills();
+var import_loglevel23 = __toModule(require_loglevel());
 var CitationStyle;
 (function(CitationStyle2) {
   CitationStyle2[CitationStyle2["Chicago"] = 0] = "Chicago";
@@ -47888,21 +48080,20 @@ var ContributorType;
   ContributorType2["Compiler"] = "Compiler";
 })(ContributorType || (ContributorType = {}));
 var CitationModule = class {
-  constructor(delegate, publication, highlighter, properties) {
+  constructor(delegate, publication, highlighter, properties, api) {
     this.highlighter = highlighter;
     this.delegate = delegate;
     this.properties = properties;
     this.publication = publication;
+    this.api = api;
   }
   static async create(config2) {
-    const module = new this(config2.delegate, config2.publication, config2.highlighter, config2);
+    const module = new this(config2.delegate, config2.publication, config2.highlighter, config2, config2.api);
     await module.start();
     return module;
   }
   async stop() {
-    if (IS_DEV) {
-      console.log("Timeline module stop");
-    }
+    import_loglevel23.default.log("Timeline module stop");
   }
   copyToClipboard(textToClipboard) {
     let success = true;
@@ -47922,9 +48113,9 @@ var CitationModule = class {
       document.body.removeChild(forExecElement);
     }
     if (success) {
-      alert("The text was copied to the clipboard!");
+      this.api?.citationCreated("The text was copied to the clipboard!");
     } else {
-      alert("Your browser doesn't allow clipboard access!");
+      this.api?.citationFailed("Your browser doesn't allow clipboard access!");
     }
   }
   createElementForExecCommand(textToClipboard) {
@@ -48317,9 +48508,16 @@ var D2Reader = class {
     const mainElement = findRequiredElement(document, "#D2Reader-Container");
     const headerMenu = findElement(document, "#headerMenu");
     const footerMenu = findElement(document, "#footerMenu");
-    const webPubManifestUrl = initialConfig.url;
+    let webPubManifestUrl = initialConfig.url;
+    let publication;
+    if (initialConfig.publication) {
+      publication = TaJsonDeserialize(initialConfig.publication, Publication);
+      publication.manifestUrl = new URL(webPubManifestUrl);
+    } else {
+      publication = await Publication.fromUrl(webPubManifestUrl, initialConfig.requestConfig);
+    }
     const store = new LocalStorageStore({
-      prefix: webPubManifestUrl.href,
+      prefix: publication.manifestUrl,
       useLocalStorage: initialConfig.useLocalStorage ?? false
     });
     const settingsStore = new LocalStorageStore({
@@ -48331,18 +48529,16 @@ var D2Reader = class {
       useLocalStorage: initialConfig.useLocalStorage ?? false
     });
     const annotator = new LocalAnnotator({ store });
-    const upLink = initialConfig.upLinkUrl ?? void 0;
-    const publication = await Publication.fromUrl(webPubManifestUrl);
     publication.sample = initialConfig.sample;
     rights = updateConfig(rights, publication);
     if (rights.autoGeneratePositions) {
-      await publication.autoGeneratePositions();
+      await publication.autoGeneratePositions(initialConfig.requestConfig);
     } else {
       if (initialConfig.services?.positions) {
-        await publication.fetchPositionsFromService(initialConfig.services?.positions.href);
+        await publication.fetchPositionsFromService(initialConfig.services?.positions.href, initialConfig.requestConfig);
       }
       if (initialConfig.services?.weight) {
-        await publication.fetchWeightsFromService(initialConfig.services?.weight.href);
+        await publication.fetchWeightsFromService(initialConfig.services?.weight.href, initialConfig.requestConfig);
       }
     }
     const layers = await LayerSettings.create({ store: layerStore });
@@ -48350,7 +48546,6 @@ var D2Reader = class {
       store: settingsStore,
       initialUserSettings: initialConfig.userSettings,
       headerMenu,
-      material: initialConfig.material,
       api: initialConfig.api,
       injectables: (publication.Metadata.Rendition?.Layout ?? "unknown") === "fixed" ? initialConfig.injectablesFixed : initialConfig.injectables,
       layout: (publication.Metadata.Rendition?.Layout ?? "unknown") === "fixed" ? "fixed" : "reflowable"
@@ -48362,14 +48557,13 @@ var D2Reader = class {
       publication,
       settings,
       annotator,
-      upLink,
       initialLastReadingPosition: initialConfig.lastReadingPosition,
-      material: initialConfig.material,
       api: initialConfig.api,
       rights,
       tts: initialConfig.tts,
       sample: initialConfig.sample,
-      injectables: (publication.Metadata.Rendition?.Layout ?? "unknown") === "fixed" ? initialConfig.injectablesFixed : initialConfig.injectables,
+      requestConfig: initialConfig.requestConfig,
+      injectables: (publication.Metadata.Rendition?.Layout ?? "unknown") === "fixed" ? initialConfig.injectablesFixed ?? [] : initialConfig.injectables,
       attributes: initialConfig.attributes,
       services: initialConfig.services
     });