@agentproto/apps 0.4.0 → 0.5.0

package/dist/mail-triage.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/mail-triage/agents/triager.ts","../src/mail-triage/workflows/triage-inbox.ts","../src/mail-triage/index.ts"],"names":[],"mappings":";;;;;;;;;AAIO,IAAM,OAAA,GAAsB;AAAA,EACjC,OAAO,WAAA,CAAY;AAAA,IACjB,MAAA,EAAQ,UAAA;AAAA,IACR,EAAA,EAAI,qBAAA;AAAA,IACJ,WAAA,EAAa,6EAAA;AAAA,IACb,KAAA,EAAO,iBAAA;AAAA,IACP,UAAA,EAAY;AAAA,MACV,6CAAA;AAAA,MACA,uDAAA;AAAA,MACA;AAAA,KACF;AAAA,IACA,KAAA,EAAO;AAAA,MACL,cAAA;AAAA,MACA,gBAAA;AAAA,MACA,sBAAA;AAAA,MACA,oBAAA;AAAA,MACA,qBAAA;AAAA,MACA,sBAAA;AAAA,MACA,qBAAA;AAAA,MACA;AAAA,KACF;AAAA,IACA,SAAA,EAAW,CAAC,EAAE,GAAA,EAAK,gBAAgB;AAAA,GACpC,CAAA;AAAA,EACD,IAAA,EACE;AAKJ;AC9BO,IAAM,cAAc,cAAA,CAAe;AAAA,EACxC,EAAA,EAAI,cAAA;AAAA,EACJ,IAAA,EAAM,cAAA;AAAA,EACN,WAAA,EAAa,uEAAA;AAAA,EACb,OAAA,EAAS,OAAA;AAAA,EACT,QAAQ,EAAC;AAAA,EACT,SAAS,EAAC;AAAA,EACV,KAAA,EAAO;AAAA,IACL;AAAA,MACE,EAAA,EAAI,QAAA;AAAA,MACJ,IAAA,EAAM,OAAA;AAAA,MACN,KAAA,EAAO,EAAE,GAAA,EAAK,qBAAA,EAAsB;AAAA,MACpC,MAAA,EACE;AAAA;AAIJ;AAEJ,CAAC;;;ACVM,IAAM,aAAwB,SAAA,CAAU;AAAA,EAC7C,MAAA,EAAQ,CAAC,OAAO,CAAA;AAAA,EAChB,SAAA,EAAW,CAAC,WAAW;AACzB,CAAC","file":"mail-triage.mjs","sourcesContent":["import { defineAgent } from \"@agentproto/agent\"\nimport type { AgentEntry } from \"@agentproto/app-kit\"\n\n/** Triages your inbox — finds unread mail, categorizes, labels, archives. */\nexport const triager: AgentEntry = {\n  agent: defineAgent({\n    schema: \"agent/v1\",\n    id: \"@agentproto/triager\",\n    description: \"Triages your inbox — finds unread mail, categorizes, labels, archives.\",\n    model: \"claude-sonnet-5\",\n    boundaries: [\n      \"Always show the triage plan before applying\",\n      \"Never delete — only archive, label, or mark read\",\n      \"Ask before applying bulk actions on more than 20 messages\",\n    ],\n    tools: [\n      \"mailbox_list\",\n      \"mailbox_search\",\n      \"mailbox_list_threads\",\n      \"mailbox_get_thread\",\n      \"mailbox_labels_list\",\n      \"mailbox_label_create\",\n      \"mailbox_triage_plan\",\n      \"mailbox_triage_apply\",\n    ],\n    workflows: [{ ref: \"triage-inbox\" }],\n  }),\n  body:\n    \"You scan the inbox for unread messages using mailbox_search. Categorize them \" +\n    \"(urgent, needs-reply, newsletter, notification, spam). Create a triage plan: \" +\n    \"label each category, archive newsletters+notifications, keep urgent+needs-reply \" +\n    \"in inbox. Show the plan before applying. Use mailbox_triage_plan to build the \" +\n    \"plan and mailbox_triage_apply to execute it after user confirmation.\",\n}\n","import { defineWorkflow } from \"@agentproto/workflow\"\n\n/** Single-agent workflow: triage the inbox. */\nexport const triageInbox = defineWorkflow({\n  id: \"triage-inbox\",\n  name: \"Triage Inbox\",\n  description: \"Scan inbox, categorize unread messages, create and apply triage plan.\",\n  version: \"0.1.0\",\n  inputs: {},\n  outputs: {},\n  steps: [\n    {\n      id: \"triage\",\n      kind: \"agent\",\n      agent: { ref: \"@agentproto/triager\" },\n      prompt:\n        \"Scan the inbox for unread messages. Categorize them (urgent, needs-reply, \" +\n        \"newsletter, notification, spam). Create a triage plan: label each category, \" +\n        \"archive newsletters+notifications, keep urgent+needs-reply in inbox. \" +\n        \"Show me the plan before applying.\",\n    },\n  ],\n})\n","/**\n * `mail-triage` — a single-agent agentproto app for email triage.\n *\n * One agent (triager) scans inbox, categorizes unread mail, and applies\n * triage actions (label, archive). Proves the APP primitive works end-to-end\n * with a simple, useful real-world task.\n */\n\nimport { defineApp, type AppHandle } from \"@agentproto/app-kit\"\nimport { triager } from \"./agents/triager.js\"\nimport { triageInbox } from \"./workflows/triage-inbox.js\"\n\nexport const mailTriage: AppHandle = defineApp({\n  agents: [triager],\n  workflows: [triageInbox],\n})\n\nexport { triager, triageInbox }\n"]}
+{"version":3,"sources":["../src/mail-triage/agents/triager.ts","../src/mail-triage/workflows/triage-inbox.ts","../src/mail-triage/ui.ts","../src/mail-triage/index.ts"],"names":[],"mappings":"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","file":"mail-triage.mjs","sourcesContent":["import { defineAgent } from \"@agentproto/agent\"\nimport type { AgentEntry } from \"@agentproto/app-kit\"\n\n/** Triages your inbox — finds unread mail, categorizes, labels, archives. */\nexport const triager: AgentEntry = {\n  agent: defineAgent({\n    schema: \"agent/v1\",\n    id: \"@agentproto/triager\",\n    description: \"Triages your inbox — finds unread mail, categorizes, labels, archives.\",\n    model: \"claude-sonnet-5\",\n    boundaries: [\n      \"Always show the triage plan before applying\",\n      \"Never delete — only archive, label, or mark read\",\n      \"Ask before applying bulk actions on more than 20 messages\",\n    ],\n    tools: [\n      \"mailbox_list\",\n      \"mailbox_search\",\n      \"mailbox_list_threads\",\n      \"mailbox_get_thread\",\n      \"mailbox_labels_list\",\n      \"mailbox_label_create\",\n      \"mailbox_triage_plan\",\n      \"mailbox_triage_apply\",\n    ],\n    workflows: [{ ref: \"triage-inbox\" }],\n  }),\n  body:\n    \"You scan the inbox for unread messages using mailbox_search. Categorize them \" +\n    \"(urgent, needs-reply, newsletter, notification, spam). Create a triage plan: \" +\n    \"label each category, archive newsletters+notifications, keep urgent+needs-reply \" +\n    \"in inbox. Show the plan before applying. Use mailbox_triage_plan to build the \" +\n    \"plan and mailbox_triage_apply to execute it after user confirmation.\",\n}\n","import { defineWorkflow } from \"@agentproto/workflow\"\n\n/** Single-agent workflow: triage the inbox. */\nexport const triageInbox = defineWorkflow({\n  id: \"triage-inbox\",\n  name: \"Triage Inbox\",\n  description: \"Scan inbox, categorize unread messages, create and apply triage plan.\",\n  version: \"0.1.0\",\n  inputs: {},\n  outputs: {},\n  steps: [\n    {\n      id: \"triage\",\n      kind: \"agent\",\n      agent: { ref: \"@agentproto/triager\" },\n      prompt:\n        \"Scan the inbox for unread messages. Categorize them (urgent, needs-reply, \" +\n        \"newsletter, notification, spam). Create a triage plan: label each category, \" +\n        \"archive newsletters+notifications, keep urgent+needs-reply in inbox. \" +\n        \"Show me the plan before applying.\",\n    },\n  ],\n})\n","/**\n * Mail Triage — a self-contained MCP App dashboard for `mail-triage`.\n *\n * Talks to the daemon only through the `window.McpApp.connect()` bridge\n * (never a direct `fetch`): every action round-trips through the app's own\n * `app_tool_call` gateway tool, `{ appId, tool, args }`. Mailbox access goes\n * through the imported `agentpush` MCP server (`imported:agentpush/<tool>`\n * ids); running the triager agent itself goes through the daemon's own\n * `app_run` / `app_status` / `agent_output` — a second path alongside the\n * deterministic plan/apply tools, so the panel can either drive the mailbox\n * tools directly or hand the whole job to the agent and watch it work.\n */\n\nexport const MAIL_TRIAGE_TOOLS = [\n  \"imported:agentpush/mailbox_list\",\n  \"imported:agentpush/mailbox_search\",\n  \"imported:agentpush/mailbox_triage_plan\",\n  \"imported:agentpush/mailbox_triage_apply\",\n  \"app_run\",\n  \"app_status\",\n  \"agent_output\",\n] as const\n\nconst APP_ID = \"@agentproto/mail-triage\"\nconst AGENT_ID = \"@agentproto/triager\"\nconst CATEGORIES = [\"urgent\", \"needs-reply\", \"newsletter\", \"notification\"]\n\nexport const MAIL_TRIAGE_HTML = `<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>Mail Triage</title>\n<style>\n*{box-sizing:border-box;margin:0;padding:0}\n:root{\n  --bg:#0d1117;--bg2:#161b22;--bg3:#21262d;--border:#30363d;\n  --text:#e6edf3;--text2:#8b949e;\n  --green:#3fb950;--yellow:#d29922;--red:#f85149;--blue:#58a6ff;--purple:#bc8cff;\n}\nhtml,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;font-size:13px;background:var(--bg);color:var(--text)}\n#app{display:flex;flex-direction:column;height:100%;overflow-y:auto}\n#toolbar{padding:10px 14px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;background:var(--bg2);flex-shrink:0}\n#toolbar .title{font-size:13px;font-weight:600;flex:1}\nselect,input[type=text]{background:var(--bg3);border:1px solid var(--border);color:var(--text);padding:5px 8px;border-radius:4px;font-size:12px;font-family:inherit}\n.abtn{background:var(--bg3);border:1px solid var(--border);color:var(--text);padding:5px 10px;border-radius:4px;cursor:pointer;font-size:12px;font-family:inherit}\n.abtn:hover{background:var(--border)}\n.abtn:disabled{opacity:.4;cursor:default}\n.abtn.primary{background:var(--blue);border-color:var(--blue);color:#04101c}\n.abtn.primary:hover{opacity:.9}\n#content{padding:14px;display:flex;flex-direction:column;gap:16px}\nsection{background:var(--bg2);border:1px solid var(--border);border-radius:6px;padding:12px}\nsection h3{font-size:11px;color:var(--text2);text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px}\n#summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px}\n.tile{background:var(--bg3);border:1px solid var(--border);border-radius:6px;padding:10px;text-align:center}\n.tile .count{font-size:22px;font-weight:700}\n.tile .label{font-size:11px;color:var(--text2);text-transform:capitalize}\n.tile.urgent .count{color:var(--red)}\n.tile.needs-reply .count{color:var(--yellow)}\n.tile.newsletter .count{color:var(--blue)}\n.tile.notification .count{color:var(--purple)}\n#plan-list,#search-results,#log{max-height:260px;overflow-y:auto;font-size:12px}\n.plan-item{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--border)}\n.plan-item .subj{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.plan-item .tag{color:var(--text2);font-size:11px;white-space:nowrap}\n#log{font-family:Menlo,Monaco,monospace;white-space:pre-wrap;word-break:break-word;background:var(--bg);border:1px solid var(--border);border-radius:4px;padding:8px}\n.searchbar{display:flex;gap:8px;margin-bottom:8px}\n.searchbar input{flex:1}\n.actions{display:flex;gap:8px;margin-top:10px}\n#status{padding:6px 14px;font-size:11px;color:var(--text2);border-top:1px solid var(--border);background:var(--bg2);flex-shrink:0}\n.empty{color:var(--text2);padding:8px 0}\n</style>\n</head>\n<body>\n<div id=\"app\">\n  <div id=\"toolbar\">\n    <span class=\"title\">Mail Triage</span>\n    <select id=\"mailbox-select\"></select>\n    <button class=\"abtn\" id=\"refresh-btn\">Refresh</button>\n  </div>\n  <div id=\"content\">\n    <section>\n      <h3>Inbox summary</h3>\n      <div id=\"summary\"></div>\n    </section>\n\n    <section>\n      <h3>Search</h3>\n      <div class=\"searchbar\">\n        <input type=\"text\" id=\"search-input\" placeholder=\"e.g. is:unread\">\n        <button class=\"abtn\" id=\"search-btn\">Search</button>\n      </div>\n      <div id=\"search-results\"><div class=\"empty\">No search run yet.</div></div>\n    </section>\n\n    <section>\n      <h3>Triage plan</h3>\n      <div class=\"actions\">\n        <button class=\"abtn primary\" id=\"triage-btn\">Triage</button>\n        <button class=\"abtn\" id=\"apply-btn\" disabled>Apply</button>\n      </div>\n      <div id=\"plan-list\" style=\"margin-top:10px\"><div class=\"empty\">No plan yet — click Triage.</div></div>\n    </section>\n\n    <section>\n      <h3>Triager agent</h3>\n      <div class=\"actions\">\n        <button class=\"abtn\" id=\"run-agent-btn\">Run Triager Agent</button>\n      </div>\n      <div id=\"log\" style=\"margin-top:10px\"><div class=\"empty\">Agent has not run yet.</div></div>\n    </section>\n  </div>\n  <div id=\"status\">Connecting&#8230;</div>\n</div>\n<script>\nvar APP_ID = ${JSON.stringify(APP_ID)};\nvar AGENT_ID = ${JSON.stringify(AGENT_ID)};\nvar CATEGORIES = ${JSON.stringify(CATEGORIES)};\nvar callTool = null;\nvar currentPlan = null;\nvar pollHandle = null;\n\nfunction setStatus(msg) {\n  document.getElementById(\"status\").textContent = msg;\n}\n\n// See media-viewer/ui.ts for why this loop exists: app_tool_call wraps its\n// dispatch result in at least one more {content:[{type:\"text\",text:...}]}\n// shell than the underlying tool returned.\nfunction unwrapText(result) {\n  var cur = result;\n  for (var i = 0; i < 4; i++) {\n    if (typeof cur === \"string\") {\n      try {\n        cur = JSON.parse(cur);\n        continue;\n      } catch (e) {\n        return cur;\n      }\n    }\n    if (cur && Array.isArray(cur.content) && cur.content[0] && typeof cur.content[0].text === \"string\") {\n      cur = cur.content[0].text;\n      continue;\n    }\n    break;\n  }\n  return cur;\n}\n\nfunction callApp(tool, args) {\n  return callTool(\"app_tool_call\", { appId: APP_ID, tool: tool, args: args || {} }).then(unwrapText);\n}\n\nfunction asList(value, keys) {\n  if (Array.isArray(value)) return value;\n  if (value && typeof value === \"object\") {\n    for (var i = 0; i < keys.length; i++) {\n      if (Array.isArray(value[keys[i]])) return value[keys[i]];\n    }\n  }\n  return [];\n}\n\nfunction renderSummary(counts) {\n  var el = document.getElementById(\"summary\");\n  el.innerHTML = \"\";\n  CATEGORIES.forEach(function (cat) {\n    var tile = document.createElement(\"div\");\n    tile.className = \"tile \" + cat;\n    var count = counts && counts[cat] !== undefined ? counts[cat] : \"–\";\n    tile.innerHTML = '<div class=\"count\"></div><div class=\"label\"></div>';\n    tile.querySelector(\".count\").textContent = String(count);\n    tile.querySelector(\".label\").textContent = cat.replace(\"-\", \" \");\n    el.appendChild(tile);\n  });\n}\n\nfunction loadMailboxes() {\n  setStatus(\"Loading mailboxes\\\\u2026\");\n  return callApp(\"imported:agentpush/mailbox_list\", {})\n    .then(function (result) {\n      var mailboxes = asList(result, [\"mailboxes\", \"items\"]);\n      var select = document.getElementById(\"mailbox-select\");\n      select.innerHTML = \"\";\n      if (mailboxes.length === 0) {\n        var opt = document.createElement(\"option\");\n        opt.textContent = \"inbox\";\n        opt.value = \"inbox\";\n        select.appendChild(opt);\n      } else {\n        mailboxes.forEach(function (mb) {\n          var name = typeof mb === \"string\" ? mb : mb.name || mb.id || JSON.stringify(mb);\n          var opt = document.createElement(\"option\");\n          opt.value = name;\n          opt.textContent = name;\n          select.appendChild(opt);\n        });\n      }\n      setStatus(\"Ready\");\n    })\n    .catch(function (err) {\n      setStatus(\"Error loading mailboxes: \" + err.message);\n    });\n}\n\nfunction renderSearchResults(items) {\n  var el = document.getElementById(\"search-results\");\n  el.innerHTML = \"\";\n  if (items.length === 0) {\n    el.innerHTML = '<div class=\"empty\">No results.</div>';\n    return;\n  }\n  items.forEach(function (item) {\n    var row = document.createElement(\"div\");\n    row.className = \"plan-item\";\n    var subj = typeof item === \"string\" ? item : item.subject || item.title || JSON.stringify(item);\n    var from = item && item.from ? item.from : \"\";\n    row.innerHTML = '<span class=\"subj\"></span><span class=\"tag\"></span>';\n    row.querySelector(\".subj\").textContent = subj;\n    row.querySelector(\".tag\").textContent = from;\n    el.appendChild(row);\n  });\n}\n\nfunction renderPlan(plan) {\n  var items = asList(plan, [\"actions\", \"items\", \"plan\"]);\n  var el = document.getElementById(\"plan-list\");\n  el.innerHTML = \"\";\n  if (items.length === 0) {\n    el.innerHTML = '<div class=\"empty\">Plan is empty.</div>';\n    return;\n  }\n  var counts = {};\n  items.forEach(function (item) {\n    var cat = (item && (item.category || item.tag)) || \"notification\";\n    counts[cat] = (counts[cat] || 0) + 1;\n    var row = document.createElement(\"div\");\n    row.className = \"plan-item\";\n    var subj = (item && (item.subject || item.title)) || JSON.stringify(item);\n    var action = (item && (item.action || item.category)) || \"\";\n    row.innerHTML = '<span class=\"subj\"></span><span class=\"tag\"></span>';\n    row.querySelector(\".subj\").textContent = subj;\n    row.querySelector(\".tag\").textContent = action;\n    el.appendChild(row);\n  });\n  renderSummary(counts);\n}\n\ndocument.getElementById(\"refresh-btn\").addEventListener(\"click\", loadMailboxes);\n\ndocument.getElementById(\"search-btn\").addEventListener(\"click\", function () {\n  var query = document.getElementById(\"search-input\").value;\n  var mailbox = document.getElementById(\"mailbox-select\").value;\n  setStatus(\"Searching\\\\u2026\");\n  callApp(\"imported:agentpush/mailbox_search\", { mailbox: mailbox, query: query })\n    .then(function (result) {\n      renderSearchResults(asList(result, [\"messages\", \"items\", \"results\"]));\n      setStatus(\"Ready\");\n    })\n    .catch(function (err) {\n      setStatus(\"Search failed: \" + err.message);\n    });\n});\n\ndocument.getElementById(\"triage-btn\").addEventListener(\"click\", function () {\n  var mailbox = document.getElementById(\"mailbox-select\").value;\n  setStatus(\"Building triage plan\\\\u2026\");\n  document.getElementById(\"apply-btn\").disabled = true;\n  callApp(\"imported:agentpush/mailbox_triage_plan\", { mailbox: mailbox })\n    .then(function (plan) {\n      currentPlan = plan;\n      renderPlan(plan);\n      document.getElementById(\"apply-btn\").disabled = false;\n      setStatus(\"Plan ready \\\\u2014 review, then Apply.\");\n    })\n    .catch(function (err) {\n      setStatus(\"Triage plan failed: \" + err.message);\n    });\n});\n\ndocument.getElementById(\"apply-btn\").addEventListener(\"click\", function () {\n  if (!currentPlan) return;\n  setStatus(\"Applying triage plan\\\\u2026\");\n  callApp(\"imported:agentpush/mailbox_triage_apply\", { plan: currentPlan })\n    .then(function () {\n      setStatus(\"Plan applied.\");\n      document.getElementById(\"apply-btn\").disabled = true;\n    })\n    .catch(function (err) {\n      setStatus(\"Apply failed: \" + err.message);\n    });\n});\n\nfunction appendLog(text) {\n  var el = document.getElementById(\"log\");\n  if (el.querySelector(\".empty\")) el.innerHTML = \"\";\n  el.textContent += (el.textContent ? \"\\\\n\" : \"\") + text;\n  el.scrollTop = el.scrollHeight;\n}\n\nfunction pollAgentRun(appRunId) {\n  if (pollHandle) clearTimeout(pollHandle);\n  callApp(\"app_status\", { appRunId: appRunId })\n    .then(function (status) {\n      var sessions = (status && status.sessions) || [];\n      var sessionId = sessions[0] && sessions[0].sessionId;\n      var tail = sessionId\n        ? callApp(\"agent_output\", { sessionId: sessionId, lastN: 200, clean: true })\n        : Promise.resolve(\"\");\n      return tail.then(function (output) {\n        if (output) appendLog(typeof output === \"string\" ? output : JSON.stringify(output));\n        var done = status && (status.status === \"ended\" || status.status === \"done\" || status.endedAt);\n        if (!done) {\n          pollHandle = setTimeout(function () { pollAgentRun(appRunId); }, 2000);\n        } else {\n          setStatus(\"Agent run finished.\");\n        }\n      });\n    })\n    .catch(function (err) {\n      setStatus(\"Agent status failed: \" + err.message);\n    });\n}\n\ndocument.getElementById(\"run-agent-btn\").addEventListener(\"click\", function () {\n  document.getElementById(\"log\").innerHTML = \"\";\n  setStatus(\"Starting triager agent\\\\u2026\");\n  callApp(\"app_run\", { appId: APP_ID, agents: [AGENT_ID], prompt: \"Triage my inbox.\" })\n    .then(function (run) {\n      appendLog(\"Started app run \" + (run && run.appRunId));\n      pollAgentRun(run.appRunId);\n    })\n    .catch(function (err) {\n      setStatus(\"Run failed: \" + err.message);\n    });\n});\n\nwindow.McpApp.connect()\n  .then(function (bridge) {\n    callTool = bridge.callTool;\n    return loadMailboxes();\n  })\n  .catch(function (err) {\n    setStatus(\"Standalone mode \\\\u2014 no host bridge (\" + err.message + \")\");\n    renderSummary(null);\n  });\n\nrenderSummary(null);\n</script>\n</body>\n</html>`\n","/**\n * `mail-triage` — a single-agent agentproto app for email triage.\n *\n * One agent (triager) scans inbox, categorizes unread mail, and applies\n * triage actions (label, archive). Proves the APP primitive works end-to-end\n * with a simple, useful real-world task.\n */\n\nimport { defineApp, type AppHandle } from \"@agentproto/app-kit\"\nimport { triager } from \"./agents/triager.js\"\nimport { triageInbox } from \"./workflows/triage-inbox.js\"\nimport { MAIL_TRIAGE_HTML, MAIL_TRIAGE_TOOLS } from \"./ui.js\"\n\nexport const mailTriage: AppHandle = defineApp({\n  id: \"@agentproto/mail-triage\",\n  name: \"Mail Triage\",\n  version: \"0.1.0\",\n  description: \"Triage your inbox — categorize, label, archive.\",\n  agents: [triager],\n  workflows: [triageInbox],\n  ui: {\n    html: MAIL_TRIAGE_HTML,\n    title: \"Mail Triage\",\n    tools: [...MAIL_TRIAGE_TOOLS],\n  },\n})\n\nexport { triager, triageInbox }\n"]}

package/dist/media-viewer/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/media-viewer/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAa,KAAK,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AAErD,eAAO,MAAM,WAAW,EAAE,SAGxB,CAAA;AAEF,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/media-viewer/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAa,KAAK,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AAGrD,eAAO,MAAM,WAAW,EAAE,SAYxB,CAAA;AAEF,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,CAAA"}

package/dist/media-viewer/ui.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Media Viewer — a self-contained MCP App gallery widget for `media-viewer`.
+ *
+ * Talks to the daemon only through the `window.McpApp.connect()` bridge
+ * (never a direct `fetch`): every action round-trips through the app's own
+ * `app_tool_call` gateway tool, `{ appId, tool, args }`. `app_tool_call`
+ * double-wraps its dispatch result (it returns a text-result whose `text` is
+ * the JSON-stringified inner tool result, itself an MCP content array) — see
+ * `unwrapText` below, which peels that apart regardless of how many layers
+ * the host's bridge already stripped.
+ */
+export declare const MEDIA_VIEWER_TOOLS: readonly ["directory_list", "file_info", "file_read"];
+export declare const MEDIA_VIEWER_HTML: string;
+//# sourceMappingURL=ui.d.ts.map

package/dist/media-viewer/ui.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui.d.ts","sourceRoot":"","sources":["../../src/media-viewer/ui.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,eAAO,MAAM,kBAAkB,uDAAwD,CAAA;AAIvF,eAAO,MAAM,iBAAiB,QA4OtB,CAAA"}

package/dist/media-viewer.mjs

@@ -71,10 +71,260 @@ var scanMedia = defineWorkflow({
   ]
 });
 
+// src/media-viewer/ui.ts
+var MEDIA_VIEWER_TOOLS = ["directory_list", "file_info", "file_read"];
+var APP_ID = "@agentproto/media-viewer";
+var MEDIA_VIEWER_HTML = `<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Media Viewer</title>
+<style>
+*{box-sizing:border-box;margin:0;padding:0}
+:root{
+  --bg:#0d1117;--bg2:#161b22;--bg3:#21262d;--border:#30363d;
+  --text:#e6edf3;--text2:#8b949e;
+  --green:#3fb950;--yellow:#d29922;--red:#f85149;--blue:#58a6ff;--purple:#bc8cff;
+}
+html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:13px;background:var(--bg);color:var(--text)}
+#app{display:flex;flex-direction:column;height:100%}
+#toolbar{padding:10px 14px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;background:var(--bg2);flex-shrink:0}
+#toolbar .title{font-size:13px;font-weight:600;flex:1}
+#breadcrumb{font-size:12px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.abtn{background:var(--bg3);border:1px solid var(--border);color:var(--text);padding:5px 10px;border-radius:4px;cursor:pointer;font-size:12px;font-family:inherit}
+.abtn:hover{background:var(--border)}
+#body{flex:1;display:flex;overflow:hidden}
+#grid-wrap{flex:1;overflow-y:auto;padding:14px}
+#grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
+.cell{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px;border:1px solid var(--border);border-radius:6px;background:var(--bg2);cursor:pointer;text-align:center}
+.cell:hover{background:var(--bg3);border-color:var(--blue)}
+.cell.selected{border-color:var(--blue);background:var(--bg3)}
+.icon{font-size:28px;line-height:1}
+.name{font-size:11px;color:var(--text);word-break:break-word;max-width:100%;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
+#empty{color:var(--text2);padding:24px;text-align:center}
+#details{width:280px;border-left:1px solid var(--border);background:var(--bg2);padding:14px;overflow-y:auto;flex-shrink:0}
+#details h3{font-size:12px;color:var(--text2);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px}
+#details .row{display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px solid var(--border);font-size:12px}
+#details .row span:first-child{color:var(--text2)}
+#preview{margin-top:10px;padding:8px;background:var(--bg);border:1px solid var(--border);border-radius:4px;font-family:Menlo,Monaco,monospace;font-size:11px;white-space:pre-wrap;word-break:break-all;max-height:240px;overflow-y:auto}
+#status{padding:6px 14px;font-size:11px;color:var(--text2);border-top:1px solid var(--border);background:var(--bg2);flex-shrink:0}
+</style>
+</head>
+<body>
+<div id="app">
+  <div id="toolbar">
+    <button class="abtn" id="up-btn" title="Up one level">&uarr;</button>
+    <span class="title">Media Viewer</span>
+    <span id="breadcrumb">.</span>
+    <button class="abtn" id="refresh-btn">Refresh</button>
+  </div>
+  <div id="body">
+    <div id="grid-wrap">
+      <div id="grid"></div>
+      <div id="empty" style="display:none">No files in this folder.</div>
+    </div>
+    <div id="details" style="display:none"></div>
+  </div>
+  <div id="status">Connecting&#8230;</div>
+</div>
+<script>
+var APP_ID = ${JSON.stringify(APP_ID)};
+var currentPath = ".";
+var entries = [];
+var callTool = null;
+
+function setStatus(msg) {
+  document.getElementById("status").textContent = msg;
+}
+
+// app_tool_call wraps its dispatch result at least once (its own
+// text-result body is the JSON-stringified inner MCP tool result); peel
+// back through nested {content:[{type:"text",text:...}]} shells until the
+// payload stops looking like one, so this works whichever layer the host's
+// own bridge already unwrapped.
+function unwrapText(result) {
+  var cur = result;
+  for (var i = 0; i < 4; i++) {
+    if (typeof cur === "string") {
+      try {
+        cur = JSON.parse(cur);
+        continue;
+      } catch (e) {
+        return cur;
+      }
+    }
+    if (cur && Array.isArray(cur.content) && cur.content[0] && typeof cur.content[0].text === "string") {
+      cur = cur.content[0].text;
+      continue;
+    }
+    break;
+  }
+  return cur;
+}
+
+function callApp(tool, args) {
+  return callTool("app_tool_call", { appId: APP_ID, tool: tool, args: args || {} }).then(unwrapText);
+}
+
+function parseDirectoryListing(raw) {
+  var text = typeof raw === "string" ? raw : "";
+  return text
+    .split("\\n")
+    .map(function (line) { return line.trim(); })
+    .filter(function (line) { return line.length > 0; })
+    .map(function (line) {
+      var isDir = line.indexOf("[DIR]") === 0;
+      var name = line.replace(/^\\[(FILE|DIR)\\]\\s*/, "");
+      return { name: name, isDir: isDir };
+    });
+}
+
+function iconFor(entry) {
+  if (entry.isDir) return "\\uD83D\\uDCC1";
+  var ext = (entry.name.split(".").pop() || "").toLowerCase();
+  if (["jpg", "jpeg", "png", "gif", "webp", "svg", "bmp", "ico", "avif"].indexOf(ext) !== -1) return "\\uD83D\\uDDBC\\uFE0F";
+  if (["mp4", "webm", "mov", "avi", "mkv"].indexOf(ext) !== -1) return "\\uD83C\\uDFA5";
+  if (["mp3", "wav", "ogg", "flac", "aac", "m4a"].indexOf(ext) !== -1) return "\\uD83C\\uDFB5";
+  return "\\uD83D\\uDCC4";
+}
+
+function joinPath(base, name) {
+  if (base === "." || base === "") return name;
+  return base.replace(/\\/+$/, "") + "/" + name;
+}
+
+function parentPath(path) {
+  if (path === "." || path.indexOf("/") === -1) return ".";
+  return path.slice(0, path.lastIndexOf("/")) || ".";
+}
+
+function renderGrid() {
+  document.getElementById("breadcrumb").textContent = currentPath;
+  var grid = document.getElementById("grid");
+  var empty = document.getElementById("empty");
+  grid.innerHTML = "";
+  if (entries.length === 0) {
+    empty.style.display = "block";
+    return;
+  }
+  empty.style.display = "none";
+  entries.forEach(function (entry, idx) {
+    var cell = document.createElement("div");
+    cell.className = "cell";
+    cell.dataset.idx = String(idx);
+    cell.innerHTML = '<div class="icon">' + iconFor(entry) + '</div><div class="name"></div>';
+    cell.querySelector(".name").textContent = entry.name;
+    cell.addEventListener("click", function () { onSelect(entry, cell); });
+    grid.appendChild(cell);
+  });
+}
+
+function onSelect(entry, cell) {
+  Array.prototype.forEach.call(document.querySelectorAll(".cell"), function (c) {
+    c.classList.remove("selected");
+  });
+  cell.classList.add("selected");
+  if (entry.isDir) {
+    loadDirectory(joinPath(currentPath, entry.name));
+    return;
+  }
+  showFileDetails(joinPath(currentPath, entry.name));
+}
+
+function showFileDetails(path) {
+  var details = document.getElementById("details");
+  details.style.display = "block";
+  details.innerHTML = "<h3>Loading&#8230;</h3>";
+  setStatus("Reading " + path + "\\u2026");
+  callApp("file_info", { path: path })
+    .then(function (info) {
+      var rows = "";
+      if (info && typeof info === "object") {
+        ["name", "type", "size", "modified"].forEach(function (key) {
+          if (info[key] !== undefined) {
+            rows += '<div class="row"><span>' + key + '</span><span></span></div>';
+          }
+        });
+      }
+      details.innerHTML = "<h3>Details</h3>" + rows + '<div id="preview">Loading preview&#8230;</div>';
+      var rowEls = details.querySelectorAll(".row span:last-child");
+      var keys = ["name", "type", "size", "modified"].filter(function (key) {
+        return info && info[key] !== undefined;
+      });
+      keys.forEach(function (key, i) {
+        rowEls[i].textContent = String(info[key]);
+      });
+      return callApp("file_read", { path: path });
+    })
+    .then(function (content) {
+      var pre = document.getElementById("preview");
+      if (!pre) return;
+      var text = typeof content === "string" ? content : JSON.stringify(content);
+      pre.textContent = text.length > 2000 ? text.slice(0, 2000) + "\\u2026 (truncated)" : (text || "(empty file)");
+      setStatus("Ready \\u00b7 " + currentPath);
+    })
+    .catch(function (err) {
+      var pre = document.getElementById("preview");
+      if (pre) pre.textContent = "Preview unavailable (" + err.message + ")";
+      setStatus("Ready \\u00b7 " + currentPath);
+    });
+}
+
+function loadDirectory(path) {
+  document.getElementById("details").style.display = "none";
+  setStatus("Loading " + path + "\\u2026");
+  return callApp("directory_list", { path: path })
+    .then(function (raw) {
+      currentPath = path;
+      entries = parseDirectoryListing(raw).sort(function (a, b) {
+        if (a.isDir !== b.isDir) return a.isDir ? -1 : 1;
+        return a.name.localeCompare(b.name);
+      });
+      renderGrid();
+      setStatus("Ready \\u00b7 " + entries.length + " entries \\u00b7 " + path);
+    })
+    .catch(function (err) {
+      entries = [];
+      renderGrid();
+      setStatus("Error: " + err.message);
+    });
+}
+
+document.getElementById("up-btn").addEventListener("click", function () {
+  loadDirectory(parentPath(currentPath));
+});
+document.getElementById("refresh-btn").addEventListener("click", function () {
+  loadDirectory(currentPath);
+});
+
+window.McpApp.connect()
+  .then(function (bridge) {
+    callTool = bridge.callTool;
+    return loadDirectory(".");
+  })
+  .catch(function (err) {
+    setStatus("Standalone mode \\u2014 no host bridge (" + err.message + ")");
+    entries = [];
+    renderGrid();
+  });
+</script>
+</body>
+</html>`;
+
 // src/media-viewer/index.ts
 var mediaViewer = defineApp({
+  id: "@agentproto/media-viewer",
+  name: "Media Viewer",
+  version: "0.1.0",
+  description: "Scan a folder for images, video, and audio \u2014 gallery view.",
   agents: [cataloger],
-  workflows: [scanMedia]
+  workflows: [scanMedia],
+  ui: {
+    html: MEDIA_VIEWER_HTML,
+    title: "Media Viewer",
+    tools: [...MEDIA_VIEWER_TOOLS]
+  }
 });
 
 export { cataloger, mediaViewer, scanMedia };

package/dist/media-viewer.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/media-viewer/agents/cataloger.ts","../src/media-viewer/workflows/scan-media.ts","../src/media-viewer/index.ts"],"names":[],"mappings":";;;;;;;;;AAGO,IAAM,SAAA,GAAwB;AAAA,EACnC,OAAO,WAAA,CAAY;AAAA,IACjB,MAAA,EAAQ,UAAA;AAAA,IACR,EAAA,EAAI,6BAAA;AAAA,IACJ,WAAA,EACE,8GAAA;AAAA,IACF,KAAA,EAAO,iBAAA;AAAA,IACP,UAAA,EAAY;AAAA,MACV,8DAAA;AAAA,MACA,qDAAA;AAAA,MACA;AAAA,KACF;AAAA,IACA,KAAA,EAAO,CAAC,UAAA,EAAY,WAAA,EAAa,WAAW,CAAA;AAAA,IAC5C,SAAA,EAAW,CAAC,EAAE,GAAA,EAAK,cAAc;AAAA,GAClC,CAAA;AAAA,EACD,IAAA,EAAM;AAAA,IACJ,oFAAA;AAAA,IACA,EAAA;AAAA,IACA,gFAAA;AAAA,IACA,sCAAA;AAAA,IACA,mEAAA;AAAA,IACA,wCAAA;AAAA,IACA,8CAAA;AAAA,IACA,EAAA;AAAA,IACA,6EAAA;AAAA,IACA,EAAA;AAAA,IACA,uCAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAA;AAAA,IACA,+BAAA;AAAA,IACA,mCAAA;AAAA,IACA,wFAAA;AAAA,IACA,cAAA;AAAA,IACA,OAAA;AAAA,IACA,oCAAA;AAAA,IACA,2BAAA;AAAA,IACA,wBAAA;AAAA,IACA,4BAAA;AAAA,IACA,4BAAA;AAAA,IACA,4CAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,GAAA;AAAA,IACA,KAAA;AAAA,IACA,EAAA;AAAA,IACA;AAAA,GACF,CAAE,KAAK,IAAI;AACb;AChDO,IAAM,YAAY,cAAA,CAAe;AAAA,EACtC,EAAA,EAAI,YAAA;AAAA,EACJ,IAAA,EAAM,YAAA;AAAA,EACN,WAAA,EACE,oFAAA;AAAA,EACF,OAAA,EAAS,OAAA;AAAA,EACT,QAAQ,EAAC;AAAA,EACT,SAAS,EAAC;AAAA,EACV,KAAA,EAAO;AAAA,IACL;AAAA,MACE,EAAA,EAAI,SAAA;AAAA,MACJ,IAAA,EAAM,OAAA;AAAA,MACN,KAAA,EAAO,EAAE,GAAA,EAAK,6BAAA,EAA8B;AAAA,MAC5C,MAAA,EACE;AAAA;AAIJ;AAEJ,CAAC;;;ACVM,IAAM,cAAyB,SAAA,CAAU;AAAA,EAC9C,MAAA,EAAQ,CAAC,SAAS,CAAA;AAAA,EAClB,SAAA,EAAW,CAAC,SAAS;AACvB,CAAC","file":"media-viewer.mjs","sourcesContent":["import { defineAgent } from \"@agentproto/agent\"\nimport type { AgentEntry } from \"@agentproto/app-kit\"\n\nexport const cataloger: AgentEntry = {\n  agent: defineAgent({\n    schema: \"agent/v1\",\n    id: \"@agentproto/media-cataloger\",\n    description:\n      \"Scans a folder for media files (images, video, audio), collects metadata, and produces a structured catalog.\",\n    model: \"claude-sonnet-5\",\n    boundaries: [\n      \"Read-only — never modify, rename, move, or delete files\",\n      \"Only catalog files with recognized media extensions\",\n      \"Report exact file sizes and paths, never estimate\",\n    ],\n    tools: [\"list_dir\", \"read_file\", \"file_info\"],\n    workflows: [{ ref: \"scan-media\" }],\n  }),\n  body: [\n    \"You scan a workspace folder for media files and produce a structured JSON catalog.\",\n    \"\",\n    \"Walk the target directory recursively using list_dir. For each file, check the\",\n    \"extension against known media types:\",\n    \"- Images: .jpg, .jpeg, .png, .gif, .webp, .svg, .bmp, .ico, .avif\",\n    \"- Video: .mp4, .webm, .mov, .avi, .mkv\",\n    \"- Audio: .mp3, .wav, .ogg, .flac, .aac, .m4a\",\n    \"\",\n    \"For each media file found, use file_info to get size and modification date.\",\n    \"\",\n    \"Output a JSON object with this shape:\",\n    \"```json\",\n    '{',\n    '  \"folder\": \"<scanned path>\",',\n    '  \"scannedAt\": \"<ISO timestamp>\",',\n    '  \"summary\": { \"total\": N, \"images\": N, \"video\": N, \"audio\": N, \"totalSizeBytes\": N },',\n    '  \"files\": [',\n    '    {',\n    '      \"path\": \"relative/path.jpg\",',\n    '      \"name\": \"file.jpg\",',\n    '      \"type\": \"image\",',\n    '      \"extension\": \".jpg\",',\n    '      \"sizeBytes\": 123456,',\n    '      \"modifiedAt\": \"2026-08-01T12:00:00Z\"',\n    \"    }\",\n    \"  ]\",\n    \"}\",\n    \"```\",\n    \"\",\n    \"Sort files by type (images first, then video, then audio), then by name.\",\n  ].join(\"\\n\"),\n}\n","import { defineWorkflow } from \"@agentproto/workflow\"\n\nexport const scanMedia = defineWorkflow({\n  id: \"scan-media\",\n  name: \"Scan Media\",\n  description:\n    \"Scan a folder for media files, collect metadata, and produce a structured catalog.\",\n  version: \"0.1.0\",\n  inputs: {},\n  outputs: {},\n  steps: [\n    {\n      id: \"catalog\",\n      kind: \"agent\",\n      agent: { ref: \"@agentproto/media-cataloger\" },\n      prompt:\n        \"Scan the workspace root folder for media files (images, video, audio). \" +\n        \"Walk all subdirectories recursively. For each media file, collect its path, \" +\n        \"name, type, extension, size, and modification date. Output the full catalog \" +\n        \"as a single JSON object.\",\n    },\n  ],\n})\n","/**\n * `media-viewer` — a single-agent agentproto app for media cataloging.\n *\n * One agent (cataloger) scans a workspace folder for images, video, and audio\n * files, collects metadata, and produces a structured JSON catalog. Paired\n * with a Cowork McpApp gallery widget for visual browsing.\n */\n\nimport { defineApp, type AppHandle } from \"@agentproto/app-kit\"\nimport { cataloger } from \"./agents/cataloger.js\"\nimport { scanMedia } from \"./workflows/scan-media.js\"\n\nexport const mediaViewer: AppHandle = defineApp({\n  agents: [cataloger],\n  workflows: [scanMedia],\n})\n\nexport { cataloger, scanMedia }\n"]}
+{"version":3,"sources":["../src/media-viewer/agents/cataloger.ts","../src/media-viewer/workflows/scan-media.ts","../src/media-viewer/ui.ts","../src/media-viewer/index.ts"],"names":[],"mappings":"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","file":"media-viewer.mjs","sourcesContent":["import { defineAgent } from \"@agentproto/agent\"\nimport type { AgentEntry } from \"@agentproto/app-kit\"\n\nexport const cataloger: AgentEntry = {\n  agent: defineAgent({\n    schema: \"agent/v1\",\n    id: \"@agentproto/media-cataloger\",\n    description:\n      \"Scans a folder for media files (images, video, audio), collects metadata, and produces a structured catalog.\",\n    model: \"claude-sonnet-5\",\n    boundaries: [\n      \"Read-only — never modify, rename, move, or delete files\",\n      \"Only catalog files with recognized media extensions\",\n      \"Report exact file sizes and paths, never estimate\",\n    ],\n    tools: [\"list_dir\", \"read_file\", \"file_info\"],\n    workflows: [{ ref: \"scan-media\" }],\n  }),\n  body: [\n    \"You scan a workspace folder for media files and produce a structured JSON catalog.\",\n    \"\",\n    \"Walk the target directory recursively using list_dir. For each file, check the\",\n    \"extension against known media types:\",\n    \"- Images: .jpg, .jpeg, .png, .gif, .webp, .svg, .bmp, .ico, .avif\",\n    \"- Video: .mp4, .webm, .mov, .avi, .mkv\",\n    \"- Audio: .mp3, .wav, .ogg, .flac, .aac, .m4a\",\n    \"\",\n    \"For each media file found, use file_info to get size and modification date.\",\n    \"\",\n    \"Output a JSON object with this shape:\",\n    \"```json\",\n    '{',\n    '  \"folder\": \"<scanned path>\",',\n    '  \"scannedAt\": \"<ISO timestamp>\",',\n    '  \"summary\": { \"total\": N, \"images\": N, \"video\": N, \"audio\": N, \"totalSizeBytes\": N },',\n    '  \"files\": [',\n    '    {',\n    '      \"path\": \"relative/path.jpg\",',\n    '      \"name\": \"file.jpg\",',\n    '      \"type\": \"image\",',\n    '      \"extension\": \".jpg\",',\n    '      \"sizeBytes\": 123456,',\n    '      \"modifiedAt\": \"2026-08-01T12:00:00Z\"',\n    \"    }\",\n    \"  ]\",\n    \"}\",\n    \"```\",\n    \"\",\n    \"Sort files by type (images first, then video, then audio), then by name.\",\n  ].join(\"\\n\"),\n}\n","import { defineWorkflow } from \"@agentproto/workflow\"\n\nexport const scanMedia = defineWorkflow({\n  id: \"scan-media\",\n  name: \"Scan Media\",\n  description:\n    \"Scan a folder for media files, collect metadata, and produce a structured catalog.\",\n  version: \"0.1.0\",\n  inputs: {},\n  outputs: {},\n  steps: [\n    {\n      id: \"catalog\",\n      kind: \"agent\",\n      agent: { ref: \"@agentproto/media-cataloger\" },\n      prompt:\n        \"Scan the workspace root folder for media files (images, video, audio). \" +\n        \"Walk all subdirectories recursively. For each media file, collect its path, \" +\n        \"name, type, extension, size, and modification date. Output the full catalog \" +\n        \"as a single JSON object.\",\n    },\n  ],\n})\n","/**\n * Media Viewer — a self-contained MCP App gallery widget for `media-viewer`.\n *\n * Talks to the daemon only through the `window.McpApp.connect()` bridge\n * (never a direct `fetch`): every action round-trips through the app's own\n * `app_tool_call` gateway tool, `{ appId, tool, args }`. `app_tool_call`\n * double-wraps its dispatch result (it returns a text-result whose `text` is\n * the JSON-stringified inner tool result, itself an MCP content array) — see\n * `unwrapText` below, which peels that apart regardless of how many layers\n * the host's bridge already stripped.\n */\n\nexport const MEDIA_VIEWER_TOOLS = [\"directory_list\", \"file_info\", \"file_read\"] as const\n\nconst APP_ID = \"@agentproto/media-viewer\"\n\nexport const MEDIA_VIEWER_HTML = `<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>Media Viewer</title>\n<style>\n*{box-sizing:border-box;margin:0;padding:0}\n:root{\n  --bg:#0d1117;--bg2:#161b22;--bg3:#21262d;--border:#30363d;\n  --text:#e6edf3;--text2:#8b949e;\n  --green:#3fb950;--yellow:#d29922;--red:#f85149;--blue:#58a6ff;--purple:#bc8cff;\n}\nhtml,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;font-size:13px;background:var(--bg);color:var(--text)}\n#app{display:flex;flex-direction:column;height:100%}\n#toolbar{padding:10px 14px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;background:var(--bg2);flex-shrink:0}\n#toolbar .title{font-size:13px;font-weight:600;flex:1}\n#breadcrumb{font-size:12px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.abtn{background:var(--bg3);border:1px solid var(--border);color:var(--text);padding:5px 10px;border-radius:4px;cursor:pointer;font-size:12px;font-family:inherit}\n.abtn:hover{background:var(--border)}\n#body{flex:1;display:flex;overflow:hidden}\n#grid-wrap{flex:1;overflow-y:auto;padding:14px}\n#grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}\n.cell{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px;border:1px solid var(--border);border-radius:6px;background:var(--bg2);cursor:pointer;text-align:center}\n.cell:hover{background:var(--bg3);border-color:var(--blue)}\n.cell.selected{border-color:var(--blue);background:var(--bg3)}\n.icon{font-size:28px;line-height:1}\n.name{font-size:11px;color:var(--text);word-break:break-word;max-width:100%;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}\n#empty{color:var(--text2);padding:24px;text-align:center}\n#details{width:280px;border-left:1px solid var(--border);background:var(--bg2);padding:14px;overflow-y:auto;flex-shrink:0}\n#details h3{font-size:12px;color:var(--text2);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px}\n#details .row{display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px solid var(--border);font-size:12px}\n#details .row span:first-child{color:var(--text2)}\n#preview{margin-top:10px;padding:8px;background:var(--bg);border:1px solid var(--border);border-radius:4px;font-family:Menlo,Monaco,monospace;font-size:11px;white-space:pre-wrap;word-break:break-all;max-height:240px;overflow-y:auto}\n#status{padding:6px 14px;font-size:11px;color:var(--text2);border-top:1px solid var(--border);background:var(--bg2);flex-shrink:0}\n</style>\n</head>\n<body>\n<div id=\"app\">\n  <div id=\"toolbar\">\n    <button class=\"abtn\" id=\"up-btn\" title=\"Up one level\">&uarr;</button>\n    <span class=\"title\">Media Viewer</span>\n    <span id=\"breadcrumb\">.</span>\n    <button class=\"abtn\" id=\"refresh-btn\">Refresh</button>\n  </div>\n  <div id=\"body\">\n    <div id=\"grid-wrap\">\n      <div id=\"grid\"></div>\n      <div id=\"empty\" style=\"display:none\">No files in this folder.</div>\n    </div>\n    <div id=\"details\" style=\"display:none\"></div>\n  </div>\n  <div id=\"status\">Connecting&#8230;</div>\n</div>\n<script>\nvar APP_ID = ${JSON.stringify(APP_ID)};\nvar currentPath = \".\";\nvar entries = [];\nvar callTool = null;\n\nfunction setStatus(msg) {\n  document.getElementById(\"status\").textContent = msg;\n}\n\n// app_tool_call wraps its dispatch result at least once (its own\n// text-result body is the JSON-stringified inner MCP tool result); peel\n// back through nested {content:[{type:\"text\",text:...}]} shells until the\n// payload stops looking like one, so this works whichever layer the host's\n// own bridge already unwrapped.\nfunction unwrapText(result) {\n  var cur = result;\n  for (var i = 0; i < 4; i++) {\n    if (typeof cur === \"string\") {\n      try {\n        cur = JSON.parse(cur);\n        continue;\n      } catch (e) {\n        return cur;\n      }\n    }\n    if (cur && Array.isArray(cur.content) && cur.content[0] && typeof cur.content[0].text === \"string\") {\n      cur = cur.content[0].text;\n      continue;\n    }\n    break;\n  }\n  return cur;\n}\n\nfunction callApp(tool, args) {\n  return callTool(\"app_tool_call\", { appId: APP_ID, tool: tool, args: args || {} }).then(unwrapText);\n}\n\nfunction parseDirectoryListing(raw) {\n  var text = typeof raw === \"string\" ? raw : \"\";\n  return text\n    .split(\"\\\\n\")\n    .map(function (line) { return line.trim(); })\n    .filter(function (line) { return line.length > 0; })\n    .map(function (line) {\n      var isDir = line.indexOf(\"[DIR]\") === 0;\n      var name = line.replace(/^\\\\[(FILE|DIR)\\\\]\\\\s*/, \"\");\n      return { name: name, isDir: isDir };\n    });\n}\n\nfunction iconFor(entry) {\n  if (entry.isDir) return \"\\\\uD83D\\\\uDCC1\";\n  var ext = (entry.name.split(\".\").pop() || \"\").toLowerCase();\n  if ([\"jpg\", \"jpeg\", \"png\", \"gif\", \"webp\", \"svg\", \"bmp\", \"ico\", \"avif\"].indexOf(ext) !== -1) return \"\\\\uD83D\\\\uDDBC\\\\uFE0F\";\n  if ([\"mp4\", \"webm\", \"mov\", \"avi\", \"mkv\"].indexOf(ext) !== -1) return \"\\\\uD83C\\\\uDFA5\";\n  if ([\"mp3\", \"wav\", \"ogg\", \"flac\", \"aac\", \"m4a\"].indexOf(ext) !== -1) return \"\\\\uD83C\\\\uDFB5\";\n  return \"\\\\uD83D\\\\uDCC4\";\n}\n\nfunction joinPath(base, name) {\n  if (base === \".\" || base === \"\") return name;\n  return base.replace(/\\\\/+$/, \"\") + \"/\" + name;\n}\n\nfunction parentPath(path) {\n  if (path === \".\" || path.indexOf(\"/\") === -1) return \".\";\n  return path.slice(0, path.lastIndexOf(\"/\")) || \".\";\n}\n\nfunction renderGrid() {\n  document.getElementById(\"breadcrumb\").textContent = currentPath;\n  var grid = document.getElementById(\"grid\");\n  var empty = document.getElementById(\"empty\");\n  grid.innerHTML = \"\";\n  if (entries.length === 0) {\n    empty.style.display = \"block\";\n    return;\n  }\n  empty.style.display = \"none\";\n  entries.forEach(function (entry, idx) {\n    var cell = document.createElement(\"div\");\n    cell.className = \"cell\";\n    cell.dataset.idx = String(idx);\n    cell.innerHTML = '<div class=\"icon\">' + iconFor(entry) + '</div><div class=\"name\"></div>';\n    cell.querySelector(\".name\").textContent = entry.name;\n    cell.addEventListener(\"click\", function () { onSelect(entry, cell); });\n    grid.appendChild(cell);\n  });\n}\n\nfunction onSelect(entry, cell) {\n  Array.prototype.forEach.call(document.querySelectorAll(\".cell\"), function (c) {\n    c.classList.remove(\"selected\");\n  });\n  cell.classList.add(\"selected\");\n  if (entry.isDir) {\n    loadDirectory(joinPath(currentPath, entry.name));\n    return;\n  }\n  showFileDetails(joinPath(currentPath, entry.name));\n}\n\nfunction showFileDetails(path) {\n  var details = document.getElementById(\"details\");\n  details.style.display = \"block\";\n  details.innerHTML = \"<h3>Loading&#8230;</h3>\";\n  setStatus(\"Reading \" + path + \"\\\\u2026\");\n  callApp(\"file_info\", { path: path })\n    .then(function (info) {\n      var rows = \"\";\n      if (info && typeof info === \"object\") {\n        [\"name\", \"type\", \"size\", \"modified\"].forEach(function (key) {\n          if (info[key] !== undefined) {\n            rows += '<div class=\"row\"><span>' + key + '</span><span></span></div>';\n          }\n        });\n      }\n      details.innerHTML = \"<h3>Details</h3>\" + rows + '<div id=\"preview\">Loading preview&#8230;</div>';\n      var rowEls = details.querySelectorAll(\".row span:last-child\");\n      var keys = [\"name\", \"type\", \"size\", \"modified\"].filter(function (key) {\n        return info && info[key] !== undefined;\n      });\n      keys.forEach(function (key, i) {\n        rowEls[i].textContent = String(info[key]);\n      });\n      return callApp(\"file_read\", { path: path });\n    })\n    .then(function (content) {\n      var pre = document.getElementById(\"preview\");\n      if (!pre) return;\n      var text = typeof content === \"string\" ? content : JSON.stringify(content);\n      pre.textContent = text.length > 2000 ? text.slice(0, 2000) + \"\\\\u2026 (truncated)\" : (text || \"(empty file)\");\n      setStatus(\"Ready \\\\u00b7 \" + currentPath);\n    })\n    .catch(function (err) {\n      var pre = document.getElementById(\"preview\");\n      if (pre) pre.textContent = \"Preview unavailable (\" + err.message + \")\";\n      setStatus(\"Ready \\\\u00b7 \" + currentPath);\n    });\n}\n\nfunction loadDirectory(path) {\n  document.getElementById(\"details\").style.display = \"none\";\n  setStatus(\"Loading \" + path + \"\\\\u2026\");\n  return callApp(\"directory_list\", { path: path })\n    .then(function (raw) {\n      currentPath = path;\n      entries = parseDirectoryListing(raw).sort(function (a, b) {\n        if (a.isDir !== b.isDir) return a.isDir ? -1 : 1;\n        return a.name.localeCompare(b.name);\n      });\n      renderGrid();\n      setStatus(\"Ready \\\\u00b7 \" + entries.length + \" entries \\\\u00b7 \" + path);\n    })\n    .catch(function (err) {\n      entries = [];\n      renderGrid();\n      setStatus(\"Error: \" + err.message);\n    });\n}\n\ndocument.getElementById(\"up-btn\").addEventListener(\"click\", function () {\n  loadDirectory(parentPath(currentPath));\n});\ndocument.getElementById(\"refresh-btn\").addEventListener(\"click\", function () {\n  loadDirectory(currentPath);\n});\n\nwindow.McpApp.connect()\n  .then(function (bridge) {\n    callTool = bridge.callTool;\n    return loadDirectory(\".\");\n  })\n  .catch(function (err) {\n    setStatus(\"Standalone mode \\\\u2014 no host bridge (\" + err.message + \")\");\n    entries = [];\n    renderGrid();\n  });\n</script>\n</body>\n</html>`\n","/**\n * `media-viewer` — a single-agent agentproto app for media cataloging.\n *\n * One agent (cataloger) scans a workspace folder for images, video, and audio\n * files, collects metadata, and produces a structured JSON catalog. Paired\n * with a Cowork McpApp gallery widget for visual browsing.\n */\n\nimport { defineApp, type AppHandle } from \"@agentproto/app-kit\"\nimport { cataloger } from \"./agents/cataloger.js\"\nimport { scanMedia } from \"./workflows/scan-media.js\"\nimport { MEDIA_VIEWER_HTML, MEDIA_VIEWER_TOOLS } from \"./ui.js\"\n\nexport const mediaViewer: AppHandle = defineApp({\n  id: \"@agentproto/media-viewer\",\n  name: \"Media Viewer\",\n  version: \"0.1.0\",\n  description: \"Scan a folder for images, video, and audio — gallery view.\",\n  agents: [cataloger],\n  workflows: [scanMedia],\n  ui: {\n    html: MEDIA_VIEWER_HTML,\n    title: \"Media Viewer\",\n    tools: [...MEDIA_VIEWER_TOOLS],\n  },\n})\n\nexport { cataloger, scanMedia }\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agentproto/apps",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "@agentproto/apps — a home for ready-made agentproto apps (teams of agents + their workflows), declared with @agentproto/app-kit. Import a team (code-team, content-team, …) and use any of its agents/workflows from your own host: in-process via toMastraAgents(), or emit its manifests to disk.",
   "keywords": [
     "agentproto",
@@ -25,6 +25,9 @@
   "main": "dist/index.mjs",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",
+  "bin": {
+    "agentproto-apps-sync": "dist/bin/sync.mjs"
+  },
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -63,7 +66,7 @@
   },
   "dependencies": {
     "@agentproto/agent": "0.2.1",
-    "@agentproto/app-kit": "0.4.0",
+    "@agentproto/app-kit": "0.5.0",
     "@agentproto/workflow": "0.2.0"
   },
   "peerDependencies": {