@creativeorange/azure-text-to-speech 3.0.0 → 3.0.2

package/dist/co-azure-tts.es.js

@@ -4,6 +4,193 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
+const DEFAULT_TOKEN_LIFETIME_MS = 8 * 60 * 1e3;
+function createSpeechAuthorizationProvider(options) {
+  var _a;
+  const hasTokenEndpoint = typeof options.tokenEndpoint === "string" && options.tokenEndpoint.trim() !== "";
+  const hasProvider = typeof options.getAuthorizationToken === "function";
+  if (hasTokenEndpoint && hasProvider) {
+    throw new Error(
+      "Provide either tokenEndpoint or getAuthorizationToken, not both."
+    );
+  }
+  if (!hasTokenEndpoint && !hasProvider) {
+    throw new Error(
+      "A tokenEndpoint or getAuthorizationToken provider is required."
+    );
+  }
+  if (hasProvider) {
+    return options.getAuthorizationToken;
+  }
+  const tokenEndpoint = options.tokenEndpoint.trim();
+  const requestOptions = (_a = options.tokenRequestOptions) != null ? _a : {};
+  return async () => {
+    var _a2, _b, _c;
+    let response;
+    try {
+      response = await fetch(tokenEndpoint, {
+        method: "GET",
+        cache: (_a2 = requestOptions.cache) != null ? _a2 : "no-store",
+        credentials: (_b = requestOptions.credentials) != null ? _b : "same-origin",
+        headers: {
+          Accept: "application/json",
+          ...(_c = requestOptions.headers) != null ? _c : {}
+        }
+      });
+    } catch {
+      throw createSafeError(
+        "Could not reach the speech token endpoint.",
+        "TOKEN_ENDPOINT_UNREACHABLE"
+      );
+    }
+    if (!response.ok) {
+      throw createSafeError(
+        `Speech token endpoint returned HTTP ${response.status}.`,
+        "TOKEN_ENDPOINT_HTTP_ERROR"
+      );
+    }
+    let payload;
+    try {
+      payload = await response.json();
+    } catch {
+      throw createSafeError(
+        "Speech token endpoint returned invalid JSON.",
+        "TOKEN_ENDPOINT_INVALID_JSON"
+      );
+    }
+    return validateSpeechAuthorization(payload);
+  };
+}
+function validateSpeechAuthorization(value) {
+  if (!value || typeof value !== "object") {
+    throw createSafeError(
+      "Speech authorization response must be an object.",
+      "TOKEN_INVALID_RESPONSE"
+    );
+  }
+  const candidate = value;
+  const token = typeof candidate.token === "string" ? candidate.token.trim() : "";
+  const region = typeof candidate.region === "string" ? candidate.region.trim() : "";
+  if (token === "") {
+    throw createSafeError(
+      "Speech authorization token is missing or empty.",
+      "TOKEN_EMPTY"
+    );
+  }
+  if (region === "") {
+    throw createSafeError(
+      "Speech authorization region is missing or empty.",
+      "TOKEN_REGION_MISSING"
+    );
+  }
+  return { token, region };
+}
+function createSafeError(message, code) {
+  const error = new Error(sanitizeErrorText(message));
+  error.message = sanitizeErrorText(message);
+  if (code) {
+    error.code = code;
+  }
+  return error;
+}
+function toSafeErrorDetail(error) {
+  if (typeof error === "string") {
+    const message = error.trim() !== "" ? sanitizeErrorText(error) : "An unexpected speech error occurred.";
+    return { message };
+  }
+  if (error && typeof error === "object") {
+    const candidate = error;
+    const rawMessage = [
+      typeof candidate.message === "string" ? candidate.message : "",
+      typeof candidate.errorDetails === "string" ? candidate.errorDetails : "",
+      typeof candidate.reason === "string" ? candidate.reason : ""
+    ].filter((part) => part.trim() !== "").join(" ");
+    const message = rawMessage !== "" ? sanitizeErrorText(rawMessage) : "An unexpected speech error occurred.";
+    const detail = { message };
+    if (typeof candidate.code === "string" && candidate.code.trim() !== "") {
+      detail.code = candidate.code;
+    } else if (typeof candidate.code === "number") {
+      detail.code = String(candidate.code);
+    }
+    return detail;
+  }
+  return {
+    message: "An unexpected speech error occurred."
+  };
+}
+function sanitizeErrorText(message) {
+  return message.replace(/Authorization\s*:\s*Bearer\s+\S+/gi, "Authorization: Bearer [redacted]").replace(/Bearer\s+\S+/gi, "Bearer [redacted]").replace(
+    /authorization[_-]?token["']?\s*[:=]\s*["']?[^"',\s}]+/gi,
+    "authorizationToken=[redacted]"
+  ).replace(
+    /access[_-]?token["']?\s*[:=]\s*["']?[^"',\s}]+/gi,
+    "accessToken=[redacted]"
+  ).replace(
+    /["']token["']\s*:\s*["'][^"']+["']/gi,
+    '"token":"[redacted]"'
+  ).replace(
+    /token["']?\s*[:=]\s*["']?[^"',\s}]+/gi,
+    "token=[redacted]"
+  );
+}
+function isLikelyAuthorizationError(error) {
+  var _a;
+  const detail = toSafeErrorDetail(error);
+  const haystack = `${detail.message} ${(_a = detail.code) != null ? _a : ""}`.toLowerCase();
+  return haystack.includes("unauthorized") || haystack.includes("authentication") || haystack.includes("authorization") || haystack.includes("invalid token") || haystack.includes("token expired") || haystack.includes("expired token") || haystack.includes("403") || haystack.includes("401") || detail.code === "TOKEN_REFRESH_ERROR";
+}
+class SpeechAuthorizationManager {
+  constructor(options) {
+    __publicField(this, "authorization");
+    __publicField(this, "authorizationExpiresAt", 0);
+    __publicField(this, "authorizationRequest");
+    __publicField(this, "provider");
+    __publicField(this, "tokenLifetimeMs");
+    this.provider = createSpeechAuthorizationProvider(options);
+    this.tokenLifetimeMs = options.tokenLifetimeMs && options.tokenLifetimeMs > 0 ? options.tokenLifetimeMs : DEFAULT_TOKEN_LIFETIME_MS;
+  }
+  getTokenLifetimeMs() {
+    return this.tokenLifetimeMs;
+  }
+  async getAuthorization() {
+    if (this.authorization && Date.now() < this.authorizationExpiresAt) {
+      return this.authorization;
+    }
+    if (this.authorizationRequest) {
+      return this.authorizationRequest;
+    }
+    this.authorizationRequest = this.fetchAuthorization().then((authorization) => {
+      this.authorization = authorization;
+      this.authorizationExpiresAt = Date.now() + this.tokenLifetimeMs;
+      return authorization;
+    }).finally(() => {
+      this.authorizationRequest = void 0;
+    });
+    return this.authorizationRequest;
+  }
+  async refreshAuthorization() {
+    this.authorization = void 0;
+    this.authorizationExpiresAt = 0;
+    if (this.authorizationRequest) {
+      return this.authorizationRequest;
+    }
+    return this.getAuthorization();
+  }
+  clearAuthorization() {
+    this.authorization = void 0;
+    this.authorizationExpiresAt = 0;
+  }
+  async fetchAuthorization() {
+    try {
+      const authorization = await this.provider();
+      return validateSpeechAuthorization(authorization);
+    } catch (error) {
+      this.clearAuthorization();
+      const detail = toSafeErrorDetail(error);
+      throw createSafeError(detail.message, detail.code);
+    }
+  }
+}
 var ws = {};
 var getRandomValues;
 var rnds8 = new Uint8Array(16);
@@ -1079,7 +1266,7 @@ class Timeout {
         throw new Error(message);
       }
     });
-    const clearTimeout = (timerId) => {
+    const clearTimeout2 = (timerId) => {
       const id = Math.random();
       unhandledRequests.set(id, timerId);
       scheduledTimeoutFunctions.set(timerId, id);
@@ -1104,7 +1291,7 @@ class Timeout {
       return timerId;
     };
     return {
-      clearTimeout,
+      clearTimeout: clearTimeout2,
       setTimeout: setTimeout2
     };
   }
@@ -8350,170 +8537,24 @@ class RestMessageAdapter {
     return Object.keys(params).map((k) => encodeURIComponent(k) + "=" + encodeURIComponent(params[k])).join("&");
   }
 }
-const DEFAULT_TOKEN_LIFETIME_MS = 8 * 60 * 1e3;
-function createSpeechAuthorizationProvider(options) {
-  var _a;
-  const hasTokenEndpoint = typeof options.tokenEndpoint === "string" && options.tokenEndpoint.trim() !== "";
-  const hasProvider = typeof options.getAuthorizationToken === "function";
-  if (hasTokenEndpoint && hasProvider) {
-    throw new Error(
-      "Provide either tokenEndpoint or getAuthorizationToken, not both."
-    );
-  }
-  if (!hasTokenEndpoint && !hasProvider) {
-    throw new Error(
-      "A tokenEndpoint or getAuthorizationToken provider is required."
-    );
-  }
-  if (hasProvider) {
-    return options.getAuthorizationToken;
-  }
-  const tokenEndpoint = options.tokenEndpoint.trim();
-  const requestOptions = (_a = options.tokenRequestOptions) != null ? _a : {};
-  return async () => {
-    var _a2, _b;
-    let response;
-    try {
-      response = await fetch(tokenEndpoint, {
-        method: "GET",
-        credentials: (_a2 = requestOptions.credentials) != null ? _a2 : "same-origin",
-        headers: {
-          Accept: "application/json",
-          ...(_b = requestOptions.headers) != null ? _b : {}
-        }
-      });
-    } catch {
-      throw createSafeError(
-        "Could not reach the speech token endpoint.",
-        "TOKEN_ENDPOINT_UNREACHABLE"
-      );
-    }
-    if (!response.ok) {
-      throw createSafeError(
-        `Speech token endpoint returned HTTP ${response.status}.`,
-        "TOKEN_ENDPOINT_HTTP_ERROR"
-      );
-    }
-    let payload;
-    try {
-      payload = await response.json();
-    } catch {
-      throw createSafeError(
-        "Speech token endpoint returned invalid JSON.",
-        "TOKEN_ENDPOINT_INVALID_JSON"
-      );
-    }
-    return validateSpeechAuthorization(payload);
-  };
-}
-function validateSpeechAuthorization(value) {
-  if (!value || typeof value !== "object") {
-    throw createSafeError(
-      "Speech authorization response must be an object.",
-      "TOKEN_INVALID_RESPONSE"
-    );
-  }
-  const candidate = value;
-  const token = typeof candidate.token === "string" ? candidate.token.trim() : "";
-  const region = typeof candidate.region === "string" ? candidate.region.trim() : "";
-  if (token === "") {
-    throw createSafeError(
-      "Speech authorization token is missing or empty.",
-      "TOKEN_EMPTY"
-    );
-  }
-  if (region === "") {
-    throw createSafeError(
-      "Speech authorization region is missing or empty.",
-      "TOKEN_REGION_MISSING"
-    );
-  }
-  return { token, region };
-}
-function createSafeError(message, code) {
-  const error = new Error(message);
-  error.message = message;
-  if (code) {
-    error.code = code;
-  }
-  return error;
-}
-function toSafeErrorDetail(error) {
-  if (error && typeof error === "object") {
-    const candidate = error;
-    const message = typeof candidate.message === "string" && candidate.message.trim() !== "" ? sanitizeErrorText(candidate.message) : "An unexpected speech error occurred.";
-    const detail = { message };
-    if (typeof candidate.code === "string" && candidate.code.trim() !== "") {
-      detail.code = candidate.code;
-    }
-    return detail;
-  }
-  return {
-    message: "An unexpected speech error occurred."
-  };
-}
-function sanitizeErrorText(message) {
-  return message.replace(/Bearer\s+\S+/gi, "Bearer [redacted]").replace(/token["']?\s*[:=]\s*["']?[^"',\s}]+/gi, "token=[redacted]");
-}
-class SpeechAuthorizationManager {
-  constructor(options) {
-    __publicField(this, "authorization");
-    __publicField(this, "authorizationExpiresAt", 0);
-    __publicField(this, "authorizationRequest");
-    __publicField(this, "provider");
-    __publicField(this, "tokenLifetimeMs");
-    this.provider = createSpeechAuthorizationProvider(options);
-    this.tokenLifetimeMs = options.tokenLifetimeMs && options.tokenLifetimeMs > 0 ? options.tokenLifetimeMs : DEFAULT_TOKEN_LIFETIME_MS;
-  }
-  async getAuthorization() {
-    if (this.authorization && Date.now() < this.authorizationExpiresAt) {
-      return this.authorization;
-    }
-    if (this.authorizationRequest) {
-      return this.authorizationRequest;
-    }
-    this.authorizationRequest = this.fetchAuthorization().then((authorization) => {
-      this.authorization = authorization;
-      this.authorizationExpiresAt = Date.now() + this.tokenLifetimeMs;
-      return authorization;
-    }).finally(() => {
-      this.authorizationRequest = void 0;
-    });
-    return this.authorizationRequest;
-  }
-  clearAuthorization() {
-    this.authorization = void 0;
-    this.authorizationExpiresAt = 0;
-    this.authorizationRequest = void 0;
-  }
-  async fetchAuthorization() {
-    try {
-      const authorization = await this.provider();
-      return validateSpeechAuthorization(authorization);
-    } catch (error) {
-      this.clearAuthorization();
-      throw createSafeError(
-        toSafeErrorDetail(error).message,
-        error == null ? void 0 : error.code
-      );
-    }
-  }
-}
 class SpeechToText {
   constructor(options) {
-    __publicField(this, "region");
+    __publicField(this, "region", "");
     __publicField(this, "sourceLanguage");
     __publicField(this, "targetLanguage");
     __publicField(this, "recognizer");
     __publicField(this, "authorizationManager");
-    var _a, _b, _c;
+    __publicField(this, "authorizationRefreshIntervalMs");
+    __publicField(this, "authorizationRefreshTimer");
+    __publicField(this, "stopPromise");
+    var _a;
     if (!options || typeof options.sourceLanguage !== "string" || options.sourceLanguage.trim() === "") {
       throw new Error("A sourceLanguage is required.");
     }
     this.authorizationManager = new SpeechAuthorizationManager(options);
-    this.region = (_b = (_a = options.region) == null ? void 0 : _a.trim()) != null ? _b : "";
+    this.authorizationRefreshIntervalMs = options.tokenLifetimeMs && options.tokenLifetimeMs > 0 ? options.tokenLifetimeMs : DEFAULT_TOKEN_LIFETIME_MS;
     this.sourceLanguage = options.sourceLanguage;
-    this.targetLanguage = (_c = options.targetLanguage) != null ? _c : options.sourceLanguage;
+    this.targetLanguage = (_a = options.targetLanguage) != null ? _a : options.sourceLanguage;
   }
   async start() {
     await this.registerBindings(document);
@@ -8527,9 +8568,15 @@ class SpeechToText {
       const currentNode = nodes[i];
       if (currentNode.attributes) {
         if (currentNode.attributes.getNamedItem("co-stt.start")) {
-          await this.handleStartModifier(currentNode, currentNode.attributes.getNamedItem("co-stt.start"));
+          await this.handleStartModifier(
+            currentNode,
+            currentNode.attributes.getNamedItem("co-stt.start")
+          );
         } else if (currentNode.attributes.getNamedItem("co-stt.stop")) {
-          await this.handleStopModifier(currentNode, currentNode.attributes.getNamedItem("co-stt.stop"));
+          await this.handleStopModifier(
+            currentNode,
+            currentNode.attributes.getNamedItem("co-stt.stop")
+          );
         }
       }
       if (currentNode.childNodes.length > 0) {
@@ -8553,12 +8600,13 @@ class SpeechToText {
   async handleStartModifier(node, attr) {
     node.addEventListener("click", async (_) => {
       try {
+        await this.stop();
         const speechConfig = await this.createSpeechTranslationConfig();
         const audioConfig = AudioConfig.fromDefaultMicrophoneInput();
         this.recognizer = new TranslationRecognizer(speechConfig, audioConfig);
         document.dispatchEvent(new CustomEvent("COAzureSTTStartedRecording", {}));
-        const prevResults = [];
-        this.recognizer.recognizing = (sender, event) => {
+        const prevResults = {};
+        this.recognizer.recognizing = (_sender, event) => {
           const result = event.result;
           if (result && result.reason === ResultReason.TranslatingSpeech) {
             const translation = result.translations.get(this.targetLanguage);
@@ -8576,36 +8624,105 @@ class SpeechToText {
         };
         this.recognizer.startContinuousRecognitionAsync(
           () => {
+            this.scheduleAuthorizationRefresh();
           },
           (err) => {
+            if (isLikelyAuthorizationError(err)) {
+              this.authorizationManager.clearAuthorization();
+            }
             this.dispatchError(err, "RECOGNITION_ERROR");
-            this.stop();
+            void this.stop();
           }
         );
       } catch (error) {
+        this.clearAuthorizationRefreshTimer();
+        if (isLikelyAuthorizationError(error)) {
+          this.authorizationManager.clearAuthorization();
+        }
         this.dispatchError(error);
         await this.stop();
       }
     });
   }
-  async handleStopModifier(node, attr) {
+  async handleStopModifier(node, _attr) {
     node.addEventListener("click", async (_) => {
       await this.stop();
     });
   }
   async stop() {
-    if (this.recognizer !== void 0) {
+    if (this.stopPromise) {
+      return this.stopPromise;
+    }
+    this.clearAuthorizationRefreshTimer();
+    const recognizer = this.recognizer;
+    if (!recognizer) {
+      return;
+    }
+    this.recognizer = void 0;
+    this.stopPromise = this.stopRecognizer(recognizer).finally(() => {
+      this.stopPromise = void 0;
+      document.dispatchEvent(
+        new CustomEvent("COAzureSTTStoppedRecording", {})
+      );
+    });
+    return this.stopPromise;
+  }
+  scheduleAuthorizationRefresh() {
+    this.clearAuthorizationRefreshTimer();
+    this.authorizationRefreshTimer = setTimeout(async () => {
+      if (!this.recognizer) {
+        return;
+      }
       try {
-        this.recognizer.stopContinuousRecognitionAsync();
-      } catch {
+        const authorization = await this.authorizationManager.refreshAuthorization();
+        if (!this.recognizer) {
+          return;
+        }
+        this.recognizer.authorizationToken = authorization.token;
+        this.region = authorization.region;
+        this.scheduleAuthorizationRefresh();
+      } catch (error) {
+        this.dispatchError(error, "TOKEN_REFRESH_ERROR");
+        await this.stop();
       }
+    }, this.authorizationRefreshIntervalMs);
+  }
+  clearAuthorizationRefreshTimer() {
+    if (!this.authorizationRefreshTimer) {
+      return;
+    }
+    clearTimeout(this.authorizationRefreshTimer);
+    this.authorizationRefreshTimer = void 0;
+  }
+  stopRecognizer(recognizer) {
+    return new Promise((resolve) => {
+      let closed = false;
+      const closeOnce = () => {
+        if (closed) {
+          resolve();
+          return;
+        }
+        closed = true;
+        try {
+          recognizer.close();
+        } catch {
+        } finally {
+          resolve();
+        }
+      };
       try {
-        this.recognizer.close();
+        recognizer.stopContinuousRecognitionAsync(
+          () => {
+            closeOnce();
+          },
+          () => {
+            closeOnce();
+          }
+        );
       } catch {
+        closeOnce();
       }
-      this.recognizer = void 0;
-    }
-    document.dispatchEvent(new CustomEvent("COAzureSTTStoppedRecording", {}));
+    });
   }
   dispatchError(error, code) {
     const detail = toSafeErrorDetail(error);
@@ -8621,9 +8738,27 @@ class SpeechToText {
     );
   }
 }
+const PUNCTUATION_MARKS = [
+  ".",
+  ",",
+  "!",
+  "?",
+  "*",
+  "(",
+  ")",
+  "&",
+  "\\",
+  "/",
+  "^",
+  "[",
+  "]",
+  "<",
+  ">",
+  ":"
+];
 class TextToSpeech {
   constructor(options) {
-    __publicField(this, "region");
+    __publicField(this, "region", "");
     __publicField(this, "voice");
     __publicField(this, "rate");
     __publicField(this, "pitch");
@@ -8636,8 +8771,6 @@ class TextToSpeech {
     __publicField(this, "player");
     __publicField(this, "synthesizer");
     __publicField(this, "previousWordBoundary");
-    __publicField(this, "interval");
-    __publicField(this, "wordEncounters", []);
     __publicField(this, "originalHighlightDivInnerHTML", "");
     __publicField(this, "currentWord", "");
     __publicField(this, "currentOffset", 0);
@@ -8650,16 +8783,18 @@ class TextToSpeech {
     __publicField(this, "activePrefetchedAudioUrl", "");
     __publicField(this, "playbackSegments", []);
     __publicField(this, "authorizationManager");
-    var _a, _b, _c, _d, _e;
+    __publicField(this, "stopPromise");
+    __publicField(this, "playbackSessionId", 0);
+    __publicField(this, "highlightInterval");
+    var _a, _b, _c;
     if (!options || typeof options.voice !== "string" || options.voice.trim() === "") {
       throw new Error("A voice is required.");
     }
     this.authorizationManager = new SpeechAuthorizationManager(options);
-    this.region = (_b = (_a = options.region) == null ? void 0 : _a.trim()) != null ? _b : "";
     this.voice = options.voice;
-    this.rate = (_c = options.rate) != null ? _c : 0;
-    this.pitch = (_d = options.pitch) != null ? _d : 0;
-    this.url = (_e = options.url) != null ? _e : "";
+    this.rate = (_a = options.rate) != null ? _a : 0;
+    this.pitch = (_b = options.pitch) != null ? _b : 0;
+    this.url = (_c = options.url) != null ? _c : "";
   }
   async start() {
     await this.registerBindings(document);
@@ -8688,17 +8823,35 @@ class TextToSpeech {
       const currentNode = nodes[i];
       if (currentNode.attributes) {
         if (currentNode.attributes.getNamedItem("co-tts.id")) {
-          await this.handleIdModifier(currentNode, currentNode.attributes.getNamedItem("co-tts.id"));
+          await this.handleIdModifier(
+            currentNode,
+            currentNode.attributes.getNamedItem("co-tts.id")
+          );
         } else if (currentNode.attributes.getNamedItem("co-tts.ajax")) {
-          await this.handleAjaxModifier(currentNode, currentNode.attributes.getNamedItem("co-tts.ajax"));
+          await this.handleAjaxModifier(
+            currentNode,
+            currentNode.attributes.getNamedItem("co-tts.ajax")
+          );
         } else if (currentNode.attributes.getNamedItem("co-tts")) {
-          await this.handleDefault(currentNode, currentNode.attributes.getNamedItem("co-tts"));
+          await this.handleDefault(
+            currentNode,
+            currentNode.attributes.getNamedItem("co-tts")
+          );
         } else if (currentNode.attributes.getNamedItem("co-tts.stop")) {
-          await this.handleStopModifier(currentNode, currentNode.attributes.getNamedItem("co-tts.stop"));
+          await this.handleStopModifier(
+            currentNode,
+            currentNode.attributes.getNamedItem("co-tts.stop")
+          );
         } else if (currentNode.attributes.getNamedItem("co-tts.resume")) {
-          await this.handleResumeModifier(currentNode, currentNode.attributes.getNamedItem("co-tts.resume"));
+          await this.handleResumeModifier(
+            currentNode,
+            currentNode.attributes.getNamedItem("co-tts.resume")
+          );
         } else if (currentNode.attributes.getNamedItem("co-tts.pause")) {
-          await this.handlePauseModifier(currentNode, currentNode.attributes.getNamedItem("co-tts.pause"));
+          await this.handlePauseModifier(
+            currentNode,
+            currentNode.attributes.getNamedItem("co-tts.pause")
+          );
         }
       }
       if (currentNode.childNodes.length > 0) {
@@ -8708,9 +8861,8 @@ class TextToSpeech {
   }
   async handleIdModifier(node, attr) {
     node.addEventListener("click", async (_) => {
-      var _a, _b, _c, _d;
-      this.stopPlayer();
-      await this.createInterval();
+      var _a, _b, _c;
+      await this.stopPlayer();
       const referenceDiv = document.getElementById(attr.value);
       this.clickedNode = referenceDiv;
       if (!referenceDiv) {
@@ -8721,49 +8873,30 @@ class TextToSpeech {
       } else {
         this.textToRead = (_c = (_b = referenceDiv.innerText) != null ? _b : referenceDiv.textContent) != null ? _c : "";
       }
-      if (referenceDiv.hasAttribute("co-tts.highlight")) {
-        if (((_d = referenceDiv.attributes.getNamedItem("co-tts.highlight")) == null ? void 0 : _d.value) !== "") {
-          const newReferenceDiv = document.getElementById(referenceDiv.attributes.getNamedItem("co-tts.highlight").value);
-          this.highlightDiv = newReferenceDiv;
-          this.originalHighlightDivInnerHTML = newReferenceDiv.innerHTML;
-        } else {
-          this.highlightDiv = referenceDiv;
-          this.originalHighlightDivInnerHTML = referenceDiv.innerHTML;
-        }
-      }
+      this.setHighlightTargetFromNode(referenceDiv);
       await this.startSynthesizer(node, attr);
     });
   }
   async handleAjaxModifier(node, attr) {
     node.addEventListener("click", async (_) => {
-      this.stopPlayer();
-      await this.createInterval();
+      await this.stopPlayer();
       this.clickedNode = node;
       const response = await fetch(attr.value, {
         method: `GET`
       });
       this.textToRead = await response.text();
+      this.setHighlightTargetFromNode(node);
       await this.startSynthesizer(node, attr);
     });
   }
   async handleDefault(node, attr) {
     node.addEventListener("click", async (_) => {
-      var _a, _b, _c;
-      this.stopPlayer();
-      await this.createInterval();
+      var _a, _b;
+      await this.stopPlayer();
       this.clickedNode = node;
-      if (node.hasAttribute("co-tts.highlight")) {
-        if (((_a = node.attributes.getNamedItem("co-tts.highlight")) == null ? void 0 : _a.value) !== "") {
-          const newReferenceDiv = document.getElementById(node.attributes.getNamedItem("co-tts.highlight").value);
-          this.highlightDiv = newReferenceDiv;
-          this.originalHighlightDivInnerHTML = newReferenceDiv.innerHTML;
-        } else {
-          this.highlightDiv = node;
-          this.originalHighlightDivInnerHTML = node.innerHTML;
-        }
-      }
+      this.setHighlightTargetFromNode(node);
       if (attr.value === "") {
-        this.textToRead = (_c = (_b = node.innerText) != null ? _b : node.textContent) != null ? _c : "";
+        this.textToRead = (_b = (_a = node.innerText) != null ? _a : node.textContent) != null ? _b : "";
       } else {
         this.textToRead = attr.value;
       }
@@ -8771,75 +8904,102 @@ class TextToSpeech {
     });
   }
   async handleWithoutClick(node, attr) {
-    var _a, _b, _c;
-    this.stopPlayer();
-    await this.createInterval();
+    var _a, _b;
+    await this.stopPlayer();
     this.clickedNode = node;
-    if (node.hasAttribute("co-tts.highlight")) {
-      if (((_a = node.attributes.getNamedItem("co-tts.highlight")) == null ? void 0 : _a.value) !== "") {
-        const newReferenceDiv = document.getElementById(node.attributes.getNamedItem("co-tts.highlight").value);
-        this.highlightDiv = newReferenceDiv;
-        if (newReferenceDiv !== null) {
-          this.originalHighlightDivInnerHTML = newReferenceDiv.innerHTML;
-        }
-      } else {
-        this.highlightDiv = node;
-        this.originalHighlightDivInnerHTML = node.innerHTML;
-      }
-    }
+    this.setHighlightTargetFromNode(node);
     if (attr.value === "") {
-      this.textToRead = (_c = (_b = node.innerText) != null ? _b : node.textContent) != null ? _c : "";
+      this.textToRead = (_b = (_a = node.innerText) != null ? _a : node.textContent) != null ? _b : "";
     } else {
       this.textToRead = attr.value;
     }
     await this.startSynthesizer(node, attr);
   }
-  async handleStopModifier(node, attr) {
+  async handleStopModifier(node, _attr) {
     node.addEventListener("click", async (_) => {
       await this.stopPlayer();
       document.dispatchEvent(new CustomEvent("COAzureTTSStoppedPlaying", {}));
     });
   }
-  async handlePauseModifier(node, attr) {
+  async handlePauseModifier(node, _attr) {
     node.addEventListener("click", async (_) => {
-      await this.clearInterval();
+      if (!this.player || typeof this.player.pause !== "function") {
+        return;
+      }
+      this.stopHighlightingInterval();
       await this.player.pause();
       document.dispatchEvent(new CustomEvent("COAzureTTSPausedPlaying", {}));
     });
   }
-  async handleResumeModifier(node, attr) {
+  async handleResumeModifier(node, _attr) {
     node.addEventListener("click", async (_) => {
-      await this.createInterval();
-      await this.player.resume();
+      if (!this.player) {
+        return;
+      }
+      if (this.shouldHighlight()) {
+        this.startHighlightingInterval(this.playbackSessionId);
+      }
+      if (typeof this.player.resume === "function") {
+        await this.player.resume();
+      } else if (typeof this.player.play === "function") {
+        await this.player.play();
+      } else {
+        return;
+      }
       document.dispatchEvent(new CustomEvent("COAzureTTSResumedPlaying", {}));
     });
   }
   async stopPlayer() {
-    await this.clearInterval();
-    if (this.highlightDiv !== void 0) {
+    if (this.stopPromise) {
+      return this.stopPromise;
+    }
+    this.stopPromise = this.performStopPlayer().finally(() => {
+      this.stopPromise = void 0;
+    });
+    return this.stopPromise;
+  }
+  async performStopPlayer() {
+    this.invalidatePlaybackSession();
+    this.stopHighlightingInterval();
+    if (this.highlightDiv) {
       this.highlightDiv.innerHTML = this.originalHighlightDivInnerHTML;
     }
+    this.resetPlaybackSegments();
+    const player = this.player;
+    const activePrefetchedAudioUrl = this.activePrefetchedAudioUrl;
+    const synthesizer = this.synthesizer;
     this.textToRead = "";
     this.currentWord = "";
+    this.currentOffset = 0;
+    this.wordBoundaryOffset = 0;
     this.originalHighlightDivInnerHTML = "";
     this.wordBoundryList = [];
-    this.wordEncounters = [];
-    this.resetPlaybackSegments();
     this.playbackSegments = [];
-    if (this.player !== void 0) {
-      this.player.pause();
-    }
-    if (this.activePrefetchedAudioUrl !== "") {
-      URL.revokeObjectURL(this.activePrefetchedAudioUrl);
-      this.activePrefetchedAudioUrl = "";
-    }
-    this.closeSynthesizer();
-    this.player = void 0;
-    this.audioConfig = void 0;
-    this.speechConfig = void 0;
+    this.previousWordBoundary = void 0;
     this.highlightDiv = void 0;
     this.prevTextOffset = 0;
     this.playbackTextOffsetBase = void 0;
+    this.audioConfig = void 0;
+    this.speechConfig = void 0;
+    if (this.player === player) {
+      this.player = void 0;
+    }
+    if (this.activePrefetchedAudioUrl === activePrefetchedAudioUrl) {
+      this.activePrefetchedAudioUrl = "";
+    }
+    if (this.synthesizer === synthesizer) {
+      this.synthesizer = void 0;
+    }
+    if (player !== void 0 && typeof player.pause === "function") {
+      try {
+        player.pause();
+      } catch {
+      }
+    }
+    if (activePrefetchedAudioUrl !== "") {
+      URL.revokeObjectURL(activePrefetchedAudioUrl);
+    }
+    this.closeResource(synthesizer);
   }
   async createSpeechConfig() {
     const authorization = await this.authorizationManager.getAuthorization();
@@ -8852,13 +9012,21 @@ class TextToSpeech {
     this.region = authorization.region;
     return speechConfig;
   }
-  async startSynthesizer(node, attr) {
+  async startSynthesizer(_node, _attr) {
     try {
       this.speechConfig = await this.createSpeechConfig();
-      this.player = new SpeakerAudioDestination();
-      this.audioConfig = AudioConfig.fromSpeakerOutput(this.player);
-      this.synthesizer = new SpeechSynthesizer(this.speechConfig, this.audioConfig);
-      this.synthesizer.wordBoundary = (s, e) => {
+      const sessionId = this.createPlaybackSession();
+      this.resetHighlightState();
+      const player = new SpeakerAudioDestination();
+      const audioConfig = AudioConfig.fromSpeakerOutput(player);
+      const synthesizer = new SpeechSynthesizer(this.speechConfig, audioConfig);
+      this.player = player;
+      this.audioConfig = audioConfig;
+      this.synthesizer = synthesizer;
+      synthesizer.wordBoundary = (_s, e) => {
+        if (!this.isActivePlaybackSession(sessionId)) {
+          return;
+        }
         this.wordBoundryList.push(e);
       };
       const playbackChain = this.collectPlaybackChain(this.clickedNode);
@@ -8868,20 +9036,27 @@ class TextToSpeech {
       } else {
         this.playbackSegments = [];
       }
-      this.player.onAudioEnd = async () => {
+      player.onAudioEnd = async () => {
+        var _a;
+        if (!this.isActivePlaybackSession(sessionId)) {
+          return;
+        }
+        const clickedNode = this.clickedNode;
         const wasChainedPlayback = this.playbackSegments.length > 0;
-        this.stopPlayer();
+        const nextNodeId = ((_a = clickedNode == null ? void 0 : clickedNode.hasAttribute) == null ? void 0 : _a.call(clickedNode, "co-tts.next")) ? clickedNode.getAttribute("co-tts.next") : null;
+        await this.stopPlayer();
         if (wasChainedPlayback) {
           document.dispatchEvent(new CustomEvent("COAzureTTSFinishedPlaying", {}));
           return;
         }
-        if (this.clickedNode.hasAttribute("co-tts.next")) {
-          const nextNode = document.getElementById(this.clickedNode.getAttribute("co-tts.next"));
+        if (nextNodeId) {
+          const nextNode = document.getElementById(nextNodeId);
           if (nextNode && await this.playPrefetchedNode(nextNode)) {
             return;
           }
-          if (nextNode && nextNode.attributes.getNamedItem("co-tts.text")) {
-            this.handleWithoutClick(nextNode, nextNode.attributes.getNamedItem("co-tts.text"));
+          const nextTextAttr = nextNode == null ? void 0 : nextNode.attributes.getNamedItem("co-tts.text");
+          if (nextNode && nextTextAttr) {
+            await this.handleWithoutClick(nextNode, nextTextAttr);
           } else if (nextNode) {
             nextNode.dispatchEvent(new Event("click"));
           }
@@ -8889,24 +9064,46 @@ class TextToSpeech {
           document.dispatchEvent(new CustomEvent("COAzureTTSFinishedPlaying", {}));
         }
       };
-      this.player.onAudioStart = async () => {
+      player.onAudioStart = async () => {
+        if (!this.isActivePlaybackSession(sessionId)) {
+          return;
+        }
         document.dispatchEvent(new CustomEvent("COAzureTTSStartedPlaying", {}));
       };
+      if (this.shouldHighlight()) {
+        this.startHighlightingInterval(sessionId);
+      }
       if (!isChainedPlayback) {
-        this.prefetchNextNode(this.clickedNode);
+        void this.prefetchNextNode(this.clickedNode);
       }
-      this.synthesizer.speakSsmlAsync(
-        this.buildSSML(this.textToRead),
+      const ssml = this.buildSSML(this.textToRead);
+      synthesizer.speakSsmlAsync(
+        ssml,
         () => {
-          this.closeSynthesizer();
+          this.closeResource(synthesizer);
+          if (this.isActivePlaybackSession(sessionId) && this.synthesizer === synthesizer) {
+            this.synthesizer = void 0;
+          }
         },
         (error) => {
+          this.closeResource(synthesizer);
+          if (!this.isActivePlaybackSession(sessionId)) {
+            return;
+          }
+          if (this.synthesizer === synthesizer) {
+            this.synthesizer = void 0;
+          }
+          if (isLikelyAuthorizationError(error)) {
+            this.authorizationManager.clearAuthorization();
+          }
           this.dispatchError(error, "SYNTHESIS_ERROR");
-          this.closeSynthesizer();
-          this.stopPlayer();
+          void this.stopPlayer();
         }
       );
     } catch (error) {
+      if (isLikelyAuthorizationError(error)) {
+        this.authorizationManager.clearAuthorization();
+      }
       this.dispatchError(error);
       await this.stopPlayer();
     }
@@ -8946,21 +9143,16 @@ class TextToSpeech {
     this.textToRead = chain.map((segment) => segment.text).join(" ");
     this.highlightDiv = void 0;
     this.originalHighlightDivInnerHTML = "";
-    this.wordEncounters = [];
-    this.previousWordBoundary = void 0;
-    this.prevTextOffset = 0;
-    this.playbackTextOffsetBase = void 0;
-    this.currentWord = "";
-    this.currentOffset = 0;
-    this.wordBoundaryOffset = 0;
+    this.resetHighlightState();
   }
   getHighlightDivForNode(node) {
-    var _a;
-    if (!node.hasAttribute("co-tts.highlight")) {
+    var _a, _b, _c, _d;
+    if (!((_a = node == null ? void 0 : node.hasAttribute) == null ? void 0 : _a.call(node, "co-tts.highlight"))) {
       return void 0;
     }
-    if (((_a = node.attributes.getNamedItem("co-tts.highlight")) == null ? void 0 : _a.value) !== "") {
-      return document.getElementById(node.attributes.getNamedItem("co-tts.highlight").value);
+    const highlightTarget = (_c = (_b = node.attributes.getNamedItem("co-tts.highlight")) == null ? void 0 : _b.value) != null ? _c : "";
+    if (highlightTarget !== "") {
+      return (_d = document.getElementById(highlightTarget)) != null ? _d : void 0;
     }
     return node;
   }
@@ -8972,18 +9164,19 @@ class TextToSpeech {
     });
   }
   updateChainedHighlight(wordBoundary) {
-    var _a;
-    if (~[".", ",", "!", "?", "*", "(", ")", "&", "\\", "/", "^", "[", "]", "<", ">", ":"].indexOf(wordBoundary.text)) {
+    var _a, _b;
+    if (~PUNCTUATION_MARKS.indexOf(wordBoundary.text)) {
       wordBoundary = (_a = this.previousWordBoundary) != null ? _a : void 0;
     }
     if (!wordBoundary) {
       this.resetPlaybackSegments();
       return;
     }
-    if (this.playbackTextOffsetBase === void 0) {
-      this.playbackTextOffsetBase = wordBoundary.textOffset;
-    }
-    const normalizedTextOffset = Math.max(0, wordBoundary.textOffset - this.playbackTextOffsetBase);
+    this.ensurePlaybackTextOffsetBase();
+    const normalizedTextOffset = Math.max(
+      0,
+      wordBoundary.textOffset - ((_b = this.playbackTextOffsetBase) != null ? _b : 0)
+    );
     const segment = this.playbackSegments.find((candidate) => normalizedTextOffset >= candidate.start && normalizedTextOffset < candidate.end);
     this.resetPlaybackSegments();
     if (!(segment == null ? void 0 : segment.highlightDiv)) {
@@ -8991,17 +9184,12 @@ class TextToSpeech {
       return;
     }
     const relativeTextOffset = normalizedTextOffset - segment.start;
-    const currentOffset = this.getPosition(segment.originalHighlightDivInnerHTML, wordBoundary.text, relativeTextOffset);
-    if (currentOffset === Number.MAX_SAFE_INTEGER) {
-      this.previousWordBoundary = wordBoundary;
-      return;
-    }
-    const startOfString = segment.originalHighlightDivInnerHTML.substring(0, currentOffset);
-    const endOffset = currentOffset + wordBoundary.wordLength;
-    const endOfString = segment.originalHighlightDivInnerHTML.substring(endOffset);
-    segment.highlightDiv.innerHTML = `
-            ${startOfString}<mark class='co-tts-highlight'>${wordBoundary.text}</mark>${endOfString}
-        `;
+    this.highlightTextRange(
+      segment.highlightDiv,
+      segment.originalHighlightDivInnerHTML,
+      relativeTextOffset,
+      wordBoundary.wordLength
+    );
     this.previousWordBoundary = wordBoundary;
   }
   getNodeText(node, attr) {
@@ -9055,9 +9243,9 @@ class TextToSpeech {
     const prefetchPromise = (async () => {
       try {
         const speechConfig = await this.createSpeechConfig();
-        synthesizer = new SpeechSynthesizer(speechConfig, null);
+        synthesizer = new SpeechSynthesizer(speechConfig, void 0);
         const wordBoundryList = [];
-        synthesizer.wordBoundary = (s, e) => {
+        synthesizer.wordBoundary = (_s, e) => {
           wordBoundryList.push(e);
         };
         return await new Promise((resolve) => {
@@ -9085,6 +9273,9 @@ class TextToSpeech {
             (error) => {
               this.closeResource(synthesizer);
               synthesizer = void 0;
+              if (isLikelyAuthorizationError(error)) {
+                this.authorizationManager.clearAuthorization();
+              }
               this.dispatchError(error, "PREFETCH_ERROR");
               resolve(null);
             }
@@ -9093,6 +9284,9 @@ class TextToSpeech {
       } catch (error) {
         this.closeResource(synthesizer);
         synthesizer = void 0;
+        if (isLikelyAuthorizationError(error)) {
+          this.authorizationManager.clearAuthorization();
+        }
         this.dispatchError(error);
         return null;
       }
@@ -9102,7 +9296,7 @@ class TextToSpeech {
     this.prefetchPromises.set(key, prefetchPromise);
   }
   async playPrefetchedNode(node) {
-    var _a, _b, _c;
+    var _a, _b;
     const attr = (_a = node.attributes.getNamedItem("co-tts.text")) != null ? _a : node.attributes.getNamedItem("co-tts");
     const text = this.getNodeText(node, attr);
     const key = this.getPrefetchKey(node, text);
@@ -9111,44 +9305,39 @@ class TextToSpeech {
       return false;
     }
     this.prefetchedAudio.delete(key);
+    const sessionId = this.createPlaybackSession();
+    this.resetHighlightState();
     this.clickedNode = node;
     this.textToRead = prefetch.text;
     this.wordBoundryList = prefetch.wordBoundryList;
-    this.wordEncounters = [];
-    this.previousWordBoundary = void 0;
-    this.prevTextOffset = 0;
-    this.currentWord = "";
-    this.currentOffset = 0;
-    this.wordBoundaryOffset = 0;
-    if (node.hasAttribute("co-tts.highlight")) {
-      if (((_c = node.attributes.getNamedItem("co-tts.highlight")) == null ? void 0 : _c.value) !== "") {
-        const newReferenceDiv = document.getElementById(node.attributes.getNamedItem("co-tts.highlight").value);
-        this.highlightDiv = newReferenceDiv;
-        if (newReferenceDiv !== null) {
-          this.originalHighlightDivInnerHTML = newReferenceDiv.innerHTML;
-        }
-      } else {
-        this.highlightDiv = node;
-        this.originalHighlightDivInnerHTML = node.innerHTML;
-      }
-    }
-    await this.createInterval();
+    this.playbackSegments = [];
+    this.setHighlightTargetFromNode(node);
     try {
       const audio = new Audio(prefetch.url);
       this.activePrefetchedAudioUrl = prefetch.url;
       this.player = audio;
       audio.addEventListener("play", () => {
+        if (!this.isActivePlaybackSession(sessionId)) {
+          return;
+        }
         document.dispatchEvent(new CustomEvent("COAzureTTSStartedPlaying", {}));
       }, { once: true });
       audio.addEventListener("ended", async () => {
-        this.stopPlayer();
-        if (this.clickedNode.hasAttribute("co-tts.next")) {
-          const nextNode = document.getElementById(this.clickedNode.getAttribute("co-tts.next"));
+        var _a2;
+        if (!this.isActivePlaybackSession(sessionId)) {
+          return;
+        }
+        const clickedNode = this.clickedNode;
+        const nextNodeId = ((_a2 = clickedNode == null ? void 0 : clickedNode.hasAttribute) == null ? void 0 : _a2.call(clickedNode, "co-tts.next")) ? clickedNode.getAttribute("co-tts.next") : null;
+        await this.stopPlayer();
+        if (nextNodeId) {
+          const nextNode = document.getElementById(nextNodeId);
           if (nextNode && await this.playPrefetchedNode(nextNode)) {
             return;
           }
-          if (nextNode && nextNode.attributes.getNamedItem("co-tts.text")) {
-            this.handleWithoutClick(nextNode, nextNode.attributes.getNamedItem("co-tts.text"));
+          const nextTextAttr = nextNode == null ? void 0 : nextNode.attributes.getNamedItem("co-tts.text");
+          if (nextNode && nextTextAttr) {
+            await this.handleWithoutClick(nextNode, nextTextAttr);
           } else if (nextNode) {
             nextNode.dispatchEvent(new Event("click"));
           }
@@ -9157,101 +9346,186 @@ class TextToSpeech {
         }
       }, { once: true });
       audio.addEventListener("error", () => {
+        if (!this.isActivePlaybackSession(sessionId)) {
+          return;
+        }
         this.dispatchError(
           new Error("Prefetched audio resource closed unexpectedly."),
           "AUDIO_RESOURCE_ERROR"
         );
-        this.stopPlayer();
+        void this.stopPlayer();
       }, { once: true });
-      this.prefetchNextNode(node);
+      if (this.shouldHighlight()) {
+        this.startHighlightingInterval(sessionId);
+      }
+      void this.prefetchNextNode(node);
       await audio.play();
       return true;
     } catch (error) {
+      this.stopHighlightingInterval();
       this.dispatchError(error, "AUDIO_RESOURCE_ERROR");
       await this.stopPlayer();
       return false;
     }
   }
-  async clearInterval() {
-    clearInterval(this.interval);
+  createPlaybackSession() {
+    this.playbackSessionId += 1;
+    return this.playbackSessionId;
   }
-  async createInterval() {
-    this.interval = setInterval(() => {
-      var _a;
-      if (this.player !== void 0 && (this.highlightDiv || this.playbackSegments.length > 0)) {
-        const currentTime = this.player.currentTime;
-        let wordBoundary;
-        for (const e of this.wordBoundryList) {
-          if (currentTime * 1e3 > e.audioOffset / 1e4) {
-            wordBoundary = e;
-          } else {
-            break;
-          }
-        }
-        if (wordBoundary !== void 0) {
-          if (this.playbackSegments.length > 0) {
-            this.updateChainedHighlight(wordBoundary);
-            return;
-          }
-          if (~[".", ",", "!", "?", "*", "(", ")", "&", "\\", "/", "^", "[", "]", "<", ">", ":"].indexOf(wordBoundary.text)) {
-            wordBoundary = (_a = this.previousWordBoundary) != null ? _a : void 0;
-          }
-          if (wordBoundary === void 0 || this.prevTextOffset > wordBoundary.prevTextOffset) {
-            this.highlightDiv.innerHTML = this.originalHighlightDivInnerHTML;
-          } else {
-            if (!this.wordEncounters[wordBoundary.text]) {
-              this.wordEncounters[wordBoundary.text] = 0;
-            }
-            this.prevTextOffset = wordBoundary.prevTextOffset;
-            if (this.currentWord !== wordBoundary.text || this.wordBoundaryOffset !== wordBoundary.textOffset) {
-              this.currentOffset = this.getPosition(
-                this.originalHighlightDivInnerHTML,
-                wordBoundary.text,
-                wordBoundary.textOffset
-              );
-              this.wordEncounters[wordBoundary.text] = this.currentOffset + wordBoundary.wordLength;
-              this.currentWord = wordBoundary.text;
-              this.wordBoundaryOffset = wordBoundary.textOffset;
-            }
-            if (this.currentOffset === Number.MAX_SAFE_INTEGER) {
-              this.highlightDiv.innerHTML = this.originalHighlightDivInnerHTML;
-            } else {
-              this.previousWordBoundary = wordBoundary;
-              const startOfString = this.originalHighlightDivInnerHTML.substring(0, this.currentOffset);
-              const endOffset = this.currentOffset + wordBoundary.wordLength;
-              const endOfString = this.originalHighlightDivInnerHTML.substring(endOffset);
-              this.highlightDiv.innerHTML = `
-                                ${startOfString}<mark class='co-tts-highlight'>${wordBoundary.text}</mark>${endOfString}
-                            `;
-            }
-          }
-        } else if (this.playbackSegments.length > 0) {
-          this.resetPlaybackSegments();
-        } else {
-          this.highlightDiv.innerHTML = this.originalHighlightDivInnerHTML;
-        }
+  isActivePlaybackSession(sessionId) {
+    return sessionId === this.playbackSessionId;
+  }
+  invalidatePlaybackSession() {
+    this.playbackSessionId += 1;
+  }
+  stopHighlightingInterval() {
+    if (!this.highlightInterval) {
+      return;
+    }
+    clearInterval(this.highlightInterval);
+    this.highlightInterval = void 0;
+  }
+  startHighlightingInterval(sessionId) {
+    this.stopHighlightingInterval();
+    this.highlightInterval = setInterval(() => {
+      if (!this.isActivePlaybackSession(sessionId)) {
+        this.stopHighlightingInterval();
+        return;
       }
+      this.updateHighlightForCurrentTime(sessionId);
     }, 50);
   }
-  getPosition(string, subString, textOffset) {
-    let visibleOffset = 0;
-    let insideTag = false;
-    for (let htmlOffset = 0; htmlOffset < string.length; htmlOffset++) {
-      const character = string[htmlOffset];
-      if (character === "<") {
-        insideTag = true;
-      }
-      if (!insideTag) {
-        if (visibleOffset === textOffset) {
-          return htmlOffset;
-        }
-        visibleOffset++;
+  updateHighlightForCurrentTime(sessionId) {
+    var _a, _b;
+    if (!this.isActivePlaybackSession(sessionId) || this.player === void 0) {
+      return;
+    }
+    if (!this.shouldHighlight()) {
+      return;
+    }
+    const currentTime = this.player.currentTime;
+    let wordBoundary;
+    for (const e of this.wordBoundryList) {
+      if (currentTime * 1e3 > e.audioOffset / 1e4) {
+        wordBoundary = e;
+      } else {
+        break;
       }
-      if (character === ">") {
-        insideTag = false;
+    }
+    if (wordBoundary === void 0) {
+      this.resetCurrentHighlight();
+      return;
+    }
+    if (this.playbackSegments.length > 0) {
+      this.updateChainedHighlight(wordBoundary);
+      return;
+    }
+    if (~PUNCTUATION_MARKS.indexOf(wordBoundary.text)) {
+      wordBoundary = (_a = this.previousWordBoundary) != null ? _a : void 0;
+    }
+    if (wordBoundary === void 0 || this.prevTextOffset > wordBoundary.textOffset) {
+      this.resetCurrentHighlight();
+      return;
+    }
+    this.prevTextOffset = wordBoundary.textOffset;
+    this.ensurePlaybackTextOffsetBase();
+    const normalizedTextOffset = Math.max(
+      0,
+      wordBoundary.textOffset - ((_b = this.playbackTextOffsetBase) != null ? _b : 0)
+    );
+    this.highlightTextRange(
+      this.highlightDiv,
+      this.originalHighlightDivInnerHTML,
+      normalizedTextOffset,
+      wordBoundary.wordLength
+    );
+    this.previousWordBoundary = wordBoundary;
+    this.currentWord = wordBoundary.text;
+    this.wordBoundaryOffset = wordBoundary.textOffset;
+  }
+  highlightTextRange(target, originalHtml, textOffset, wordLength) {
+    if (!target || wordLength <= 0) {
+      return;
+    }
+    target.innerHTML = originalHtml;
+    const walker = document.createTreeWalker(
+      target,
+      NodeFilter.SHOW_TEXT
+    );
+    let currentOffset = 0;
+    let startNode;
+    let endNode;
+    let startOffset = 0;
+    let endOffset = 0;
+    const requestedEnd = textOffset + wordLength;
+    while (walker.nextNode()) {
+      const node = walker.currentNode;
+      const nodeLength = node.data.length;
+      const nodeStart = currentOffset;
+      const nodeEnd = currentOffset + nodeLength;
+      if (!startNode && textOffset >= nodeStart && textOffset < nodeEnd) {
+        startNode = node;
+        startOffset = textOffset - nodeStart;
+      }
+      if (requestedEnd > nodeStart && requestedEnd <= nodeEnd) {
+        endNode = node;
+        endOffset = requestedEnd - nodeStart;
+        break;
       }
+      currentOffset = nodeEnd;
+    }
+    if (!startNode || !endNode) {
+      return;
+    }
+    const range = document.createRange();
+    try {
+      range.setStart(startNode, startOffset);
+      range.setEnd(endNode, endOffset);
+      const mark = document.createElement("mark");
+      mark.className = "co-tts-highlight";
+      mark.appendChild(range.extractContents());
+      range.insertNode(mark);
+    } catch {
+      target.innerHTML = originalHtml;
+    }
+  }
+  setHighlightTargetFromNode(node) {
+    var _a;
+    const highlightDiv = this.getHighlightDivForNode(node);
+    this.highlightDiv = highlightDiv;
+    this.originalHighlightDivInnerHTML = (_a = highlightDiv == null ? void 0 : highlightDiv.innerHTML) != null ? _a : "";
+  }
+  shouldHighlight() {
+    if (this.highlightDiv) {
+      return true;
+    }
+    return this.playbackSegments.some((segment) => Boolean(segment.highlightDiv));
+  }
+  resetHighlightState() {
+    this.prevTextOffset = 0;
+    this.previousWordBoundary = void 0;
+    this.currentWord = "";
+    this.currentOffset = 0;
+    this.wordBoundaryOffset = 0;
+    this.playbackTextOffsetBase = void 0;
+  }
+  ensurePlaybackTextOffsetBase() {
+    if (this.playbackTextOffsetBase !== void 0 || this.wordBoundryList.length === 0) {
+      return;
+    }
+    this.playbackTextOffsetBase = this.wordBoundryList.reduce(
+      (minimum, boundary) => Math.min(minimum, boundary.textOffset),
+      this.wordBoundryList[0].textOffset
+    );
+  }
+  resetCurrentHighlight() {
+    if (this.playbackSegments.length > 0) {
+      this.resetPlaybackSegments();
+      return;
+    }
+    if (this.highlightDiv) {
+      this.highlightDiv.innerHTML = this.originalHighlightDivInnerHTML;
     }
-    return string.indexOf(subString);
   }
   buildSSML(text) {
     let ssml = `<speak xmlns="http://www.w3.org/2001/10/synthesis" 
@@ -9273,10 +9547,6 @@ class TextToSpeech {
     p.textContent = input;
     return p.innerHTML;
   }
-  closeSynthesizer() {
-    this.closeResource(this.synthesizer);
-    this.synthesizer = void 0;
-  }
   closeResource(resource) {
     if (!resource || typeof resource.close !== "function") {
       return;
@@ -9300,4 +9570,4 @@ class TextToSpeech {
     );
   }
 }
-export { SpeechToText, TextToSpeech };
+export { DEFAULT_TOKEN_LIFETIME_MS, SpeechAuthorizationManager, SpeechToText, TextToSpeech, createSpeechAuthorizationProvider, isLikelyAuthorizationError, sanitizeErrorText, toSafeErrorDetail, validateSpeechAuthorization };