feat: add CJK IME input textarea with env toggle

Add a dedicated textarea below the terminal for CJK (Korean/Japanese/Chinese)
IME input. xterm.js intercepts IME composition events, preventing composed
characters from displaying correctly. This textarea bypasses xterm entirely
by using native browser IME handling — text accumulates until Enter, then
sends to PTY in one shot.

- Always-visible textarea below terminal (inside .terminal-wrap flex column)
- focus/blur sets window.cjkActive flag to block xterm onData
- Enter sends textarea.value + \r to PTY, Escape clears
- Arrow keys, Ctrl+C/D/L/Z, Tab, Backspace pass through to PTY when empty
- attachCustomKeyEventHandler suppresses xterm key handling during composition
- INPUT_CJK_FORM=ON|OFF env var toggle (default: off, passed via SSE init)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
jaypark
2026-03-14 16:23:25 +09:00
co-authored by Claude Opus 4.6
parent a6597e4a9a
commit e5aca6aa4c
6 changed files with 168 additions and 2 deletions
+38
View File
@@ -1882,6 +1882,13 @@ body {
position: relative;
}
.terminal-wrap {
flex: 1;
display: flex;
flex-direction: column;
overflow: hidden;
}
.terminal-container {
flex: 1;
background: #0d0d0d;
@@ -7502,3 +7509,34 @@ kbd {
.advanced-options-content {
padding-left: 0.5rem;
}
/* ═══════════════════════════════════════════════════════════════
CJK IME Input
═══════════════════════════════════════════════════════════════ */
#cjkInput {
display: none;
flex-shrink: 0;
width: 100%;
font-family: 'Fira Code', 'Cascadia Code', 'JetBrains Mono', 'SF Mono', Monaco, monospace;
font-size: 14px;
background: #1a1a2e;
color: #e0e0e0;
border: 1px solid #333;
border-top: none;
padding: 6px 10px;
outline: none;
resize: none;
line-height: 1.4;
box-sizing: border-box;
}
#cjkInput:focus {
border-color: #339af0;
background: #111;
}
#cjkInput::placeholder {
color: #495057;
font-size: 12px;
}