@dr33m/react-native-readium 5.0.0-rc.21 → 5.0.0-rc.23

package/android/src/main/java/com/reactnativereadium/reader/BaseReaderFragment.kt

@@ -274,26 +274,33 @@ abstract class BaseReaderFragment : Fragment() {
   fun ttsSkipPrevious() { ttsManager?.skipPrevious() }
 
   private fun applyTTSDecoration(locator: Locator) {
-    // Route through the public applyDecorations so the "tts" group is registered
-    // via addDecorationListener before the first applyDecorations call — Readium
-    // silently ignores decorations for groups that have no registered listener.
-    applyDecorations(
-      mapOf(
-        "tts" to listOf(
+    if (!isNavigatorReady) return
+    val decorableNavigator = navigator as? DecorableNavigator ?: return
+    // applyDecorations is suspend in Readium 3.x — must be called from a coroutine.
+    // viewLifecycleOwner.lifecycleScope dispatches to Dispatchers.Main, matching
+    // the observeWhenStarted pattern used by the Readium test app.
+    viewLifecycleOwner.lifecycleScope.launch {
+      decorableNavigator.applyDecorations(
+        listOf(
           Decoration(
-            id = "tts-current",
+            id = "tts",
             locator = locator,
             style = Decoration.Style.Highlight(
               tint = android.graphics.Color.argb(89, 0xF2, 0xCA, 0x50) // #f2ca50 @ 35%
             )
           )
-        )
+        ),
+        "tts"
       )
-    )
+    }
   }
 
   private fun clearTTSDecoration() {
-    applyDecorations(mapOf("tts" to emptyList()))
+    if (!isNavigatorReady) return
+    val decorableNavigator = navigator as? DecorableNavigator ?: return
+    viewLifecycleOwner.lifecycleScope.launch {
+      decorableNavigator.applyDecorations(emptyList(), "tts")
+    }
   }
 
   override fun onDestroyView() {

package/android/src/main/java/com/reactnativereadium/reader/TTSManager.kt

@@ -3,7 +3,9 @@ package com.reactnativereadium.reader
 import android.app.Application
 import kotlinx.coroutines.CoroutineScope
 import kotlinx.coroutines.Job
+import kotlinx.coroutines.flow.distinctUntilChanged
 import kotlinx.coroutines.flow.launchIn
+import kotlinx.coroutines.flow.map
 import kotlinx.coroutines.flow.onEach
 import kotlinx.coroutines.launch
 import org.readium.navigator.media.common.MediaNavigator
@@ -108,8 +110,14 @@ class TTSManager(
                 }
                 .launchIn(this)
 
-            // Observe current locator
-            ttsNavigator.currentLocator
+            // Observe utterance-level locator (sentence, not word).
+            // TtsNavigator.currentLocator returns tokenLocator ?: utteranceLocator — the
+            // word-level locator — which has incomplete CSS selectors and cannot be rendered
+            // by the EPUB decorator. utteranceLocator is the sentence-level locator and
+            // matches what the Readium test app (TtsViewModel.highlight) uses.
+            ttsNavigator.location
+                .map { it.utteranceLocator }
+                .distinctUntilChanged()
                 .onEach { locator ->
                     val text = locator.text.highlight ?: ""
                     onUtterance(locator, text)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dr33m/react-native-readium",
-  "version": "5.0.0-rc.21",
+  "version": "5.0.0-rc.23",
   "description": "A react-native wrapper for https://readium.org/",
   "main": "lib/src/index",
   "types": "lib/src/index.d.ts",