Merge pull request #199 from Gnathonic/develop

Release v1.5.7

Author: Gnathonic

CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [1.5.7] - 2026-03-20
+
+### Fixed
+
+- **Text box dismiss toggles overlay** - Tapping outside an OCR text box to dismiss it in continuous scroll modes no longer toggles the reader overlay
+- **Fullscreen leaves invisible menu** - Toggling fullscreen from settings no longer leaves an invisible drawer capturing taps
+
 ## [1.5.6] - 2026-03-20
 
 ### Fixed

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mokuro-reader",
-  "version": "1.5.6",
+  "version": "1.5.7",
   "private": true,
   "scripts": {
     "dev": "vite dev",

src/lib/components/Reader/HorizontalScrollReader.svelte

@@ -429,6 +429,7 @@
 
   let isDragging = false;
   let wasDrag = false;
+  let textBoxWasActive = false;
   let dragStartX = 0;
   let dragStartY = 0;
   let dragScrollLeft = 0;
@@ -458,7 +459,10 @@
   function handlePointerDown(e: PointerEvent) {
     activePointers.set(e.pointerId, { x: e.clientX, y: e.clientY });
 
-    if ((e.target as HTMLElement).closest('.textBox')) return;
+    if ((e.target as HTMLElement).closest('.textBox')) {
+      textBoxWasActive = true;
+      return;
+    }
 
     // TODO: Pinch zoom disabled — targeting causes position loss
     // if (activePointers.size === 2) {
@@ -548,9 +552,15 @@
   const DOUBLE_TAP_DELAY = 300;
 
   function handleClick(e: MouseEvent) {
-    if ((e.target as HTMLElement).closest('.textBox')) return;
+    if ((e.target as HTMLElement).closest('.textBox, button, [role="button"], a')) return;
     if (wasDrag) return;
 
+    // First tap outside after interacting with a text box dismisses it without toggling
+    if (textBoxWasActive) {
+      textBoxWasActive = false;
+      return;
+    }
+
     const now = Date.now();
     // TODO: Double-tap zoom disabled — targeting causes position loss
     // if (now - lastTapTime < DOUBLE_TAP_DELAY) {

src/lib/components/Reader/QuickActions.svelte

@@ -96,7 +96,10 @@
           </button>
         {/if}
         <button
-          onclick={toggleFullScreen}
+          onclick={() => {
+            toggleFullScreen();
+            open = false;
+          }}
           class="flex h-12 w-12 items-center justify-center rounded-full bg-gray-700 text-gray-300 shadow-lg hover:bg-gray-600 focus:outline-none dark:bg-gray-700 dark:text-gray-300 dark:hover:bg-gray-600"
           aria-label="Toggle fullscreen"
         >

src/lib/components/Reader/VerticalScrollReader.svelte

@@ -375,6 +375,7 @@
 
   let isDragging = false;
   let wasDrag = false;
+  let textBoxWasActive = false;
   let dragStartX = 0;
   let dragStartY = 0;
   let dragScrollLeft = 0;
@@ -404,7 +405,10 @@
   function handlePointerDown(e: PointerEvent) {
     activePointers.set(e.pointerId, { x: e.clientX, y: e.clientY });
 
-    if ((e.target as HTMLElement).closest('.textBox')) return;
+    if ((e.target as HTMLElement).closest('.textBox')) {
+      textBoxWasActive = true;
+      return;
+    }
 
     // TODO: Pinch zoom disabled — targeting causes position loss
     // if (activePointers.size === 2) {
@@ -496,9 +500,15 @@
   const DOUBLE_TAP_DELAY = 300;
 
   function handleClick(e: MouseEvent) {
-    if ((e.target as HTMLElement).closest('.textBox')) return;
+    if ((e.target as HTMLElement).closest('.textBox, button, [role="button"], a')) return;
     if (wasDrag) return;
 
+    // First tap outside after interacting with a text box dismisses it without toggling
+    if (textBoxWasActive) {
+      textBoxWasActive = false;
+      return;
+    }
+
     const now = Date.now();
     // TODO: Double-tap zoom disabled — targeting causes position loss
     // if (now - lastTapTime < DOUBLE_TAP_DELAY) {

src/lib/components/Settings/QuickAccess.svelte

@@ -11,6 +11,11 @@
 
   let { open = $bindable(false) }: Props = $props();
 
+  function onFullscreen() {
+    open = false;
+    toggleFullScreen();
+  }
+
   function onClose() {
     open = false;
     navigateBack();
@@ -19,7 +24,7 @@
 
 {#if isReader()}
   <div class="flex flex-col gap-2">
-    <Button color="alternative" onclick={toggleFullScreen}
+    <Button color="alternative" onclick={onFullscreen}
       >Toggle fullscreen <span class="ml-2 text-xs text-gray-500 dark:text-gray-400">(F)</span
       ></Button
     >