diff --git a/packages/coding-agent/src/core/export-html/template.css b/packages/coding-agent/src/core/export-html/template.css index 311af7f7..b3a4e39b 100644 --- a/packages/coding-agent/src/core/export-html/template.css +++ b/packages/coding-agent/src/core/export-html/template.css @@ -262,9 +262,23 @@ margin-bottom: var(--line-height); display: flex; align-items: center; + justify-content: space-between; + flex-wrap: wrap; gap: 12px; } + .help-hint { + flex: 1 1 240px; + } + + .help-actions { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 8px; + } + + .header-toggle-btn, .download-json-btn { font-size: 10px; padding: 2px 8px; @@ -276,6 +290,7 @@ font-family: inherit; } + .header-toggle-btn:hover, .download-json-btn:hover { background: var(--hover); border-color: var(--borderAccent); diff --git a/packages/coding-agent/src/core/export-html/template.js b/packages/coding-agent/src/core/export-html/template.js index f2b00b06..8042c1db 100644 --- a/packages/coding-agent/src/core/export-html/template.js +++ b/packages/coding-agent/src/core/export-html/template.js @@ -1291,8 +1291,12 @@

Session: ${escapeHtml(header?.id || 'unknown')}

- Ctrl+T toggle thinking · Ctrl+O toggle tools - + T toggle thinking · O toggle tools +
+ + + +
Date:${header?.timestamp ? new Date(header.timestamp).toLocaleString() : 'unknown'}
@@ -1393,6 +1397,7 @@ renderTree(); document.getElementById('header-container').innerHTML = renderHeader(); + attachHeaderHandlers(); // Build messages using cached DOM nodes const messagesEl = document.getElementById('messages'); @@ -1672,6 +1677,20 @@ }); }; + const attachHeaderHandlers = () => { + document.querySelector('[data-action="toggle-thinking"]')?.addEventListener('click', toggleThinking); + document.querySelector('[data-action="toggle-tools"]')?.addEventListener('click', toggleToolOutputs); + }; + + const isEditableTarget = (element) => { + if (!element) return false; + const tagName = element.tagName; + if (tagName === 'INPUT' || tagName === 'TEXTAREA' || tagName === 'SELECT' || tagName === 'BUTTON') { + return true; + } + return element.isContentEditable || Boolean(element.closest?.('[contenteditable="true"]')); + }; + // Keyboard shortcuts document.addEventListener('keydown', (e) => { if (e.key === 'Escape') { @@ -1679,11 +1698,16 @@ searchQuery = ''; navigateTo(leafId, 'bottom'); } - if (e.ctrlKey && e.key === 't') { + + if (isEditableTarget(document.activeElement)) { + return; + } + + const key = e.key.toLowerCase(); + if (key === 't') { e.preventDefault(); toggleThinking(); - } - if (e.ctrlKey && e.key === 'o') { + } else if (key === 'o') { e.preventDefault(); toggleToolOutputs(); }