zerg-ztc 0.1.7 → 0.1.11

package/src/components/InputArea.tsx

@@ -9,6 +9,25 @@ import chalk from 'chalk';
 import { saveClipboardImage } from '../utils/clipboard_image.js';
 import { renderImagePreview } from '../utils/image_preview.js';
 import { completePath } from '../utils/path_complete.js';
+import {
+  isRecording as isLegacyRecording,
+  startRecording as startLegacyRecording,
+  stopRecordingAndTranscribe as stopLegacyRecording,
+  cancelRecording as cancelLegacyRecording,
+  isDictationAvailable as isLegacyDictationAvailable
+} from '../utils/dictation.js';
+import {
+  isNativeDictationAvailable,
+  isNativeRecording,
+  startNativeRecording,
+  stopNativeRecording,
+  cancelNativeRecording
+} from '../utils/dictation_native.js';
+
+// Use native dictation if available, otherwise fall back to legacy
+const useNative = isNativeDictationAvailable();
+const isRecording = () => useNative ? isNativeRecording() : isLegacyRecording();
+const isDictationAvailable = () => useNative ? true : isLegacyDictationAvailable();
 import {
   createEmptyState,
   insertText,
@@ -25,6 +44,30 @@ import {
   PASTE_BADGE_THRESHOLD
 } from '../ui/core/input_segments.js';
 
+// Helper to check for Ctrl key combinations
+// Handles multiple formats:
+// 1. Ink's key.ctrl + letter
+// 2. Traditional control characters (\x01 for Ctrl+A, etc.)
+// 3. Kitty keyboard protocol: [<keycode>;5u where keycode is ASCII, 5 = Ctrl
+function isCtrl(input: string, key: InputKey, letter: string): boolean {
+  const lowerLetter = letter.toLowerCase();
+
+  // Method 1: Ink's key.ctrl flag
+  if (key.ctrl && input === lowerLetter) return true;
+
+  // Method 2: Traditional control character (Ctrl+A = \x01, etc.)
+  const ctrlCode = lowerLetter.charCodeAt(0) - 96; // 'a' -> 1, 'b' -> 2, etc.
+  if (input === String.fromCharCode(ctrlCode)) return true;
+
+  // Method 3: Kitty keyboard protocol [<keycode>;5u (fallback, main handling is in handleKittyInput)
+  // keycode is ASCII code of the letter, 5 = Ctrl modifier
+  const asciiCode = lowerLetter.charCodeAt(0); // 'a' -> 97, 'r' -> 114, etc.
+  const kittyPattern = `[${asciiCode};5u`;
+  if (input === kittyPattern || input === `\x1b${kittyPattern}`) return true;
+
+  return false;
+}
+
 interface InputAreaProps {
   onSubmit: (text: string) => void;
   onCommand?: (command: string, args: string[]) => void;
@@ -35,6 +78,7 @@ interface InputAreaProps {
   }>;
   onStateChange?: (state: InputState) => void;
   onToast?: (message: string) => void;
+  onDictationStateChange?: (state: 'idle' | 'recording' | 'transcribing') => void;
   cols?: number;
   inputBus?: InputBus;
   disabled?: boolean;
@@ -108,6 +152,7 @@ export const InputArea: React.FC<InputAreaProps> = ({
   commands = [],
   onStateChange,
   onToast,
+  onDictationStateChange,
   cols = process.stdout.columns || 80,
   inputBus,
   disabled = false,
@@ -121,6 +166,7 @@ export const InputArea: React.FC<InputAreaProps> = ({
   const [badgePreview, setBadgePreview] = React.useState<string[] | null>(null);
   const killRingRef = React.useRef<string[]>([]);
   const killIndexRef = React.useRef<number>(-1);
+  const dictationBusyRef = React.useRef<boolean>(false);
 
   // Bracketed paste mode support - buffer paste content between \x1b[200~ and \x1b[201~
   const pasteBufferRef = React.useRef<string>('');
@@ -494,6 +540,168 @@ export const InputArea: React.FC<InputAreaProps> = ({
   // Update ref so handleSubmit can access it
   handleClipboardImagePasteRef.current = handleClipboardImagePaste;
 
+  // Handle Kitty keyboard protocol sequences directly
+  // This is called when we detect a Kitty sequence in handleInput
+  const handleKittyInput = useCallback((char: string, key: InputKey, keycode: number, modifier: number) => {
+    if (disabled) return;
+
+    const isKittyCtrl = modifier === 5;
+    const isKittyMeta = modifier === 9;
+    const lowerChar = char.toLowerCase();
+
+    // Navigation
+    if (isKittyCtrl && lowerChar === 'a') {
+      dispatch({ type: 'apply', state: { cursor: { index: 0, offset: 0 } } });
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'e') {
+      dispatch({ type: 'apply', state: { cursor: { index: state.segments.length, offset: 0 } } });
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'b') {
+      dispatch({ type: 'apply', state: moveLeft(state) });
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'f') {
+      dispatch({ type: 'apply', state: moveRight(state) });
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'p') {
+      navigateHistory('up');
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'n') {
+      navigateHistory('down');
+      return;
+    }
+
+    // Kill/yank
+    if (isKittyCtrl && lowerChar === 'u') {
+      const { next, killed } = killToStart(state);
+      pushKill(killed);
+      dispatch({ type: 'apply', state: next });
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'k') {
+      const { next, killed } = killToEnd(state);
+      pushKill(killed);
+      dispatch({ type: 'apply', state: next });
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'y') {
+      dispatch({ type: 'apply', state: yank(state) });
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'w') {
+      const { next, killed } = killWordBackward(state);
+      pushKill(killed);
+      dispatch({ type: 'apply', state: next });
+      return;
+    }
+
+    // Transpose
+    if (isKittyCtrl && lowerChar === 't') {
+      dispatch({ type: 'apply', state: transposeChars(state) });
+      return;
+    }
+
+    // Delete forward
+    if (isKittyCtrl && lowerChar === 'd') {
+      dispatch({ type: 'apply', state: deleteForward(state) });
+      return;
+    }
+
+    // Push-to-talk: Ctrl+R to toggle recording
+    if (isKittyCtrl && lowerChar === 'r') {
+      if (dictationBusyRef.current) return;
+
+      if (isRecording()) {
+        // Stop recording and transcribe
+        dictationBusyRef.current = true;
+        onDictationStateChange?.('transcribing');
+
+        if (useNative) {
+          stopNativeRecording()
+            .then((text) => {
+              if (text && text.trim()) {
+                // Submit the transcribed text directly
+                onSubmit(text.trim());
+              } else {
+                onToast?.('No speech detected');
+              }
+            })
+            .catch((err) => {
+              onToast?.(`Dictation error: ${err.message}`);
+            })
+            .finally(() => {
+              dictationBusyRef.current = false;
+              onDictationStateChange?.('idle');
+            });
+        } else {
+          stopLegacyRecording()
+            .then((result) => {
+              if (result.text && result.text.trim()) {
+                // Submit the transcribed text directly
+                onSubmit(result.text.trim());
+              } else {
+                onToast?.('No speech detected');
+              }
+            })
+            .catch((err) => {
+              onToast?.(`Dictation error: ${err.message}`);
+            })
+            .finally(() => {
+              dictationBusyRef.current = false;
+              onDictationStateChange?.('idle');
+            });
+        }
+      } else {
+        // Start recording
+        if (!isDictationAvailable()) {
+          onToast?.('Dictation not available. Build native/ztc-audio or install sox');
+          return;
+        }
+        try {
+          if (useNative) {
+            startNativeRecording({ model: 'tiny' });
+          } else {
+            startLegacyRecording();
+          }
+          onDictationStateChange?.('recording');
+        } catch (err) {
+          onToast?.(`Recording error: ${err instanceof Error ? err.message : 'Unknown'}`);
+        }
+      }
+      return;
+    }
+
+    // Meta key combinations
+    if (isKittyMeta && lowerChar === 'y') {
+      dispatch({ type: 'apply', state: yankPop(state) });
+      return;
+    }
+    if (isKittyMeta && lowerChar === 't') {
+      dispatch({ type: 'apply', state: transposeWords(state) });
+      return;
+    }
+    if (isKittyMeta && lowerChar === 'd') {
+      const { next, killed } = killWordForward(state);
+      pushKill(killed);
+      dispatch({ type: 'apply', state: next });
+      return;
+    }
+    if (isKittyMeta && lowerChar === 'b') {
+      dispatch({ type: 'apply', state: moveWordLeft(state) });
+      return;
+    }
+    if (isKittyMeta && lowerChar === 'f') {
+      dispatch({ type: 'apply', state: moveWordRight(state) });
+      return;
+    }
+
+    // Unknown Kitty sequence - don't insert as text
+  }, [disabled, killToEnd, killToStart, killWordBackward, killWordForward, navigateHistory, onDictationStateChange, onToast, pushKill, state, transposeChars, transposeWords, yank, yankPop]);
+
   const handleInput = useCallback((input: string, key: InputKey) => {
     // Detect Kitty keyboard protocol CSI u sequences
     // Format: ESC [ <keycode> ; <modifiers> u
@@ -507,23 +715,36 @@ export const InputArea: React.FC<InputAreaProps> = ({
       return;
     }
 
-    // Consume any other Kitty sequences to prevent them from being displayed
-    // Match pattern: ESC? [ number ; number u
-    if (/\x1b?\[\d+;\d+u/.test(input)) {
-      // This is a Kitty keyboard sequence - don't display it as text
-      // Extract what key it is and handle accordingly
-      const match = input.match(/\x1b?\[(\d+);(\d+)u/);
-      if (match) {
-        const keycode = parseInt(match[1], 10);
-        const modifier = parseInt(match[2], 10);
-        // Ctrl+C (99;5) or Cmd+C (99;9) - exit the app
-        if (keycode === 99 && (modifier === 5 || modifier === 9)) {
-          exit();
-          return;
-        }
-        // Ctrl+L (108;5) - could add clear screen here if needed
+    // Handle Kitty keyboard protocol sequences
+    // Format: ESC? [ keycode ; modifier u
+    // Modifier 5 = Ctrl, modifier 9 = Cmd/Super
+    const kittyMatch = input.match(/\x1b?\[(\d+);(\d+)u/);
+    if (kittyMatch) {
+      const keycode = parseInt(kittyMatch[1], 10);
+      const modifier = parseInt(kittyMatch[2], 10);
+      const isKittyCtrl = modifier === 5;
+      const isKittyMeta = modifier === 9;
+
+      // Ctrl+C (99;5) or Cmd+C (99;9) - exit the app
+      if (keycode === 99 && (isKittyCtrl || isKittyMeta)) {
+        exit();
+        return;
       }
-      return; // Consume other Kitty sequences
+
+      // Synthesize key flags for Kitty sequences so downstream handlers work
+      const kittyKey: InputKey = {
+        ...key,
+        ctrl: isKittyCtrl || key.ctrl,
+        meta: isKittyMeta || key.meta,
+      };
+      // Convert keycode to character for isCtrl checks
+      const kittyChar = String.fromCharCode(keycode);
+
+      // Route to handlers based on keycode
+      // Let the normal handler flow process this with synthesized key flags
+      // by falling through with modified key/input
+      handleKittyInput(kittyChar, kittyKey, keycode, modifier);
+      return;
     }
 
     if (disabled) return;
@@ -683,27 +904,27 @@ export const InputArea: React.FC<InputAreaProps> = ({
       return;
     }
 
-    if (key.ctrl && input === 'a') {
+    if (isCtrl(input, key, 'a')) {
       dispatch({ type: 'apply', state: { cursor: { index: 0, offset: 0 } } });
       return;
     }
-    if (key.ctrl && input === 'e') {
+    if (isCtrl(input, key, 'e')) {
       dispatch({ type: 'apply', state: { cursor: { index: state.segments.length, offset: 0 } } });
       return;
     }
-    if (key.ctrl && input === 'b') {
+    if (isCtrl(input, key, 'b')) {
       dispatch({ type: 'apply', state: moveLeft(state) });
       return;
     }
-    if (key.ctrl && input === 'f') {
+    if (isCtrl(input, key, 'f')) {
       dispatch({ type: 'apply', state: moveRight(state) });
       return;
     }
-    if (key.ctrl && input === 'p') {
+    if (isCtrl(input, key, 'p')) {
       navigateHistory('up');
       return;
     }
-    if (key.ctrl && input === 'n') {
+    if (isCtrl(input, key, 'n')) {
       navigateHistory('down');
       return;
     }
@@ -715,19 +936,19 @@ export const InputArea: React.FC<InputAreaProps> = ({
       return;
     }
 
-    if (key.ctrl && input === 'u') {
+    if (isCtrl(input, key, 'u')) {
       const { next, killed } = killToStart(state);
       pushKill(killed);
       dispatch({ type: 'apply', state: next });
       return;
     }
-    if (key.ctrl && input === 'k') {
+    if (isCtrl(input, key, 'k')) {
       const { next, killed } = killToEnd(state);
       pushKill(killed);
       dispatch({ type: 'apply', state: next });
       return;
     }
-    if (key.ctrl && input === 'y') {
+    if (isCtrl(input, key, 'y')) {
       dispatch({ type: 'apply', state: yank(state) });
       return;
     }
@@ -735,7 +956,70 @@ export const InputArea: React.FC<InputAreaProps> = ({
       dispatch({ type: 'apply', state: yankPop(state) });
       return;
     }
-    if (key.ctrl && input === 't') {
+    // Push-to-talk: Ctrl+R to toggle recording
+    if (isCtrl(input, key, 'r')) {
+      if (dictationBusyRef.current) return;
+
+      if (isRecording()) {
+        // Stop recording and transcribe
+        dictationBusyRef.current = true;
+        onDictationStateChange?.('transcribing');
+
+        if (useNative) {
+          stopNativeRecording()
+            .then((text) => {
+              if (text && text.trim()) {
+                // Submit the transcribed text directly
+                onSubmit(text.trim());
+              } else {
+                onToast?.('No speech detected');
+              }
+            })
+            .catch((err) => {
+              onToast?.(`Dictation error: ${err.message}`);
+            })
+            .finally(() => {
+              dictationBusyRef.current = false;
+              onDictationStateChange?.('idle');
+            });
+        } else {
+          stopLegacyRecording()
+            .then((result) => {
+              if (result.text && result.text.trim()) {
+                // Submit the transcribed text directly
+                onSubmit(result.text.trim());
+              } else {
+                onToast?.('No speech detected');
+              }
+            })
+            .catch((err) => {
+              onToast?.(`Dictation error: ${err.message}`);
+            })
+            .finally(() => {
+              dictationBusyRef.current = false;
+              onDictationStateChange?.('idle');
+            });
+        }
+      } else {
+        // Start recording
+        if (!isDictationAvailable()) {
+          onToast?.('Dictation not available. Build native/ztc-audio or install sox');
+          return;
+        }
+        try {
+          if (useNative) {
+            startNativeRecording({ model: 'tiny' });
+          } else {
+            startLegacyRecording();
+          }
+          onDictationStateChange?.('recording');
+        } catch (err) {
+          onToast?.(`Recording error: ${err instanceof Error ? err.message : 'Unknown'}`);
+        }
+      }
+      return;
+    }
+    if (isCtrl(input, key, 't')) {
       dispatch({ type: 'apply', state: transposeChars(state) });
       return;
     }
@@ -743,12 +1027,12 @@ export const InputArea: React.FC<InputAreaProps> = ({
       dispatch({ type: 'apply', state: transposeWords(state) });
       return;
     }
-    if (key.ctrl && input === 'd') {
+    if (isCtrl(input, key, 'd')) {
       dispatch({ type: 'apply', state: deleteForward(state) });
       return;
     }
 
-    if (key.ctrl && input === 'w') {
+    if (isCtrl(input, key, 'w')) {
       const { next, killed } = killWordBackward(state);
       pushKill(killed);
       dispatch({ type: 'apply', state: next });
@@ -787,10 +1071,225 @@ export const InputArea: React.FC<InputAreaProps> = ({
       const next = insertText(state, input);
       dispatch({ type: 'apply', state: { ...next, historyIdx: -1 } });
     }
-  }, [disabled, exit, handleClipboardImagePaste, handleSubmit, navigateHistory, state]);
+  }, [disabled, exit, handleClipboardImagePaste, handleKittyInput, handleSubmit, navigateHistory, state]);
+
+  // Handle Kitty keyboard protocol sequences for overlay mode
+  const handleKittyOverlayInput = useCallback((char: string, key: InputKey, keycode: number, modifier: number) => {
+    if (disabled) return;
+
+    const current = overlayStateRef.current;
+    const isKittyCtrl = modifier === 5;
+    const isKittyMeta = modifier === 9;
+    const lowerChar = char.toLowerCase();
+
+    // Navigation
+    if (isKittyCtrl && lowerChar === 'a') {
+      overlayStateRef.current = { ...current, cursor: { index: 0, offset: 0 } };
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'e') {
+      overlayStateRef.current = { ...current, cursor: { index: current.segments.length, offset: 0 } };
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'b') {
+      overlayStateRef.current = moveLeft(current);
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'f') {
+      overlayStateRef.current = moveRight(current);
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'p') {
+      if (historyEnabled && current.history.length > 0) {
+        const newIdx = current.historyIdx === -1 ? current.history.length - 1 : Math.max(0, current.historyIdx - 1);
+        const historyValue = current.history[newIdx] || '';
+        overlayStateRef.current = {
+          ...current,
+          historyIdx: newIdx,
+          segments: historyValue.length > 0 ? [{ type: 'text', text: historyValue }] : [],
+          cursor: { index: historyValue.length > 0 ? 0 : 0, offset: historyValue.length }
+        };
+        renderOverlay(overlayStateRef.current);
+      }
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'n') {
+      if (historyEnabled && current.history.length > 0) {
+        let newIdx = current.historyIdx === -1 ? -1 : current.historyIdx + 1;
+        if (newIdx >= current.history.length) newIdx = -1;
+        if (newIdx === -1) {
+          overlayStateRef.current = { ...createEmptyState(), history: current.history, historyIdx: -1 };
+        } else {
+          const historyValue = current.history[newIdx];
+          overlayStateRef.current = {
+            ...current,
+            historyIdx: newIdx,
+            segments: historyValue.length > 0 ? [{ type: 'text', text: historyValue }] : [],
+            cursor: { index: historyValue.length > 0 ? 0 : 0, offset: historyValue.length }
+          };
+        }
+        renderOverlay(overlayStateRef.current);
+      }
+      return;
+    }
+
+    // Kill/yank
+    if (isKittyCtrl && lowerChar === 'u') {
+      const { next, killed } = killToStart(current);
+      pushKill(killed);
+      overlayStateRef.current = { ...next, history: current.history, historyIdx: -1 };
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'k') {
+      const { next, killed } = killToEnd(current);
+      pushKill(killed);
+      overlayStateRef.current = next;
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'y') {
+      overlayStateRef.current = yank(current);
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+    if (isKittyCtrl && lowerChar === 'w') {
+      const { next, killed } = killWordBackward(current);
+      pushKill(killed);
+      overlayStateRef.current = next;
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+
+    // Transpose
+    if (isKittyCtrl && lowerChar === 't') {
+      overlayStateRef.current = transposeChars(current);
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+
+    // Delete forward
+    if (isKittyCtrl && lowerChar === 'd') {
+      overlayStateRef.current = deleteForward(current);
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+
+    // Push-to-talk: Ctrl+R to toggle recording
+    if (isKittyCtrl && lowerChar === 'r') {
+      if (dictationBusyRef.current) return;
+
+      if (isRecording()) {
+        dictationBusyRef.current = true;
+        onDictationStateChange?.('transcribing');
+
+        if (useNative) {
+          stopNativeRecording()
+            .then((text) => {
+              if (text && text.trim()) {
+                // Submit the transcribed text directly
+                onSubmit(text.trim());
+                overlayStateRef.current = { ...overlayStateRef.current, segments: [], cursor: { index: 0, offset: 0 }, historyIdx: -1 };
+                renderOverlay(overlayStateRef.current);
+              } else {
+                onToast?.('No speech detected');
+              }
+            })
+            .catch((err) => {
+              onToast?.(`Dictation error: ${err.message}`);
+            })
+            .finally(() => {
+              dictationBusyRef.current = false;
+              onDictationStateChange?.('idle');
+            });
+        } else {
+          stopLegacyRecording()
+            .then((result) => {
+              if (result.text && result.text.trim()) {
+                // Submit the transcribed text directly
+                onSubmit(result.text.trim());
+                overlayStateRef.current = { ...overlayStateRef.current, segments: [], cursor: { index: 0, offset: 0 }, historyIdx: -1 };
+                renderOverlay(overlayStateRef.current);
+              } else {
+                onToast?.('No speech detected');
+              }
+            })
+            .catch((err) => {
+              onToast?.(`Dictation error: ${err.message}`);
+            })
+            .finally(() => {
+              dictationBusyRef.current = false;
+              onDictationStateChange?.('idle');
+            });
+        }
+      } else {
+        if (!isDictationAvailable()) {
+          onToast?.('Dictation not available. Build native/ztc-audio or install sox');
+          return;
+        }
+        try {
+          if (useNative) {
+            startNativeRecording({ model: 'tiny' });
+          } else {
+            startLegacyRecording();
+          }
+          onDictationStateChange?.('recording');
+        } catch (err) {
+          onToast?.(`Recording error: ${err instanceof Error ? err.message : 'Unknown'}`);
+        }
+      }
+      return;
+    }
+
+    // Meta key combinations
+    if (isKittyMeta && lowerChar === 'y') {
+      overlayStateRef.current = yankPop(current);
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+    if (isKittyMeta && lowerChar === 't') {
+      overlayStateRef.current = transposeWords(current);
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+    if (isKittyMeta && lowerChar === 'd') {
+      const { next, killed } = killWordForward(current);
+      pushKill(killed);
+      overlayStateRef.current = next;
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+    if (isKittyMeta && lowerChar === 'b') {
+      overlayStateRef.current = moveWordLeft(current);
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+    if (isKittyMeta && lowerChar === 'f') {
+      overlayStateRef.current = moveWordRight(current);
+      renderOverlay(overlayStateRef.current);
+      return;
+    }
+
+    // Unknown Kitty sequence - don't insert as text
+  }, [disabled, historyEnabled, killToEnd, killToStart, killWordBackward, killWordForward, onDictationStateChange, onToast, pushKill, renderOverlay, transposeChars, transposeWords, yank, yankPop]);
 
   const handleOverlayInput = useCallback((input: string, key: InputKey) => {
     if (disabled) return;
+
+    // Handle Kitty keyboard protocol sequences for overlay mode
+    const kittyMatch = input.match(/\x1b?\[(\d+);(\d+)u/);
+    if (kittyMatch) {
+      const keycode = parseInt(kittyMatch[1], 10);
+      const modifier = parseInt(kittyMatch[2], 10);
+      const kittyChar = String.fromCharCode(keycode);
+      handleKittyOverlayInput(kittyChar, key, keycode, modifier);
+      return;
+    }
+
     // Detect backspace via explicit key flag or known control codes
     const backspaceFallback = input === '\b' || input === '\x7f' || input === '\x08';
     const isBackspace = key.backspace || key.delete || backspaceFallback;
@@ -903,28 +1402,28 @@ export const InputArea: React.FC<InputAreaProps> = ({
       return;
     }
 
-    if (key.ctrl && input === 'a') {
+    if (isCtrl(input, key, 'a')) {
       overlayStateRef.current = { ...current, cursor: { index: 0, offset: 0 } };
       renderOverlay(overlayStateRef.current);
       return;
     }
 
-    if (key.ctrl && input === 'e') {
+    if (isCtrl(input, key, 'e')) {
       overlayStateRef.current = { ...current, cursor: { index: current.segments.length, offset: 0 } };
       renderOverlay(overlayStateRef.current);
       return;
     }
-    if (key.ctrl && input === 'b') {
+    if (isCtrl(input, key, 'b')) {
       overlayStateRef.current = moveLeft(current);
       renderOverlay(overlayStateRef.current);
       return;
     }
-    if (key.ctrl && input === 'f') {
+    if (isCtrl(input, key, 'f')) {
       overlayStateRef.current = moveRight(current);
       renderOverlay(overlayStateRef.current);
       return;
     }
-    if (key.ctrl && input === 'p') {
+    if (isCtrl(input, key, 'p')) {
       const direction = 'up';
       if (historyEnabled && current.history.length > 0) {
         let newIdx = current.historyIdx === -1 ? current.history.length - 1 : Math.max(0, current.historyIdx - 1);
@@ -939,7 +1438,7 @@ export const InputArea: React.FC<InputAreaProps> = ({
       }
       return;
     }
-    if (key.ctrl && input === 'n') {
+    if (isCtrl(input, key, 'n')) {
       if (historyEnabled && current.history.length > 0) {
         let newIdx = current.historyIdx === -1 ? -1 : current.historyIdx + 1;
         if (newIdx >= current.history.length) newIdx = -1;
@@ -966,31 +1465,96 @@ export const InputArea: React.FC<InputAreaProps> = ({
       return;
     }
 
-    if (key.ctrl && input === 'u') {
+    if (isCtrl(input, key, 'u')) {
       const { next, killed } = killToStart(current);
       pushKill(killed);
       overlayStateRef.current = { ...next, history: current.history, historyIdx: -1 };
       renderOverlay(overlayStateRef.current);
       return;
     }
-    if (key.ctrl && input === 'k') {
+    if (isCtrl(input, key, 'k')) {
       const { next, killed } = killToEnd(current);
       pushKill(killed);
       overlayStateRef.current = next;
       renderOverlay(overlayStateRef.current);
       return;
     }
-    if (key.ctrl && input === 'y') {
+    if (isCtrl(input, key, 'y')) {
       overlayStateRef.current = yank(current);
       renderOverlay(overlayStateRef.current);
       return;
     }
+    // Push-to-talk: Ctrl+R to toggle recording (overlay mode)
+    if (isCtrl(input, key, 'r')) {
+      if (dictationBusyRef.current) return;
+
+      if (isRecording()) {
+        dictationBusyRef.current = true;
+        onDictationStateChange?.('transcribing');
+
+        if (useNative) {
+          stopNativeRecording()
+            .then((text) => {
+              if (text && text.trim()) {
+                // Submit the transcribed text directly
+                onSubmit(text.trim());
+                overlayStateRef.current = { ...overlayStateRef.current, segments: [], cursor: { index: 0, offset: 0 }, historyIdx: -1 };
+                renderOverlay(overlayStateRef.current);
+              } else {
+                onToast?.('No speech detected');
+              }
+            })
+            .catch((err) => {
+              onToast?.(`Dictation error: ${err.message}`);
+            })
+            .finally(() => {
+              dictationBusyRef.current = false;
+              onDictationStateChange?.('idle');
+            });
+        } else {
+          stopLegacyRecording()
+            .then((result) => {
+              if (result.text && result.text.trim()) {
+                // Submit the transcribed text directly
+                onSubmit(result.text.trim());
+                overlayStateRef.current = { ...overlayStateRef.current, segments: [], cursor: { index: 0, offset: 0 }, historyIdx: -1 };
+                renderOverlay(overlayStateRef.current);
+              } else {
+                onToast?.('No speech detected');
+              }
+            })
+            .catch((err) => {
+              onToast?.(`Dictation error: ${err.message}`);
+            })
+            .finally(() => {
+              dictationBusyRef.current = false;
+              onDictationStateChange?.('idle');
+            });
+        }
+      } else {
+        if (!isDictationAvailable()) {
+          onToast?.('Dictation not available. Build native/ztc-audio or install sox');
+          return;
+        }
+        try {
+          if (useNative) {
+            startNativeRecording({ model: 'tiny' });
+          } else {
+            startLegacyRecording();
+          }
+          onDictationStateChange?.('recording');
+        } catch (err) {
+          onToast?.(`Recording error: ${err instanceof Error ? err.message : 'Unknown'}`);
+        }
+      }
+      return;
+    }
     if (key.meta && input === 'y') {
       overlayStateRef.current = yankPop(current);
       renderOverlay(overlayStateRef.current);
       return;
     }
-    if (key.ctrl && input === 't') {
+    if (isCtrl(input, key, 't')) {
       overlayStateRef.current = transposeChars(current);
       renderOverlay(overlayStateRef.current);
       return;
@@ -1000,13 +1564,13 @@ export const InputArea: React.FC<InputAreaProps> = ({
       renderOverlay(overlayStateRef.current);
       return;
     }
-    if (key.ctrl && input === 'd') {
+    if (isCtrl(input, key, 'd')) {
       overlayStateRef.current = deleteForward(current);
       renderOverlay(overlayStateRef.current);
       return;
     }
 
-    if (key.ctrl && input === 'w') {
+    if (isCtrl(input, key, 'w')) {
       const { next, killed } = killWordBackward(current);
       pushKill(killed);
       overlayStateRef.current = next;
@@ -1052,7 +1616,7 @@ export const InputArea: React.FC<InputAreaProps> = ({
       overlayStateRef.current = { ...overlayStateRef.current, historyIdx: -1 };
       renderOverlay(overlayStateRef.current);
     }
-  }, [disabled, historyEnabled, onCommand, onSubmit, renderOverlay]);
+  }, [disabled, handleKittyOverlayInput, historyEnabled, onCommand, onSubmit, renderOverlay]);
 
   useInput((input, key) => {
     if (overlayEnabled) {