@goodandready/dsh-voice 0.9.30 → 0.9.32

package/lib/client.js

@@ -132,6 +132,14 @@ window.__ModuleLoader__.load({
       'bargeIn': 'Barge-in',
       'polishSend': 'Polish whole draft before sending',
       'polishSendHint': 'Run the composed draft through the model right before sending',
+      'editablePreview': 'Editable preview before send',
+      'editablePreviewHint': 'Show recognized text before sending with editing, comparison and abort options.',
+      'editPreview': 'Edit',
+      'sendNow': 'Send',
+      'cancelPreview': 'Cancel',
+      'rawText': 'Raw',
+      'polishedText': 'Polished',
+      'sessionMismatch': 'Different chat active; canceled to prevent leak.',
       'sessionCommands': 'Voice session commands',
       'sessionCommandsHint': '"send", "cancel", "stop", "continue" act on the session instead of becoming text',
       'polishBaseUrl': 'Offline polish endpoint',
@@ -240,6 +248,27 @@ window.__ModuleLoader__.load({
       'voiceActionsLabel': 'Voice action commands ("send", "cancel", "clear", "new line")',
       'liveInterimPreview': 'Live speech preview (ghost text preview)',
       'structuredPromptVoice': 'Spoken answers for interactive choice prompts',
+      'modeVerbatim': 'Verbatim',
+      'modeClean': 'Clean Text',
+      'modeTask': 'Agent Task',
+      'modeNote': 'Note',
+      'dictationModeTitle': 'Dictation Post-Processing Mode',
+      'dictationModeDesc': 'Select how dictated speech is processed before insertion: Verbatim (0 LLM calls), Clean text (formatting & filler removal), Agent task (structured prompt), or Note (key points & actions).',
+      'dictationPromptsTitle': 'Dictation Prompt Templates',
+      'dictationPromptsDesc': 'Custom prompt templates for dictation post-processing. Use {text} as placeholder for recognized speech.',
+      'promptClean': 'Clean text prompt',
+      'promptTask': 'Agent task prompt',
+      'promptNote': 'Note prompt',
+      'resetPrompts': 'Reset to defaults',
+      'voiceMacrosTitle': 'Voice Action Macros',
+      'voiceMacrosDesc': 'Spoken trigger phrases automatically expanded into structured prompt templates.',
+      'addMacro': 'Add macro',
+      'macroTrigger': 'Spoken trigger phrase',
+      'macroTemplate': 'Expanded prompt template',
+      'macroDelete': 'Delete',
+      'rawTab': 'Raw STT',
+      'resultTab': 'Result',
+      'llmUnavailableFallback': 'LLM unavailable, showing raw transcript',
       'jargonTitle': 'Developer Lexicon & IT Jargon',
       'techJargonCorrection': 'Auto-correct technical jargon (GitHub, Docker, pnpm, Kubernetes, etc.)',
       'jargonAdd': 'Add replacement',
@@ -350,6 +379,14 @@ window.__ModuleLoader__.load({
       'bargeIn': '语音插话打断 (Barge-in)',
       'polishSend': '发送前润色整篇草稿',
       'polishSendHint': '发送给智能体前对整个输入框草稿进行一次整体润色',
+      'editablePreview': '发送前可编辑预览',
+      'editablePreviewHint': '发送前显示识别文本，支持编辑、润色对比和撤销。',
+      'editPreview': '编辑',
+      'sendNow': '发送',
+      'cancelPreview': '取消',
+      'rawText': '原文',
+      'polishedText': '润色',
+      'sessionMismatch': '当前会话已切换，已拦截发送以防止串话。',
       'sessionCommands': '会话语音控制指令',
       'sessionCommandsHint': '"send"、"cancel"、"stop"、"continue" 执行操作而非转为文本',
       'polishBaseUrl': '离线润色服务端点',
@@ -458,6 +495,27 @@ window.__ModuleLoader__.load({
       'voiceActionsLabel': '语音动作指令 ("发送", "取消", "清空", "换行")',
       'liveInterimPreview': '实时语音文本预览 (幽灵文本)',
       'structuredPromptVoice': '语音应答交互式选择提示',
+      'modeVerbatim': '逐字直录',
+      'modeClean': '清爽文本',
+      'modeTask': '智能体任务',
+      'modeNote': '便签备忘',
+      'dictationModeTitle': '听写后处理模式',
+      'dictationModeDesc': '选择听写文本后处理方式：逐字直录（零LLM调用）、清爽文本（整理标点去除语气词）、智能体任务（结构化提示词）或便签（要点与行动项）。',
+      'dictationPromptsTitle': '听写提示词模板',
+      'dictationPromptsDesc': '自定义听写后处理提示词模板。使用 {text} 作为识别语音的占位符。',
+      'promptClean': '清爽文本提示词',
+      'promptTask': '智能体任务提示词',
+      'promptNote': '便签提示词',
+      'resetPrompts': '恢复默认模板',
+      'voiceMacrosTitle': '语音动作宏',
+      'voiceMacrosDesc': '语音触发词自动展开为结构化提示词模板。',
+      'addMacro': '添加动作宏',
+      'macroTrigger': '语音触发短语',
+      'macroTemplate': '展开提示词模板',
+      'macroDelete': '删除',
+      'rawTab': '原始识别',
+      'resultTab': '处理结果',
+      'llmUnavailableFallback': 'LLM不可用，已保留原始识别文本',
       'jargonTitle': '开发者词汇与 IT 术语',
       'techJargonCorrection': '自动校正开发术语 (GitHub, Docker, pnpm, Kubernetes 等)',
       'jargonAdd': '添加替换项',
@@ -518,7 +576,20 @@ window.__ModuleLoader__.load({
       '.dvo-progress-bar{height:6px;width:100%;background:var(--dsw-alias-bg-layer-3);border-radius:3px;overflow:hidden}' +
       '.dvo-progress-fill{height:100%;background:var(--dsw-alias-state-info-primary);transition:width 150ms ease}' +
       '.dvo-jargon-table{width:100%;margin-top:6px;border-collapse:collapse;font-size:12px}' +
-      '.dvo-jargon-table td{padding:4px 6px;border-bottom:1px solid var(--dsw-alias-border-l1)}'
+      '.dvo-jargon-table td{padding:4px 6px;border-bottom:1px solid var(--dsw-alias-border-l1)}' +
+      '.dvo-pill-preview{display:flex;flex-direction:column;gap:8px;padding:10px 14px;border-radius:18px;background:var(--dsw-alias-bg-layer-1);border:1px solid var(--dsw-alias-border-l1);width:100%;max-width:720px;margin:0 auto;box-shadow:0 8px 24px color-mix(in srgb, var(--dsw-alias-label-primary) 18%, transparent);box-sizing:border-box}' +
+      '.dvo-preview-header{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%}' +
+      '.dvo-preview-tabs{display:inline-flex;align-items:center;gap:4px;background:var(--dsw-alias-bg-layer-2);padding:2px;border-radius:12px;border:1px solid var(--dsw-alias-border-l1)}' +
+      '.dvo-tab-btn{border:none;background:transparent;color:var(--dsw-alias-label-secondary);font-size:11px;font-weight:500;padding:3px 10px;border-radius:10px;cursor:pointer;transition:all 150ms ease}' +
+      '.dvo-tab-btn:hover{color:var(--dsw-alias-label-primary)}' +
+      '.dvo-tab-btn-active{background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-primary);box-shadow:0 1px 3px color-mix(in srgb, var(--dsw-alias-label-primary) 15%, transparent)}' +
+      '.dvo-preview-body{display:flex;align-items:center;gap:8px;width:100%}' +
+      '.dvo-preview-text{flex:1;font-size:13px;color:var(--dsw-alias-label-primary);line-height:1.4;word-break:break-word;max-height:80px;overflow-y:auto;padding:2px 0}' +
+      '.dvo-preview-input{flex:1;font-size:13px;color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l2);border-radius:8px;padding:6px 8px;outline:none;font-family:inherit;width:100%}' +
+      '.dvo-preview-input:focus{border-color:var(--dsw-alias-state-info-primary)}' +
+      '.dvo-btn-send{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;cursor:pointer;padding:0;flex:none;box-sizing:border-box;border:none;background:var(--dsw-alias-label-primary);color:var(--dsw-alias-bg-layer-1);transition:opacity 150ms ease}' +
+      '.dvo-btn-send:hover{opacity:0.9}' +
+      '.dvo-warn-banner{font-size:12px;color:var(--dsw-alias-state-error-primary);background:color-mix(in srgb, var(--dsw-alias-state-error-primary) 12%, transparent);border:1px solid var(--dsw-alias-state-error-primary);padding:4px 8px;border-radius:6px;margin-top:4px}' + '.dvo-mode-pill-btn{display:inline-flex;align-items:center;justify-content:center;height:28px;padding:0 8px;font-size:11px;font-weight:600;border-radius:14px;cursor:pointer;border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-secondary);user-select:none;touch-action:manipulation;transition:all 150ms ease}' + '.dvo-mode-pill-btn:hover{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-label-primary)}' + '.dvo-mode-badge{font-size:11px;font-weight:600;padding:2px 6px;border-radius:6px;background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-primary);border:1px solid var(--dsw-alias-border-l2);margin-right:4px}' + '.dvo-macro-item{display:flex;flex-direction:column;gap:6px;padding:8px 10px;background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l1);border-radius:8px;margin-top:6px}' + '.dvo-macro-actions{display:flex;justify-content:flex-end;gap:6px}' + '.dvo-fallback-badge{font-size:11px;padding:2px 6px;border-radius:4px;color:var(--dsw-alias-state-warning-primary);background:color-mix(in srgb, var(--dsw-alias-state-warning-primary) 12%, transparent);border:1px solid var(--dsw-alias-state-warning-primary)}'
     const cssId = 'dsh-voice/client.module.css'
     if (typeof document !== 'undefined' && !document.querySelector('style[data-dsh-plugin="dsh-voice"][data-plugin-css="' + cssId + '"]')) {
       const tag = document.createElement('style')
@@ -543,7 +614,7 @@ window.__ModuleLoader__.load({
       inputActions: null,
       input: null,
       settings: {
-        vadSilenceMs: 700, autoSendMs: 4000, stream: false, streamChunkMs: 1200, vadAdapt: 0,
+        vadSilenceMs: 700, autoSendMs: 4000, editablePreview: true, stream: false, streamChunkMs: 1200, vadAdapt: 0,
         noiseSuppression: true, contextGlossary: true,
         gatedTurnTaking: true, autoSendVisualRing: true, voiceActions: true,
         techJargonCorrection: true, jargonDictionary: [], liveInterimPreview: true,
@@ -714,7 +785,26 @@ window.__ModuleLoader__.load({
 
     function extractContextKeywords() {
       if (!voice.settings || voice.settings.contextGlossary === false) return []
-      const text = (voice.input && typeof voice.input.draft === 'string') ? voice.input.draft : ''
+      const chunks = []
+      const draft = (voice.input && typeof voice.input.draft === 'string') ? voice.input.draft : ''
+      if (draft && draft.length >= 3) chunks.push(draft)
+      if (voice.session && Array.isArray(voice.session.messages)) {
+        const msgs = voice.session.messages.slice(-5)
+        for (const m of msgs) {
+          const t = (m && typeof m.content === 'string') ? m.content : ((m && typeof m.text === 'string') ? m.text : '')
+          if (t && t.length >= 3) chunks.push(t)
+        }
+      }
+      if (typeof document !== 'undefined') {
+        try {
+          const nodes = document.querySelectorAll('.message-content code, .dsh-message-body code, pre code')
+          for (let i = 0; i < Math.min(nodes.length, 10); i++) {
+            const ct = nodes[i].textContent
+            if (ct && ct.length < 100) chunks.push(ct)
+          }
+        } catch (_) {}
+      }
+      const text = chunks.join(' ')
       if (!text || text.length < 3) return []
       const matches = text.match(/[A-Za-zА-Яа-яЁё_][A-Za-zА-Яа-яЁё0-9_]{2,29}/g) || []
       // Linguistic filter: functional stop-word dictionary for vocabulary keyword extraction.
@@ -746,7 +836,11 @@ window.__ModuleLoader__.load({
 
       const tryHost = async (chainOverride) => {
         const dataBase64 = await blobToBase64(blob)
-        const payload = { dataBase64, mimeType: mime, mode }
+        const subMode = (voice._activeTarget && voice._activeTarget.dictationMode)
+          || voice.selectedDictationMode
+          || (voice.settings && voice.settings.dictationMode)
+          || 'clean'
+        const payload = { dataBase64, mimeType: mime, mode, subMode }
         if (Array.isArray(chainOverride)) {
           payload.chain = chainOverride.map((p) => (typeof p === 'string' ? { provider: p, model: modelMap[p] } : p))
         }
@@ -1458,7 +1552,14 @@ voice._chainsPromise = null
       if (targetActions && typeof targetActions.captureInsertion === 'function') {
         try { span = targetActions.captureInsertion() } catch (_) {}
       }
-      const target = { actions: targetActions, input: targetInput, span }
+      const initialDraft = (targetInput && typeof targetInput.draft === 'string') ? targetInput.draft : ''
+      const targetSession = voice.session || (targetInput && targetInput.session)
+      const sessionId = (targetSession && (targetSession.sessionId || targetSession.id))
+        || voice.currentSessionId || ''
+      const snapshotSubMode = voice.selectedDictationMode
+        || (voice.settings && voice.settings.dictationMode)
+        || 'clean'
+      const target = { actions: targetActions, input: targetInput, session: targetSession, span, initialDraft, sessionId, dictationMode: snapshotSubMode }
       voice._activeTarget = target
 
       if (voice.isTtsSpeaking) {
@@ -1539,7 +1640,12 @@ voice._chainsPromise = null
           if (mode === 'message') {
             const ok = appendDraft(said, target)
             if (ok !== false) {
-              voice.set({ phase: 'pending', pending: { text: said, target, totalMs: voice.settings.autoSendMs, leftMs: voice.settings.autoSendMs } })
+              const usePreview = voice.settings.editablePreview !== false
+              const autoMs = Number(voice.settings.autoSendMs) || 4000
+              const pendingState = usePreview
+                ? initPendingPreview(said, target, { autoSendMs: autoMs })
+                : { text: said, target, totalMs: autoMs, leftMs: autoMs }
+              voice.set({ phase: 'pending', pending: pendingState })
             } else {
               voice.set({ phase: 'idle' })
             }
@@ -1610,7 +1716,24 @@ voice._chainsPromise = null
             if (voice.lastNote) voice.lastNote.text = text
             if (mode === 'message') {
               if (ok !== false) {
-                voice.set({ phase: 'pending', pending: { text, target, totalMs: voice.settings.autoSendMs, leftMs: voice.settings.autoSendMs, audioUrl: noteUrl } })
+                const usePreview = voice.settings.editablePreview !== false
+                let polishedText = text
+                if (usePreview && voice.settings.polishSend) {
+                  try {
+                    const pRes = await fetch('/dsh-voice/polish', {
+                      method: 'POST',
+                      headers: { 'content-type': 'application/json' },
+                      body: JSON.stringify({ text }),
+                    })
+                    const pData = await pRes.json()
+                    if (pData && pData.text) polishedText = pData.text
+                  } catch (_) {}
+                }
+                const autoMs = Number(voice.settings.autoSendMs) || 4000
+                const pendingState = usePreview
+                  ? initPendingPreview(text, target, { autoSendMs: autoMs, polishedText, audioUrl: noteUrl, polishSend: voice.settings.polishSend })
+                  : { text, target, totalMs: autoMs, leftMs: autoMs, audioUrl: noteUrl }
+                voice.set({ phase: 'pending', pending: pendingState })
               } else {
                 voice.set({ phase: 'idle' })
               }
@@ -1658,38 +1781,11 @@ voice._chainsPromise = null
     }
 
     function submitPending() {
-      const pending = voice.pending
-      if (!pending) return
-      const text = pending.text
-      const target = pending.target || voice._activeTarget
-      const actions = (target && target.actions) || voice.inputActions
-      voice.pending = null
-      voice.set({ phase: 'idle' })
+      submitPendingPreview(voice)
+    }
 
-      if (voice.settings.polishSend) {
-        fetch('/dsh-voice/polish', {
-          method: 'POST',
-          headers: { 'content-type': 'application/json' },
-          body: JSON.stringify({ text }),
-        })
-          .then((res) => res.json())
-          .then((data) => {
-            const polished = (data && data.text) || text
-            if (actions && typeof actions.setDraft === 'function') {
-              actions.setDraft(polished)
-            }
-            if (actions && typeof actions.submit === 'function') {
-              actions.submit()
-            }
-          })
-          .catch(() => {
-            if (actions && typeof actions.submit === 'function') {
-              actions.submit()
-            }
-          })
-      } else if (actions && typeof actions.submit === 'function') {
-        actions.submit()
-      }
+    function cancelPending() {
+      cancelPendingPreview(voice)
     }
 
     function runSessionCommand(cmd) {
@@ -1700,8 +1796,7 @@ voice._chainsPromise = null
     }
 
     function keepPending() {
-      voice.pending = null
-      voice.set({ phase: 'idle' })
+      keepPendingPreview(voice)
     }
     // ----------------------------------------------------------- components
     function VoiceButtons(props) {
@@ -1711,7 +1806,15 @@ voice._chainsPromise = null
       if (v.phase !== 'idle' && v.phase !== 'error' && !hold.armed) return null
       const err = v.phase === 'error'
       const hk = voice.hotkey ? ` (${voice.hotkey})` : ''
+      const curMode = voice.selectedDictationMode || (voice.settings && voice.settings.dictationMode) || 'clean'
       return React.createElement(React.Fragment, null,
+        React.createElement('button', {
+          type: 'button',
+          className: 'dvo-mode-pill-btn',
+          title: t('dictationModeTitle') + ': ' + getDictationModeLabel(curMode, t),
+          'aria-label': t('dictationModeTitle') + ': ' + getDictationModeLabel(curMode, t),
+          onClick: cycleDictationMode,
+        }, getDictationModeLabel(curMode, t)),
         React.createElement('button', {
           type: 'button', className: 'dvo-btn', 'data-err': err ? '1' : '0',
           title: err ? v.error : t('dictationBtn'),
@@ -1930,6 +2033,277 @@ voice._chainsPromise = null
       }
       return cleanup
     }
+// ------------------------------------------------------------------ 43-preview
+// Editable preview state machine, session pinning & UI component (#170).
+
+function initPendingPreview(text, target, options = {}) {
+  const autoMs = Number(options.autoSendMs) || 4000
+  const polishedText = options.polishedText || text
+  const isPolished = options.polishSend && polishedText && polishedText !== text
+  const initialDraft = (target && typeof target.initialDraft === 'string')
+    ? target.initialDraft
+    : ((target && target.input && typeof target.input.draft === 'string') ? target.input.draft : '')
+  const sessionId = (target && target.sessionId) || ''
+
+  return {
+    text,
+    rawText: text,
+    polishedText,
+    activeText: isPolished ? polishedText : text,
+    selectedTab: isPolished ? 'polished' : 'raw',
+    isEditing: false,
+    target,
+    sessionId,
+    initialDraft,
+    totalMs: autoMs,
+    leftMs: autoMs,
+    paused: false,
+    audioUrl: options.audioUrl || '',
+    sessionMismatch: false,
+  }
+}
+
+function cancelPendingPreview(voice) {
+  const pending = voice.pending
+  if (!pending) {
+    voice.set({ phase: 'idle' })
+    return
+  }
+  const target = pending.target || voice._activeTarget
+  const actions = (target && target.actions) || voice.inputActions
+
+  // Restore untouched composer draft if preview was active
+  if (pending.rawText !== undefined && pending.initialDraft !== undefined) {
+    if (actions && typeof actions.setDraft === 'function') {
+      try { actions.setDraft(pending.initialDraft) } catch (_) {}
+    }
+  }
+  voice.pending = null
+  voice.set({ phase: 'idle' })
+}
+
+function keepPendingPreview(voice) {
+  const pending = voice.pending
+  if (!pending) {
+    voice.set({ phase: 'idle' })
+    return
+  }
+  const target = pending.target || voice._activeTarget
+  const actions = (target && target.actions) || voice.inputActions
+
+  if (pending.rawText !== undefined) {
+    // Insert final edited text into composer draft without auto-sending
+    const initial = pending.initialDraft || ''
+    const textToInsert = pending.activeText || ''
+    const full = initial
+      ? (initial.endsWith(' ') || initial.endsWith('\n') ? (initial + textToInsert) : (initial + ' ' + textToInsert))
+      : textToInsert
+    if (actions && typeof actions.setDraft === 'function') {
+      try { actions.setDraft(full) } catch (_) {}
+    }
+  }
+  voice.pending = null
+  voice.set({ phase: 'idle' })
+}
+
+function submitPendingPreview(voice) {
+  const pending = voice.pending
+  if (!pending) return
+  const target = pending.target || voice._activeTarget
+  const actions = (target && target.actions) || voice.inputActions
+
+  // Session guard (#170): verify that current session matches initiating session
+  const currentSessionId = (target && target.session && (target.session.sessionId || target.session.id))
+    || (voice.session && (voice.session.sessionId || voice.session.id))
+    || voice.currentSessionId || ''
+
+  if (pending.sessionId && currentSessionId && pending.sessionId !== currentSessionId) {
+    pending.sessionMismatch = true
+    pending.paused = true
+    voice.notify()
+    return
+  }
+
+  const textToSend = (pending.rawText !== undefined ? pending.activeText : pending.text) || ''
+  voice.pending = null
+  voice.set({ phase: 'idle' })
+
+  if (pending.rawText !== undefined) {
+    const initial = pending.initialDraft || ''
+    const full = initial
+      ? (initial.endsWith(' ') || initial.endsWith('\n') ? (initial + textToSend) : (initial + ' ' + textToSend))
+      : textToSend
+    if (actions && typeof actions.setDraft === 'function') {
+      try { actions.setDraft(full) } catch (_) {}
+    }
+    if (actions && typeof actions.submit === 'function') {
+      try { actions.submit() } catch (_) {}
+    }
+  } else {
+    // Legacy path without rich preview
+    if (voice.settings.polishSend) {
+      fetch('/dsh-voice/polish', {
+        method: 'POST',
+        headers: { 'content-type': 'application/json' },
+        body: JSON.stringify({ text: textToSend }),
+      })
+        .then((res) => res.json())
+        .then((data) => {
+          const polished = (data && data.text) || textToSend
+          if (actions && typeof actions.setDraft === 'function') actions.setDraft(polished)
+          if (actions && typeof actions.submit === 'function') actions.submit()
+        })
+        .catch(() => {
+          if (actions && typeof actions.submit === 'function') actions.submit()
+        })
+    } else if (actions && typeof actions.submit === 'function') {
+      actions.submit()
+    }
+  }
+}
+
+function renderEditablePreviewPill(voice, v, isPlaying, setIsPlaying, audioRef) {
+  const p = voice.pending
+  const total = p.totalMs || Number(voice.settings.autoSendMs) || 4000
+  const leftMs = Math.max(0, p.leftMs || 0)
+  const left = Math.ceil(leftMs / 1000)
+  const frac = total > 0 ? Math.max(0, Math.min(1, leftMs / total)) : 0
+  const circ = 2 * Math.PI * 14
+  const off = circ * (1 - frac)
+  const hasPolish = p.polishedText && p.polishedText !== p.rawText
+
+  return React.createElement('div', { className: 'dvo-pill-preview', role: 'region', 'aria-label': t('editablePreview') },
+    // Header row: tabs, audio playback, status/countdown, cancel button
+    React.createElement('div', { className: 'dvo-preview-header' },
+      React.createElement('div', { style: { display: 'flex', alignItems: 'center', gap: '8px' } },
+        hasPolish
+          ? React.createElement('div', { className: 'dvo-preview-tabs' },
+              React.createElement('button', {
+                type: 'button',
+                className: 'dvo-tab-btn' + (p.selectedTab === 'raw' ? ' dvo-tab-btn-active' : ''),
+                onClick: () => {
+                  p.selectedTab = 'raw'
+                  p.activeText = p.rawText
+                  voice.notify()
+                },
+              }, t('rawText')),
+              React.createElement('button', {
+                type: 'button',
+                className: 'dvo-tab-btn' + (p.selectedTab === 'polished' ? ' dvo-tab-btn-active' : ''),
+                onClick: () => {
+                  p.selectedTab = 'polished'
+                  p.activeText = p.polishedText
+                  voice.notify()
+                },
+              }, t('polishedText')),
+            )
+          : React.createElement('span', { className: 'dvo-count' }, t('rawText')),
+        p.audioUrl
+          ? React.createElement('div', { className: 'dvo-audio-wrap' },
+              React.createElement('button', {
+                type: 'button', className: 'dvo-audio-play',
+                title: isPlaying ? t('pause') : t('play'),
+                'aria-label': isPlaying ? t('pause') : t('play'),
+                onClick: () => {
+                  const el = audioRef.current
+                  if (!el) return
+                  if (el.paused) { el.play().catch(() => {}); setIsPlaying(true) }
+                  else { el.pause(); setIsPlaying(false) }
+                },
+              }, isPlaying ? pauseIcon() : playIcon()),
+              React.createElement('audio', {
+                ref: audioRef, src: p.audioUrl,
+                onEnded: () => setIsPlaying(false),
+                onPause: () => setIsPlaying(false),
+                onPlay: () => setIsPlaying(true),
+              }),
+              React.createElement('span', { className: 'dvo-audio-time' }, t('listenBack')),
+            )
+          : null,
+      ),
+      React.createElement('div', { style: { display: 'flex', alignItems: 'center', gap: '8px' } },
+        (!p.paused && !p.isEditing && v.settings.autoSendVisualRing !== false)
+          ? React.createElement('svg', { className: 'dvo-silence-ring', viewBox: '0 0 34 34' },
+              React.createElement('circle', { cx: 17, cy: 17, r: 14, className: 'dvo-ring-bg' }),
+              React.createElement('circle', {
+                cx: 17, cy: 17, r: 14, className: 'dvo-ring-fg',
+                strokeDasharray: `${circ} ${circ}`,
+                strokeDashoffset: off,
+              }),
+            )
+          : null,
+        React.createElement('span', { className: 'dvo-count' },
+          (p.paused || p.isEditing) ? '' : (left + t('secondsShort'))
+        ),
+        React.createElement('button', {
+          type: 'button', className: 'dvo-pbtn', title: t('cancelPreview'),
+          'aria-label': t('cancelPreview'),
+          onClick: () => { cancelPending(); focusComposer() },
+        }, xIcon()),
+      ),
+    ),
+    // Body row: editable input or preview text, Edit button, Send button
+    React.createElement('div', { className: 'dvo-preview-body' },
+      p.isEditing
+        ? React.createElement('input', {
+            type: 'text',
+            className: 'dvo-preview-input',
+            value: p.activeText,
+            autoFocus: true,
+            onChange: (e) => {
+              p.activeText = e.target.value
+              voice.notify()
+            },
+            onKeyDown: (e) => {
+              if (e.key === 'Enter' && !e.shiftKey) {
+                e.preventDefault()
+                submitPending()
+              }
+            },
+          })
+        : React.createElement('span', { className: 'dvo-preview-text' }, p.activeText),
+      !p.isEditing
+        ? React.createElement('button', {
+            type: 'button', className: 'dvo-pbtn', title: t('editPreview'),
+            'aria-label': t('editPreview'),
+            onClick: () => {
+              p.isEditing = true
+              p.paused = true
+              voice.notify()
+            },
+          }, editIcon())
+        : null,
+      React.createElement('button', {
+        type: 'button', className: 'dvo-btn-send', title: t('sendNow'),
+        'aria-label': t('sendNow'),
+        onClick: () => { submitPending(); focusComposer() },
+      }, sendIcon()),
+    ),
+    // Mismatch warning banner
+    p.sessionMismatch
+      ? React.createElement('div', { className: 'dvo-warn-banner' }, t('sessionMismatch'))
+      : null,
+  )
+}
+// ------------------------------------------------------------------ 45-dictation
+// Dictation modes UI helper, mode cycler and labels (#264)
+
+const DICTATION_MODES = ['clean', 'task', 'note', 'verbatim']
+
+function getDictationModeLabel(m, t) {
+  const trans = t || moduleT
+  if (m === 'verbatim') return trans('modeVerbatim')
+  if (m === 'task') return trans('modeTask')
+  if (m === 'note') return trans('modeNote')
+  return trans('modeClean')
+}
+
+function cycleDictationMode() {
+  const cur = voice.selectedDictationMode || (voice.settings && voice.settings.dictationMode) || 'clean'
+  const nextIdx = (DICTATION_MODES.indexOf(cur) + 1) % DICTATION_MODES.length
+  voice.selectedDictationMode = DICTATION_MODES[nextIdx]
+  voice.notify()
+}
     // ----------------------------------------------------------- visualizers
     let _accentColorCache = { color: '', expires: 0 }
     let _softColorCache = { color: '', expires: 0 }
@@ -2071,6 +2445,8 @@ voice._chainsPromise = null
       const [isPlaying, setIsPlaying] = React.useState(false)
       voice.inputActions = props.inputActions
       voice.input = props.input
+      voice.session = props.session
+      voice.currentSessionId = (props.session && (props.session.sessionId || props.session.id)) || voice.currentSessionId || ''
       const ctx = props.ctx
 
       // VAD: accumulate silence and cut the phrase when the pause exceeds the threshold.
@@ -2194,6 +2570,10 @@ voice._chainsPromise = null
             else voice.notify()
             return
           }
+          if (p.paused || p.isEditing) {
+            // Confirmation or editing mode freezes auto-send countdown (#170)
+            return
+          }
           p.leftMs -= tick
           if (p.leftMs <= 0) { submitPending(); return }
           voice.notify()
@@ -2245,7 +2625,12 @@ voice._chainsPromise = null
         // Live caption of what is heard right now. Until the browser emits a
         // final chunk the text is interim and changes on screen.
         const caption = voice.caption || (inBrowser ? '' : null)
+        const activeSubMode = (voice._activeTarget && voice._activeTarget.dictationMode)
+          || voice.selectedDictationMode
+          || (voice.settings && voice.settings.dictationMode)
+          || 'clean'
         return React.createElement('div', { className: 'dvo-pill', role: 'region', 'aria-label': t('title') },
+          React.createElement('span', { className: 'dvo-mode-badge' }, getDictationModeLabel(activeSubMode, t)),
           React.createElement('button', {
             type: 'button', className: 'dvo-pbtn', title: t('cancel'),
             'aria-label': t('cancel'),
@@ -2274,11 +2659,22 @@ voice._chainsPromise = null
       }
 
       if (v.phase === 'processing') {
+        const activeSubMode = (voice._activeTarget && voice._activeTarget.dictationMode)
+          || voice.selectedDictationMode
+          || (voice.settings && voice.settings.dictationMode)
+          || 'clean'
         return React.createElement('div', { className: 'dvo-pill', role: 'region', 'aria-label': t('title') },
-          React.createElement('span', { className: 'dvo-status', 'aria-live': 'polite', 'aria-atomic': 'true' }, spinIcon(), t('transcribing')))
+          React.createElement('span', { className: 'dvo-status', 'aria-live': 'polite', 'aria-atomic': 'true' },
+            spinIcon(),
+            React.createElement('span', { className: 'dvo-mode-badge' }, getDictationModeLabel(activeSubMode, t)),
+            t('transcribing'),
+          ))
       }
 
       if (v.phase === 'pending') {
+        if (voice.pending && voice.pending.rawText !== undefined) {
+          return renderEditablePreviewPill(voice, v, isPlaying, setIsPlaying, audioRef)
+        }
         const left = Math.max(0, Math.ceil((voice.pending ? voice.pending.leftMs : 0) / 1000))
         if (voice.pending && voice.pending.undoOnly) {
           // Cancel window for delayed dictation insert (#29-5).
@@ -2389,6 +2785,9 @@ voice._chainsPromise = null
                 voiceCommands: !!(data && data.voiceCommands),
                 vadSilenceMs: Number(data && data.modes && data.modes.dictation && data.modes.dictation.vadSilenceMs) || 700,
                 autoSendMs: Number(data && data.modes && data.modes.message && data.modes.message.autoSendMs) || 4000,
+                dictationMode: String((data && data.dictationMode) || 'clean'),
+                dictationPrompts: (data && data.dictationPrompts) || {},
+                voiceMacros: Array.isArray(data && data.voiceMacros) ? data.voiceMacros : [],
                 sendDelayMs: Number(data && data.modes && data.modes.dictation && data.modes.dictation.sendDelayMs) || 0,
                 stream: !!(data && data.modes && data.modes.dictation && data.modes.dictation.stream),
                 streamChunkMs: Number(data && data.modes && data.modes.dictation && data.modes.dictation.streamChunkMs) || 1200,
@@ -2433,7 +2832,7 @@ voice._chainsPromise = null
         ))
         const offDock = ctx.slots.inject('conversation.input.dock', () => ctx.slots.register(
           { name: 'conversation.input.dock', id: 'dsh-voice-rec', order: 0, locale: NS, label: () => t('recordSlot') },
-          (props) => React.createElement(RecordPill, { input: props.input, inputActions: props.inputActions, ctx: ctx }),
+          (props) => React.createElement(RecordPill, { input: props.input, inputActions: props.inputActions, session: props.session, ctx: ctx }),
         ))
         return () => {
           if (typeof offRight === 'function') offRight()
@@ -2728,6 +3127,93 @@ voice._chainsPromise = null
         ),
       )
     }
+// ------------------------------------------------------------------ 72-dictation-modes
+// Dictation modes configuration card and prompt template editors (#264)
+
+function DictationModesSection(props) {
+  const { t, draft, setTop, writable } = props
+  const prompts = (draft && draft.dictationPrompts) || {}
+  const currentMode = (draft && draft.dictationMode) || 'clean'
+
+  const setPrompt = (key, val) => {
+    const updated = { ...prompts, [key]: val }
+    setTop('dictationPrompts', updated)
+  }
+
+  const resetPrompts = () => {
+    setTop('dictationPrompts', { clean: '', task: '', note: '' })
+  }
+
+  return React.createElement('div', { className: 'cb-section-card' },
+    React.createElement('div', { className: 'cb-section-title' },
+      React.createElement('span', null, '🎙️ ' + t('dictationModeTitle')),
+    ),
+    React.createElement('div', { className: 'cb-field-desc' }, t('dictationModeDesc')),
+    React.createElement('div', { className: 'cb-grid-2', style: { marginTop: '8px' } },
+      ['clean', 'task', 'note', 'verbatim'].map((m) =>
+        React.createElement('label', { key: m, className: 'cb-check-label' },
+          React.createElement('input', {
+            type: 'radio',
+            name: 'dictationMode',
+            value: m,
+            checked: currentMode === m,
+            disabled: !writable,
+            onChange: () => setTop('dictationMode', m),
+          }),
+          getDictationModeLabel(m, t),
+        ),
+      ),
+    ),
+    React.createElement('div', { style: { marginTop: '12px', borderTop: '1px solid var(--dsw-alias-border-l1)', paddingTop: '10px' } },
+      React.createElement('div', { className: 'cb-section-title', style: { fontSize: '13px' } },
+        React.createElement('span', null, t('dictationPromptsTitle')),
+        React.createElement('button', {
+          type: 'button',
+          className: 'cb-btn cb-btn-secondary',
+          style: { fontSize: '11px', padding: '2px 8px' },
+          disabled: !writable,
+          onClick: resetPrompts,
+        }, t('resetPrompts')),
+      ),
+      React.createElement('div', { className: 'cb-field-desc' }, t('dictationPromptsDesc')),
+      React.createElement('div', { style: { display: 'flex', flexDirection: 'column', gap: '8px', marginTop: '8px' } },
+        React.createElement('div', null,
+          React.createElement('label', { className: 'cb-label' }, t('promptClean')),
+          React.createElement('textarea', {
+            className: 'cb-input',
+            style: { minHeight: '48px', resize: 'vertical' },
+            value: prompts.clean || '',
+            placeholder: 'Default: punctuation & filler-word cleanup',
+            disabled: !writable,
+            onChange: (e) => setPrompt('clean', e.target.value),
+          }),
+        ),
+        React.createElement('div', null,
+          React.createElement('label', { className: 'cb-label' }, t('promptTask')),
+          React.createElement('textarea', {
+            className: 'cb-input',
+            style: { minHeight: '48px', resize: 'vertical' },
+            value: prompts.task || '',
+            placeholder: 'Default: structured problem/outcome/constraints/criteria',
+            disabled: !writable,
+            onChange: (e) => setPrompt('task', e.target.value),
+          }),
+        ),
+        React.createElement('div', null,
+          React.createElement('label', { className: 'cb-label' }, t('promptNote')),
+          React.createElement('textarea', {
+            className: 'cb-input',
+            style: { minHeight: '48px', resize: 'vertical' },
+            value: prompts.note || '',
+            placeholder: 'Default: key points & action items summary',
+            disabled: !writable,
+            onChange: (e) => setPrompt('note', e.target.value),
+          }),
+        ),
+      ),
+    ),
+  )
+}
     // 5. Hardware & Audio Engines Card
     function HardwareOptionsCard(props) {
       const t = props.t || moduleT
@@ -3211,6 +3697,78 @@ voice._chainsPromise = null
         ),
       )
     }
+// ------------------------------------------------------------------ 72-macros
+// Voice action macros configuration card (#167)
+
+function MacrosSection(props) {
+  const { t, draft, setTop, writable } = props
+  const macros = Array.isArray(draft && draft.voiceMacros) ? draft.voiceMacros : []
+
+  const addMacro = () => {
+    const next = [...macros, { trigger: '', template: '' }]
+    setTop('voiceMacros', next)
+  }
+
+  const updateMacro = (idx, field, val) => {
+    const next = macros.map((item, i) => (i === idx ? { ...item, [field]: val } : item))
+    setTop('voiceMacros', next)
+  }
+
+  const removeMacro = (idx) => {
+    const next = macros.filter((_, i) => i !== idx)
+    setTop('voiceMacros', next)
+  }
+
+  return React.createElement('div', { className: 'cb-section-card' },
+    React.createElement('div', { className: 'cb-section-title' },
+      React.createElement('span', null, '⚡ ' + t('voiceMacrosTitle')),
+      React.createElement('button', {
+        type: 'button',
+        className: 'cb-btn cb-btn-secondary',
+        style: { fontSize: '11px', padding: '2px 8px' },
+        disabled: !writable,
+        onClick: addMacro,
+      }, '+ ' + t('addMacro')),
+    ),
+    React.createElement('div', { className: 'cb-field-desc' }, t('voiceMacrosDesc')),
+    macros.length === 0
+      ? React.createElement('div', { style: { fontStyle: 'italic', color: 'var(--dsw-alias-label-tertiary)', fontSize: '12px', marginTop: '6px' } },
+          'No macros configured.',
+        )
+      : React.createElement('div', { style: { display: 'flex', flexDirection: 'column', gap: '8px', marginTop: '6px' } },
+          macros.map((m, idx) =>
+            React.createElement('div', { key: idx, className: 'dvo-macro-item' },
+              React.createElement('div', { style: { display: 'flex', gap: '8px', alignItems: 'center' } },
+                React.createElement('input', {
+                  type: 'text',
+                  className: 'cb-input',
+                  style: { flex: '1', height: '28px', fontSize: '12px' },
+                  placeholder: t('macroTrigger'),
+                  value: m.trigger || '',
+                  disabled: !writable,
+                  onChange: (e) => updateMacro(idx, 'trigger', e.target.value),
+                }),
+                React.createElement('button', {
+                  type: 'button',
+                  className: 'cb-btn cb-btn-secondary',
+                  style: { padding: '2px 6px', fontSize: '11px', color: 'var(--dsw-alias-state-error-primary)' },
+                  disabled: !writable,
+                  onClick: () => removeMacro(idx),
+                }, t('macroDelete')),
+              ),
+              React.createElement('textarea', {
+                className: 'cb-input',
+                style: { minHeight: '38px', resize: 'vertical', fontSize: '12px' },
+                placeholder: t('macroTemplate') + ' (use {text} for argument)',
+                value: m.template || '',
+                disabled: !writable,
+                onChange: (e) => updateMacro(idx, 'template', e.target.value),
+              }),
+            ),
+          ),
+        ),
+  )
+}
     // SenseVoice Local ASR (1-Click Setup)
     function SensevoiceSection(props) {
       const t = props.t || moduleT
@@ -3364,7 +3922,6 @@ voice._chainsPromise = null
       const [serverConfig, setServerConfig] = React.useState(null)
       const [configLoading, setConfigLoading] = React.useState(true)
       const [revision, setRevision] = React.useState(null)
-
       React.useEffect(() => {
         let alive = true
         fetch('/dsh-voice/config', { cache: 'no-store' })
@@ -3382,7 +3939,6 @@ voice._chainsPromise = null
           })
         return () => { alive = false }
       }, [])
-
       // Hotkey picker: not a name field — press the key you want.
       const [catching, setCatching] = React.useState(false)
       const [jargonInput, setJargonInput] = React.useState(null)
@@ -3405,7 +3961,6 @@ voice._chainsPromise = null
         document.addEventListener('keydown', onKey, true)
         return () => document.removeEventListener('keydown', onKey, true)
       }, [catching, ctx])
-
       React.useEffect(() => {
         let alive = true
         const render = () => { if (alive && scope && typeof scope.getSnapshot === 'function') setSnap(scope.getSnapshot()) }
@@ -3413,7 +3968,6 @@ voice._chainsPromise = null
         const off = (scope && typeof scope.subscribe === 'function') ? scope.subscribe(render) : () => {}
         return () => { alive = false; off() }
       }, [scope])
-
       const [devices, setDevices] = React.useState([])
       React.useEffect(() => {
         if (!navigator.mediaDevices || !navigator.mediaDevices.enumerateDevices) return
@@ -3421,11 +3975,9 @@ voice._chainsPromise = null
           .then((list) => setDevices(list.filter((d) => d.kind === 'audioinput')))
           .catch(() => {})
       }, [])
-
       const ready = !!serverConfig || (!!snap && snap.status === 'ready')
       const value = (snap && snap.status === 'ready' && snap.value) ? snap.value : (serverConfig || {})
       const writable = ready
-
       React.useEffect(() => {
         if (ready) return undefined
         let tries = 0
@@ -3442,14 +3994,12 @@ voice._chainsPromise = null
         }, 1000)
         return () => clearInterval(timer)
       }, [ready])
-
       const deepClone = (obj) => {
         if (typeof structuredClone === 'function') {
           try { return structuredClone(obj) } catch (e) { /* fallback */ }
         }
         try { return JSON.parse(JSON.stringify(obj)) } catch (e) { return Object.assign({}, obj) }
       }
-
       const setTop = (key, val) => {
         setDraft((d) => Object.assign({}, d || {}, { [key]: val }))
       }
@@ -3470,9 +4020,7 @@ voice._chainsPromise = null
         }),
         hint ? React.createElement('span', { className: 'dvs-sub' }, hint) : null,
       )
-
       React.useEffect(() => { if (ready && draft === null) setDraft(deepClone(value)) }, [ready, draft, value])
-
       React.useEffect(() => {
         if (!ready) return
         const val = value || {}
@@ -3491,6 +4039,7 @@ voice._chainsPromise = null
           wakeWord: String(val.wakeWord || ''),
           bargeIn: !!val.bargeIn,
           polishSend: !!(val.message && val.message.polishSend),
+          editablePreview: val.message ? val.message.editablePreview !== false : true,
           sessionCommands: !!(val.message && val.message.sessionCommands),
           polishBaseUrl: String(val.polishBaseUrl || ''),
           noiseSuppression: val.noiseSuppression !== false,
@@ -3503,10 +4052,12 @@ voice._chainsPromise = null
           techJargonCorrection: val.techJargonCorrection !== false,
           liveInterimPreview: val.liveInterimPreview !== false,
           structuredPromptVoice: val.structuredPromptVoice !== false,
+          dictationMode: val.dictationMode || 'clean',
+          dictationPrompts: val.dictationPrompts || {},
+          voiceMacros: Array.isArray(val.voiceMacros) ? val.voiceMacros : [],
           webgpuModel: String(val.webgpuModel || (voice.settings && voice.settings.webgpuModel) || 'onnx-community/whisper-tiny'),
         })
       }, [ready, value])
-
       const [statusData, setStatusData] = React.useState(null)
       const [statusLatency, setStatusLatency] = React.useState(null)
       const fetchStatus = React.useCallback(() => {
@@ -3530,17 +4081,12 @@ voice._chainsPromise = null
             setStatusLatency(null)
           })
       }, [])
-
       React.useEffect(() => {
         fetchStatus()
       }, [fetchStatus])
-
       const { sensevoiceState, installingSensevoice, triggerInstallSensevoice } = useSensevoiceInstaller(fetchStatus)
-
       const { testingMic, testLevel, toggleTestMic, gateDbVal, gateThresholdPercent } = useMicTester(draft, value, setErr)
-
       const { updaterStatus, updating, updaterMsg, updaterMsgKind, updaterLoading, checkUpdater, onUpdateNow } = usePluginUpdater()
-
       const save = async () => {
         setErr(''); setSaved(false)
         if (!draft) return
@@ -3559,7 +4105,6 @@ voice._chainsPromise = null
             .filter(Boolean)
           draft.jargonDictionary = parsed
         }
-
         let httpOk = false
         let httpError = null
         try {
@@ -3581,7 +4126,6 @@ voice._chainsPromise = null
         } catch (e) {
           httpError = e?.message || String(e)
         }
-
         if (httpOk && scope && typeof scope.set === 'function') {
           for (const k of Object.keys(draft)) {
             try {
@@ -3591,12 +4135,10 @@ voice._chainsPromise = null
             }
           }
         }
-
         if (!httpOk) {
           setErr(t('saveFailed') + ': ' + httpError)
           return
         }
-
         const d = draft || {}
         voice.hotkey = d.hotkey || ''
         if (voice.hotkey) {
@@ -3628,23 +4170,19 @@ voice._chainsPromise = null
           structuredPromptVoice: d.structuredPromptVoice !== false,
         })
         try { window.dispatchEvent(new CustomEvent('dsh-voice:settings-saved')) } catch (noEvents) { /* nobody */ }
-
         setSaved(true); setJargonInput(null)
         setTimeout(() => setSaved(false), 2000)
         fetchStatus()
       }
-
       const modeVal = (mode, key, fallback) => {
         const m = draft && draft[mode]
         return m && m[key] !== undefined ? m[key] : fallback
       }
-
       const chainOptions = BUILTIN.concat(
         (draft && Array.isArray(draft.customProviders) ? draft.customProviders : [])
           .map((c) => String(c && c.key || '').trim())
           .filter((k) => k && BUILTIN.indexOf(k) < 0),
       )
-
       const langField = (mode) => {
         const val = modeVal(mode, 'language', '')
         const opts = SUPPORTED_LANGS.slice()
@@ -3661,7 +4199,6 @@ voice._chainsPromise = null
           ))),
         )
       }
-
       const numField = (mode, key, label, hint) => React.createElement('div', { className: 'cb-field' },
         React.createElement('label', null, label),
         React.createElement('input', {
@@ -3670,15 +4207,11 @@ voice._chainsPromise = null
         }),
         React.createElement('span', { className: 'dvs-sub' }, hint),
       )
-
-
       const statsData = (statusData && statusData.providerStats) || {}
       const hostOnline = statusLatency !== null
       const whisperRunning = !!(statusData && statusData.whisperRunning)
       const providerCount = (statusData && Array.isArray(statusData.providers)) ? statusData.providers.length : chainOptions.length
-
       return React.createElement('div', { className: 'cb-page dvo-settings-root' },
-        // 1. Connection & Engine Status Card
         React.createElement(ConnectionStatusCard, {
           t: t,
           hostOnline: hostOnline,
@@ -3687,8 +4220,6 @@ voice._chainsPromise = null
           providerCount: providerCount,
           onRefresh: fetchStatus,
         }),
-
-        // 2. Dictation Mode Card
         React.createElement('div', { className: 'cb-section-card' },
           React.createElement('div', { className: 'cb-section-title' },
             React.createElement('span', null, '🎙️ ' + t('dictationBtn')),
@@ -3732,8 +4263,6 @@ voice._chainsPromise = null
           ),
           textField('wakeWord', t('wakeWord'), t('wakeWordHint')),
         ),
-
-        // 3. Voice Message Card
         React.createElement('div', { className: 'cb-section-card' },
           React.createElement('div', { className: 'cb-section-title' },
             React.createElement('span', null, '💬 ' + t('messageTitle')),
@@ -3772,8 +4301,6 @@ voice._chainsPromise = null
             ),
           ),
         ),
-
-        // 4. Custom Providers Card
         React.createElement('div', { className: 'cb-section-card' },
           React.createElement('div', { className: 'cb-section-title' },
             React.createElement('span', null, '⚙️ ' + t('customTitle')),
@@ -3785,8 +4312,6 @@ voice._chainsPromise = null
             onChange: (v) => setTop('customProviders', v),
           }),
         ),
-
-        // 5. Hardware & Audio Engines Card
         React.createElement(HardwareOptionsCard, {
           t: t,
           draft: draft,
@@ -3806,8 +4331,6 @@ voice._chainsPromise = null
             clearGlobalHotkey()
           },
         }),
-
-        // 6. SenseVoice Local ASR (1-Click Setup)
         React.createElement(SensevoiceSection, {
           t: t,
           sensevoiceState: sensevoiceState,
@@ -3815,8 +4338,6 @@ voice._chainsPromise = null
           writable: writable,
           onInstall: triggerInstallSensevoice,
         }),
-
-        // 7. Turn-Taking & Audio Coordination
         React.createElement('div', { className: 'cb-section-card' },
           React.createElement('div', { className: 'cb-section-title' },
             React.createElement('span', null, '🎙️ ' + t('turnTakingTitle')),
@@ -3843,8 +4364,6 @@ voice._chainsPromise = null
             ),
           ),
         ),
-
-        // 8. Hands-free & Smart Actions
         React.createElement('div', { className: 'cb-section-card' },
           React.createElement('div', { className: 'cb-section-title' },
             React.createElement('span', null, '✨ ' + t('smartActionsTitle')),
@@ -3888,8 +4407,20 @@ voice._chainsPromise = null
             ),
           ),
         ),
-
-        // 9. Developer Lexicon & IT Jargon
+        // Dictation Modes & Prompts (#264)
+        React.createElement(DictationModesSection, {
+          t: t,
+          draft: draft,
+          setTop: setTop,
+          writable: writable,
+        }),
+        // Voice Action Macros (#167)
+        React.createElement(MacrosSection, {
+          t: t,
+          draft: draft,
+          setTop: setTop,
+          writable: writable,
+        }),
         React.createElement(JargonEditor, {
           t: t,
           draft: draft,
@@ -3898,15 +4429,11 @@ voice._chainsPromise = null
           jargonInput: jargonInput,
           setJargonInput: setJargonInput,
         }),
-
-        // 10. Provider Telemetry & Latency Dashboard
         React.createElement(ProviderDashboard, {
           t: t,
           statsData: statsData,
           onRefresh: fetchStatus,
         }),
-
-        // 7. Plugin Version & Updates Card
         React.createElement(UpdaterCard, {
           t: t,
           updaterStatus: updaterStatus,
@@ -3917,8 +4444,6 @@ voice._chainsPromise = null
           onCheck: checkUpdater,
           onUpdateNow: onUpdateNow,
         }),
-
-        // Action bar (Save)
         React.createElement('div', { className: 'cb-row' },
           React.createElement('button', { type: 'button', className: 'cb-btn cb-btn-primary', disabled: !writable, onClick: save }, t('save')),
           saved ? React.createElement('span', { className: 'dvs-ok' }, t('saved')) : null,
@@ -4031,6 +4556,9 @@ voice._chainsPromise = null
       isAllowedInEditable,
       isHotkeyRelease,
       extractContextKeywords,
+      DICTATION_MODES,
+      getDictationModeLabel,
+      cycleDictationMode,
       resolveBrowserRecognitionLang,
       VoiceSection,
       cutPhrase,
@@ -4041,6 +4569,12 @@ voice._chainsPromise = null
       cancelCurrent,
       stopCurrent,
       submitPending,
+      cancelPending,
+      keepPending,
+      initPendingPreview,
+      cancelPendingPreview,
+      keepPendingPreview,
+      submitPendingPreview,
       loadWebGpuWhisper,
       isWebGpuSupported,
       isWasmSupported,