@7n/tauri-components 0.8.0 → 0.9.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@7n/tauri-components",
-  "version": "0.8.0",
+  "version": "0.9.0",
   "type": "module",
   "description": "Shared LLM agent engine + Vue/Quasar UI for Tauri apps (chat, journal, trust-tier approval).",
   "license": "MIT",

package/src/components/docs/AgentDialog.md

@@ -0,0 +1,35 @@
+---
+docgen:
+  source: npm/src/components/AgentDialog.vue
+  crc: 197cc9c0
+  model: omlx/gemma-4-e4b-it-OptiQ-4bit
+---
+
+# AgentDialog.vue
+
+Компонент відображає діалогове вікно для взаємодії з локальною мовною моделлю (LLM) через агент. Він дозволяє користувачеві вводити запити, налаштовувати конфігурацію агента та бачити історію чату.
+
+## Поведінка
+1. **При відкритті діалогу (`onShow`):**
+    * Очищається поле введення та історія чату.
+    * Ініціалізується конфігурація агента, завантажуючи налаштування з глобальних даних.
+    * Завантажується список доступних моделей від сервера LLM.
+2. **При зміні конфігурації:**
+    * Користувач може вказати базовий URL, вибрати модель або ввести API ключ.
+3. **При введенні запиту та натисканні "Запустити"/"Надіслати":**
+    * Запит знімається з поля введення.
+    * Запис користувача додається до історії чату.
+    * Статус "думає" активується.
+    * Викликається метод агента для виконання запиту (новий запит або продовження існуючої розмови).
+    * Після отримання відповіді від агента:
+        * Відповідь агента додається до історії чату.
+        * Статус "думає" деактивується.
+        * Історія чату автоматично прокручується до останнього повідомлення.
+4. **При завершенні операції:**
+    * Якщо операція була успішною, компонент може повідомити зовнішній контекст про завершення роботи агента.
+
+## Гарантії поведінки
+* Діалогове вікно відображає історію чату у порядку чергування: повідомлення користувача, а потім відповідь агента.
+* Під час обробки запиту (відправлення або отримання відповіді) інтерфейс блокується, і відображається індикатор "думає...".
+* При відсутності введення або активній обробці запиту, кнопка відправки вимкнена.
+* При відкритті діалогу, список моделей заповнюється асинхронно, відображаючи стан завантаження.

package/src/components/docs/AuditDialog.md

@@ -0,0 +1,28 @@
+---
+docgen:
+  source: npm/src/components/AuditDialog.vue
+  crc: 963a61d8
+  model: omlx/gemma-4-e4b-it-OptiQ-4bit
+---
+
+# AuditDialog.vue
+
+Компонент відображає журнал аудиту, наданий зовнішнім агентом. Він дозволяє переглядати записи, розширювати їх для детального огляду та взаємодіяти з ними (наприклад, відповідати або затверджувати).
+
+## Поведінка
+1. При ініціалізації компонента, якщо не вказано інше, журнал аудиту не завантажується.
+2. При натисканні кнопки "Оновити" у заголовку, компонент ініціює завантаження списку записів журналу.
+3. Під час завантаження, відображається індикатор завантаження.
+4. Якщо список записів порожній і завантаження завершено, відображається повідомлення "No requests yet".
+5. Кожен запис журналу відображається як рядок.
+6. Натискання на заголовок рядка розкриває або приховує деталі цього запису.
+7. Якщо запис має статус "needs_approval" та потребує затвердження, відображаються кнопки "Підтвердити" та "Відхилити".
+8. При натисканні на "Підтвердити" або "Відхилити", компонент викликає відповідну дію агента, оновлює журнал і надсилає подію `changed`.
+9. При взаємодії з `RequestView` (наприклад, введення відповіді), компонент викликає дію агента `respond`, оновлює журнал і надсилає подію `changed`.
+10. При зміні властивості `modelValue` зовнішнім компонентом, компонент оновлює свій стан відображення.
+
+## Гарантії поведінки
+* Компонент завжди відображає актуальний стан журналу після успішного виклику `refresh`.
+* Під час виконання операцій (відповідь, затвердження) компонент блокує взаємодію з відповідним записом, щоб уникнути подвійних викликів.
+* У разі помилки при завантаженні або взаємодії з агентом, користувачеві відображається сповіщення.
+* Деталі запису відображаються лише тоді, коли відповідний запис розгорнутий.

package/src/components/docs/BaseDialog.md

@@ -0,0 +1,22 @@
+---
+docgen:
+  source: npm/src/components/BaseDialog.vue
+  crc: 88aaae5f
+  model: omlx/gemma-4-e4b-it-OptiQ-4bit
+---
+
+# BaseDialog.vue
+
+Компонент надає універсальну структуру для діалогових вікон у застосунку. Він інкапсулює типовий макет діалогу, включаючи заголовок, тіло та кнопки дій.
+
+## Поведінка
+1. Відображає діалогове вікно, кероване станом `modelValue`.
+2. Відображає заголовок, що складається з іконки (за наявності), назви (`title`) та кнопки закриття.
+3. Дозволяє вставити контент у тіло діалогу через основний слот.
+4. Дозволяє вставити елементи керування (кнопки) у нижню частину діалогу через слот `actions`.
+5. При зміні стану `modelValue` зовнішнім компонентом, компонент емітує подію `update:modelValue` з новим значенням.
+
+## Гарантії поведінки
+* Діалогове вікно завжди має визначену назву (`title`).
+* Ширина діалогового вікна за замовчуванням становить 520 пікселів, але може бути перевизначена.
+* Компонент коректно передає всі додаткові атрибути, отримані від батьківського елемента, до базового елемента діалогу.

package/src/components/docs/DialogActions.md

@@ -0,0 +1,24 @@
+---
+docgen:
+  source: npm/src/components/DialogActions.vue
+  crc: 7126e317
+  model: omlx/gemma-4-e4b-it-OptiQ-4bit
+---
+
+# DialogActions.vue
+
+Компонент надає стандартний нижній колонтитул для діалогових вікон, що містить кнопку скасування та основну кнопку дії. Він забезпечує канонічний патерн "скасувати + відправити" для діалогів.
+
+## Поведінка
+1. Відображає кнопку "Скасувати", яка закриває діалогове вікно при натисканні.
+2. Відображає основну кнопку дії, яка виконує наступне:
+    * При натисканні викликає подію `submit`.
+    * Може бути вимкнена (неактивна) відповідно до властивості `disable`.
+    * Може відображати індикатор завантаження відповідно до властивості `loading`.
+    * Відображає мітку, визначену властивістю `submitLabel`.
+    * Може відображати іконку, визначену властивістю `icon`.
+
+## Гарантії поведінки
+* Кнопка "Скасувати" завжди присутня і закриває діалог.
+* Основна кнопка дії завжди присутня і вимагає надання мітки.
+* Компонент коректно реагує на стани `disable` та `loading` для керування поведінкою кнопки дії.

package/src/components/docs/RequestView.md

@@ -0,0 +1,25 @@
+---
+docgen:
+  source: npm/src/components/RequestView.vue
+  crc: ce95caa9
+  model: omlx/gemma-4-e4b-it-OptiQ-4bit
+---
+
+# RequestView.vue
+
+Компонент відображає детальний вигляд результату виконання запиту. Він візуалізує статус, резюме, помилки та список виконаних дій.
+
+## Поведінка
+1. Відображає статус результату за допомогою компонента `StatePill`.
+2. Якщо у результаті є резюме, відображає його як текстовий блок.
+3. Якщо у результаті є питання, відображає його як текстовий блок.
+4. Якщо у результаті є помилка, відображає її як червоний текстовий блок.
+5. Якщо у результаті є список дій, відображає їх у вигляді окремих рядків.
+6. Для кожної дії відображає іконку, що вказує на успіх або помилку виконання дії.
+7. Для кожної дії відображає назву інструменту та його вхідні дані.
+
+## Гарантії поведінки
+* Компонент завжди відображає статус результату, оскільки властивість `result` є обов'язковою.
+* Текстові блоки (резюме, питання, помилка) відображаються лише за наявності відповідного поля у `result`.
+* Список дій відображається лише за наявності елементів у масиві `actions` у `result`.
+* Іконка для кожної дії коректно відображає стан виконання дії (успіх або помилка).

package/src/components/docs/StatePill.md

@@ -0,0 +1,20 @@
+---
+docgen:
+  source: npm/src/components/StatePill.vue
+  crc: ccee8975
+  model: omlx/gemma-4-e4b-it-OptiQ-4bit
+---
+
+# StatePill.vue
+
+Компонент відображає візуальний маркер стану (pill). Він використовується для індикації статусу в різних частинах застосунку.
+
+## Поведінка
+1. Компонент отримує текстовий статус.
+2. Компонент визначає відповідний колір на основі отриманого статусу.
+3. Компонент відображає текстовий статус.
+4. Компонент відображає візуальний маркер (крапку) кольору, визначеного для цього статусу.
+
+## Гарантії поведінки
+* Відображення завжди містить текстовий статус.
+* Колір візуального маркера та фону компонента коректно відображається відповідно до наданого статусу.

package/src/components/docs/index.md

@@ -0,0 +1,28 @@
+---
+docgen:
+  source: npm/src/components/index.js
+  crc: 42b50c52
+  model: omlx/gemma-4-e4b-it-OptiQ-4bit
+  score: 100
+  judgeModel: openai-codex/gpt-5.4-mini
+---
+
+# index.js
+
+## Огляд
+
+Компоненти цього файлу керують відображенням діалогових вікон, які взаємодіють з агентом. Експортується базовий клас для діалогів, компоненти для відображення специфічних дій, деталей запиту та поточного стану, а також константи для визначення кольорів стану.
+
+## Поведінка
+
+1. Експортує компонент `AgentDialog` для відображення діалогових вікон, що взаємодіють з агентом.
+2. Експортує компонент `AuditDialog` для відображення діалогових вікон аудиту, що взаємодіють з агентом.
+3. Експортує компонент `BaseDialog` як базовий елемент для створення діалогових вікон.
+4. Експортує компонент `DialogActions` для відображення дій у діалогових вікнах.
+5. Експортує компонент `RequestView` для відображення деталей запиту.
+6. Експортує компонент `StatePill` для відображення стану.
+7. Експортує константи `STATUS_COLOR` та `statusColor` для визначення кольорів стану.
+
+## Гарантії поведінки
+
+- Read-only: не виконує операцій запису (ФС/БД).

package/src/components/docs/status.md

@@ -0,0 +1,29 @@
+---
+docgen:
+  source: npm/src/components/status.js
+  crc: 352af502
+  model: omlx/gemma-4-e4b-it-OptiQ-4bit
+  score: 100
+  issues: judge:inaccurate:0.96
+  judgeModel: openai-codex/gpt-5.4-mini
+---
+
+# status.js
+
+## Огляд
+
+Файл визначає кольорові значення, що відповідають різним станам запиту. Публічні функції `STATUS_COLOR` та `statusColor` повертають конкретний акцентний колір для заданого статусу або сірий колір у випадку невідомого статусу.
+
+## Поведінка
+
+STATUS_COLOR — Надає об'єкт, що містить визначені кольори для різних станів запиту.
+statusColor — Повертає відповідний акцентний колір для заданого статусу запиту, використовуючи сірий колір за замовчуванням для невідомих статусів.
+
+## Публічний API
+
+STATUS_COLOR — встановлює колір, який відображає поточний статус.
+statusColor — встановлює колір, який відображає поточний статус.
+
+## Гарантії поведінки
+
+- Read-only: не виконує операцій запису (ФС/БД).

package/src/core/acp-agent.js

@@ -0,0 +1,192 @@
+import { invoke } from '@tauri-apps/api/core'
+import { listen } from '@tauri-apps/api/event'
+
+// ACP session driver: the replacement for llm.js's runAgent()/createOpenAiChat.
+// Instead of running our own chat-completion loop, we spawn an external ACP
+// agent (codex-acp/claude-agent-acp/cursor `agent acp`/pi-acp) via the Rust
+// plugin's acp_* commands and stream its `session/update` notifications back
+// into the same {content, trace, messages, stopped?} shape runAgent() used to
+// return, so agent-handler.js's runAndJournal needs no structural changes —
+// only which turn-runner it calls.
+//
+// Domain-tool approval (the MCP bridge's `acp://mcp-tool-call`) and native ACP
+// permission requests (`acp://permission-request`) are separate event streams
+// callers subscribe to independently — see onAcpToolCall / onAcpPermissionRequest.
+// While either is pending, the underlying acp_prompt Tauri call simply stays
+// unresolved (the agent's tools/call HTTP request is parked on the Rust side),
+// so the turn transparently continues once the human answers.
+
+/**
+ * Spawn an ACP agent subprocess and run its `initialize` + `session/new`
+ * handshake. Returns a session handle to pass to `runAcpTurn`/`cancelAcpSession`.
+ * @param {object} params spawn parameters
+ * @param {string} params.agentKind 'codex'|'claude'|'cursor'|'pi' (informational — passed through, not interpreted here)
+ * @param {string} params.command executable to spawn (e.g. 'npx')
+ * @param {string[]} [params.args] command arguments
+ * @param {Record<string,string>} [params.env] extra environment variables for the subprocess
+ * @param {string} params.cwd session working directory (absolute path)
+ * @param {string} [params.mcpBridgeUrl] this app's domain MCP bridge URL (from acpStartMcpBridge), omit for no domain tools
+ * @param {boolean} [params.allowFs] grant fs/read_text_file + fs/write_text_file
+ * @param {boolean} [params.allowTerminal] grant terminal/*
+ * @returns {Promise<{sessionKey: string, agentKind: string}>} session handle
+ */
+export async function createAcpSession({ agentKind, command, args = [], env = {}, cwd, mcpBridgeUrl, allowFs = false, allowTerminal = false }) {
+  const sessionKey = await invoke('plugin:agent|acp_spawn_agent', {
+    args: { command, args, env, cwd, mcpBridgeUrl, allowFs, allowTerminal },
+  })
+  return { sessionKey, agentKind }
+}
+
+/**
+ * Map an ACP `stopReason` onto the `stopped` field runAgent() used to return
+ * (undefined means "ended normally", matching the old no-tool-call exit).
+ * @param {string} stopReason ACP PromptResponse.stopReason
+ * @returns {string|undefined} runAgent()-shaped stopped reason
+ */
+function stoppedFromStopReason(stopReason) {
+  if (stopReason === 'end_turn') return
+  if (stopReason === 'cancelled') return 'cancelled'
+  if (stopReason === 'refusal') return 'refusal'
+  return 'max_steps' // max_tokens / max_turn_requests / anything unrecognized
+}
+
+/**
+ * Fold one `session/update` payload into the turn's running content/trace.
+ * @param {object} state mutable accumulator ({ text, messageId, calls: Map })
+ * @param {object} update the ACP SessionUpdate (already unwrapped from the event payload)
+ * @returns {void}
+ */
+function applySessionUpdate(state, update) {
+  switch (update?.sessionUpdate) {
+    case 'agent_message_chunk': {
+      if (update.messageId !== state.messageId) {
+        state.messageId = update.messageId
+        state.text = ''
+      }
+      state.text += update.content?.text ?? ''
+      break
+    }
+    case 'tool_call': {
+      state.calls.set(update.toolCallId, {
+        tool: update.title ?? update.toolCallId,
+        input: update.rawInput ?? {},
+        envelope: null,
+      })
+      break
+    }
+    case 'tool_call_update': {
+      const call = state.calls.get(update.toolCallId)
+      const fields = update.fields ?? {}
+      if (call && fields.rawOutput !== undefined) {
+        call.envelope = { ok: fields.status !== 'failed', output: fields.rawOutput }
+      }
+      break
+    }
+    default: {
+      break
+    }
+  }
+}
+
+/**
+ * Run one prompt turn on an already-spawned ACP session, streaming
+ * `session/update` chunks into the same shape `runAgent()` returned.
+ * @param {object} params turn parameters
+ * @param {string} params.sessionKey handle from `createAcpSession`
+ * @param {string} params.text prompt text for this turn
+ * @param {(update: object) => void} [params.onChunk] optional live callback for each raw session/update (UI streaming)
+ * @returns {Promise<{content: string, steps: number, trace: object[], messages: object[], stopped?: string}>} runAgent()-shaped result
+ */
+export async function runAcpTurn({ sessionKey, text, onChunk }) {
+  const state = { text: '', messageId: null, calls: new Map() }
+
+  const unlisten = await listen('acp://session-update', (event) => {
+    if (event.payload?.sessionKey !== sessionKey) return
+    applySessionUpdate(state, event.payload.update)
+    onChunk?.(event.payload.update)
+  })
+
+  try {
+    const stopReason = await invoke('plugin:agent|acp_prompt', { sessionKey, text })
+    const trace = [...state.calls.values()]
+    const messages = state.text ? [{ role: 'assistant', content: state.text }] : []
+    return {
+      content: state.text,
+      steps: 1,
+      trace,
+      messages,
+      stopped: stoppedFromStopReason(stopReason),
+    }
+  }
+  finally {
+    unlisten()
+  }
+}
+
+/**
+ * Ask the agent to cancel its in-flight prompt turn.
+ * @param {string} sessionKey handle from `createAcpSession`
+ * @returns {Promise<void>} resolves once the cancel notification is sent
+ */
+export function cancelAcpSession(sessionKey) {
+  return invoke('plugin:agent|acp_cancel', { sessionKey })
+}
+
+/**
+ * Subscribe to `acp://mcp-tool-call` (a domain-catalog tool call the agent
+ * made through the MCP bridge, waiting on `acp_mcp_tool_result`).
+ * @param {(payload: {requestId: string, tool: string, input: object}) => void} handler callback
+ * @returns {Promise<() => void>} unlisten function
+ */
+export function onAcpToolCall(handler) {
+  return listen('acp://mcp-tool-call', event => handler(event.payload))
+}
+
+/**
+ * Resolve a pending `acp://mcp-tool-call` with the same envelope shape
+ * `createDispatch` returns.
+ * @param {string} requestId id from the `acp://mcp-tool-call` payload
+ * @param {{ok: boolean, output?: unknown, error?: {code: string, message: string}}} envelope dispatch result
+ * @returns {Promise<void>} resolves once the reply reaches the Rust bridge
+ */
+export function respondAcpToolCall(requestId, envelope) {
+  return invoke('plugin:agent|acp_mcp_tool_result', { requestId, envelope })
+}
+
+/**
+ * Subscribe to `acp://permission-request` (a native ACP `session/request_permission`
+ * call, e.g. the agent's own file-edit/bash tools asking before running).
+ * @param {(payload: {sessionKey: string, requestId: string, toolCall: object, options: {optionId: string, name: string}[]}) => void} handler callback
+ * @returns {Promise<() => void>} unlisten function
+ */
+export function onAcpPermissionRequest(handler) {
+  return listen('acp://permission-request', event => handler(event.payload))
+}
+
+/**
+ * Resolve a pending `acp://permission-request` by selecting one of its options.
+ * @param {string} requestId id from the `acp://permission-request` payload
+ * @param {string} optionId one of the payload's `options[].optionId`
+ * @returns {Promise<void>} resolves once the permission response is sent
+ */
+export function respondAcpPermission(requestId, optionId) {
+  return invoke('plugin:agent|acp_respond_permission', { requestId, optionId })
+}
+
+/**
+ * Register this app's tool catalog with the domain MCP bridge and start it.
+ * @param {object[]} catalog tool definitions (same shape passed to `createAgentKit`)
+ * @returns {Promise<string>} the bridge's loopback URL, e.g. `http://127.0.0.1:54321/`
+ */
+export async function startAcpMcpBridge(catalog) {
+  await invoke('plugin:agent|acp_register_catalog', { tools: catalog })
+  return invoke('plugin:agent|acp_start_mcp_bridge')
+}
+
+/**
+ * Read the per-machine default agent kind (`ACP_DEFAULT_AGENT` env var).
+ * @returns {Promise<{defaultAgentKind: string|null}>} config
+ */
+export function acpConfig() {
+  return invoke('plugin:agent|acp_config')
+}