claude-remote-cli 2.2.1 → 2.2.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-remote-cli",
-  "version": "2.2.1",
+  "version": "2.2.2",
   "description": "Remote web interface for Claude Code CLI sessions",
   "type": "module",
   "main": "dist/server/index.js",

package/public/app.js

@@ -1356,6 +1356,22 @@
     if (e.key === 'Enter') addRootBtn.click();
   });
 
+  var settingsDevtools = document.getElementById('settings-devtools');
+
+  // Initialize developer tools toggle from localStorage
+  var devtoolsEnabled = localStorage.getItem('devtools-enabled') === 'true';
+  settingsDevtools.checked = devtoolsEnabled;
+
+  settingsDevtools.addEventListener('change', function () {
+    devtoolsEnabled = settingsDevtools.checked;
+    localStorage.setItem('devtools-enabled', devtoolsEnabled ? 'true' : 'false');
+    // Update debug toggle visibility immediately
+    var debugToggle = document.getElementById('debug-toggle');
+    if (debugToggle) {
+      debugToggle.style.display = devtoolsEnabled ? '' : 'none';
+    }
+  });
+
   settingsClose.addEventListener('click', function () {
     settingsDialog.close();
     loadRepos();
@@ -1565,6 +1581,10 @@
     debugToggle.id = 'debug-toggle';
     debugToggle.textContent = 'dbg';
     debugToggle.style.cssText = 'position:fixed;bottom:60px;right:8px;z-index:10000;background:#333;color:#0f0;border:1px solid #0f0;border-radius:6px;font:12px monospace;padding:6px 10px;opacity:0.5;min-width:44px;min-height:44px;';
+    // Hide debug toggle unless developer tools are enabled in settings
+    if (localStorage.getItem('devtools-enabled') !== 'true') {
+      debugToggle.style.display = 'none';
+    }
     document.body.appendChild(debugToggle);
 
     var debugVisible = false;
@@ -1724,6 +1744,24 @@
     mobileInput.flushComposedText = flushComposedText;
     mobileInput.clearInput = clearInput;
 
+    // ── Form submit handler for reliable Enter on mobile ──
+    // On Android Chrome with Gboard, keydown fires with key="Unidentified" and
+    // keyCode=229 during active composition/prediction (which is nearly always).
+    // Wrapping the input in a <form> ensures the browser fires a "submit" event
+    // when Enter is pressed, regardless of composition state.
+    var inputForm = document.getElementById('mobile-input-form');
+    if (inputForm) {
+      inputForm.addEventListener('submit', function (e) {
+        e.preventDefault();
+        dbg('FORM_SUBMIT composing=' + isComposing + ' val="' + mobileInput.value + '"');
+        if (!ws || ws.readyState !== WebSocket.OPEN) return;
+        flushComposedText();
+        ws.send('\r');
+        mobileInput.value = '';
+        lastInputValue = '';
+      });
+    }
+
     // Handle text input with autocorrect
     var clearTimer = null;
     mobileInput.addEventListener('beforeinput', function (e) {

package/public/index.html

@@ -70,7 +70,9 @@
         <button id="menu-btn" class="icon-btn" aria-label="Open sessions menu">&#9776;</button>
         <span id="session-title" class="mobile-title">No session</span>
       </div>
-      <input type="text" id="mobile-input" dir="ltr" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" aria-label="Terminal input" />
+      <form id="mobile-input-form" action="javascript:void(0)">
+        <input type="text" id="mobile-input" dir="ltr" autocomplete="off" enterkeyhint="send" aria-label="Terminal input" />
+      </form>
       <div id="terminal-container"></div>
       <div id="terminal-scrollbar"><div id="terminal-scrollbar-thumb"></div></div>
       <div id="no-session-msg">No active session. Create or select a session to begin.</div>
@@ -182,6 +184,13 @@
         <button id="add-root-btn" class="btn-accent">Add</button>
       </div>
     </div>
+    <div class="settings-section">
+      <label class="settings-label">Developer</label>
+      <label class="settings-checkbox">
+        <input type="checkbox" id="settings-devtools" />
+        <span>Show developer tools button</span>
+      </label>
+    </div>
     <div class="dialog-actions">
       <button id="settings-close">Done</button>
     </div>

package/public/style.css

@@ -931,6 +931,26 @@ dialog#settings-dialog h2 {
   margin-bottom: 1rem;
 }
 
+.settings-checkbox {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 0.85rem;
+  color: var(--text);
+  cursor: pointer;
+}
+
+.settings-checkbox input[type="checkbox"] {
+  width: 18px;
+  height: 18px;
+  accent-color: var(--accent);
+  cursor: pointer;
+}
+
+#mobile-input-form {
+  display: contents;
+}
+
 .btn-accent {
   background: var(--accent) !important;
   border-color: var(--accent) !important;