\n ${showId ? (logo ? `![\"Natura\"/](\"${esc(logo)}\")
` : '
`\n },\n mounted(d2) {\n d2.on('[data-view]', 'click', (e, el) => {\n field(d2, 'viewMode').set(el.dataset.view)\n field(d2, 'focusedSlot').set('1')\n })\n d2.on('[data-tab]', 'click', (e, el) => field(d2, 'activeTab').set(el.dataset.tab))\n d2.on('[data-act=\"status\"]', 'click', (e) => { e.stopPropagation(); d2.state.statusOpen = !d2.state.statusOpen })\n d2.on('[data-st]', 'click', (e, el) => {\n e.stopPropagation()\n const o = statusOptions(d2)[Number(el.dataset.st)]\n d2.setState({ statusOpen: false })\n if (!o) return\n field(d2, 'agentStatus').set(o)\n d2.emit('onStatusChange', o)\n // ponte (tela dentro de iframe): o agentDeskBridgeGuest repassa para o app de fora\n try { window.dispatchEvent(new CustomEvent('agentDesk:action', { detail: { type: 'onStatusChange', payload: { _id: o._id, title: o.title, type: o.type } } })) } catch (err) {}\n })\n d2.on(document, 'click', () => { if (d2.state.statusOpen) d2.state.statusOpen = false })\n },\n}\n"}},"store":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"store"}}}},"logoUrl":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"logoUrl"}}}},"agentName":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"agentName"}}}},"agentRole":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"agentRole"}}}},"statusLabel":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"statusLabel"}}}},"statusType":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"statusType"}}}},"statusOptions":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"statusOptions"}}}},"conversationsCount":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"conversationsCount"}}}},"onStatusChange":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onStatusChange"}}}},"showIdentity":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"showIdentity"}}}}}}}}}},{"_id":"6af1d00bd169681f5e7c8ac5","component":"data2-core-types@Component","system":"6671e96b001009d97f222f73","params":{"extends":"data2-core-primitives@Block","component":"agentDeskConversationList","package":"natura-br-cf","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"// Lista \"Conversas em andamento\". Lê tudo do store (data.conversations, seleção, foco e modo).\nconst esc = (s) => String(s ?? '').replace(/[&<>\"']/g, (c) => ({ '&': '&', '<': '<', '>': '>', '\"': '"', \"'\": ''' }[c]))\nconst initials = (n) => String(n || '').trim().split(/\\s+/).slice(0, 2).map((p) => p[0] || '').join('').toUpperCase()\nconst AVATAR = ['#e0962b', '#d0706a', '#7c9a6a', '#6a85b8', '#b07cc6']\nconst SLOT_COLOR = { 1: '#e0962b', 2: '#c45f3c' }\nconst ICON_CLOCK = ``\nconst clock = (since, now) => {\n if (!since) return '--:--'\n const s = Math.max(0, Math.floor((now - new Date(since).getTime()) / 1000))\n const h = Math.floor(s / 3600), m = Math.floor((s % 3600) / 60), x = s % 60\n const p = (n) => String(n).padStart(2, '0')\n return h ? `${h}:${p(m)}:${p(x)}` : `${p(m)}:${p(x)}`\n}\nconst field = (d2, key) => d2.field(d2.params.store, 'data.' + key)\n// mesma regra do workspace para saber qual conversa está em destaque\nconst activeId = (d2, convs, dual) => {\n if (dual) { const c = convs[Number(field(d2, 'focusedSlot').value || 1) - 1]; return c ? c._id : '' }\n const sel = field(d2, 'selectedConversationId').value\n const c = convs.find((x) => x._id === sel) || convs[0]\n return c ? c._id : ''\n}\n\nexport default {\n css: `\n :host{display:block;height:100%}\n .wrap{height:100%;box-sizing:border-box;display:flex;flex-direction:column;font-family:'NaturaCo','Inter',system-ui,sans-serif;color:#2a2622;background:#fff}\n .head{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 10px}\n .title{font-size:15px;font-weight:600}\n .chip{font-size:11px;color:#8a8178;background:#f3eee8;border-radius:10px;padding:2px 8px}\n .list{display:flex;flex-direction:column;gap:4px;padding:0 8px 10px;overflow:auto}\n .row{display:flex;align-items:center;gap:12px;padding:10px;border-radius:12px;cursor:pointer;border:1px solid transparent}\n .row:hover{background:#faf6f0}\n .row.on{background:var(--on-bg,#fdf1df);border-color:var(--on-line,#f6dfb8)}\n .av{position:relative;flex:none;width:36px;height:36px;border-radius:50%;color:#fff;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center}\n .av i{position:absolute;right:-1px;bottom:-1px;width:10px;height:10px;border-radius:50%;background:#3aa65c;border:2px solid #fff}\n .slot{position:absolute;left:-4px;top:-4px;min-width:16px;height:16px;border-radius:8px;font-size:10px;font-weight:700;color:#fff;display:flex;align-items:center;justify-content:center;border:2px solid #fff}\n .name{flex:1;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n .time{display:flex;align-items:center;gap:4px;font-size:11px;color:#5d554d;background:#fff;border:1px solid #ece7df;border-radius:10px;padding:2px 7px}\n .empty{padding:18px 16px;font-size:13px;color:#8a8178}\n .q{margin-left:6px;font-size:10px;font-weight:600;color:#b8741b;background:#fdf1df;border-radius:8px;padding:2px 6px;vertical-align:middle}\n `,\n render(d2) {\n const convs = field(d2, 'conversations').value || []\n const dual = field(d2, 'viewMode').value === 'dual'\n const active = activeId(d2, convs, dual)\n const max = d2.param('maxConversations', 2)\n const now = Date.now()\n const rows = convs.map((c, i) => {\n const slot = dual && i < 2 ? String(i + 1) : ''\n // no modo 2 conversas o destaque usa a cor da conversa em foco\n const style = c._id === active && slot === '2' ? 'style=\"--on-bg:#fbe8e1;--on-line:#f1c9b9\"' : ''\n return `logo da empresa
') : ''}\n \n \n \n
\n \n \n \n \n
\n ${showId ? `\n \n ${d2.state.statusOpen ? `` : ''}\n
\n \n \n
` : ''}\n ${esc(initials(agentName))}
\n ${esc(agentName)}
${esc(agentRole)}
\n
`\n }).join('')\n return `${esc(initials(c.name))}${slot ? `${slot}` : ''}
\n ${esc(c.name)}${c.transfer && c.transfer.status === 'in_queue' ? 'Na fila' : ''}
\n ${ICON_CLOCK}${clock(c.since, now)}
\n \n \n
`\n },\n mounted(d2) {\n d2.on('.row', 'click', (e, el) => d2.emit('onSelect', el.dataset.id))\n // relógio: atualiza só o texto, sem re-render\n const t = setInterval(() => {\n const now = Date.now()\n d2.$$('[data-since]').forEach((el) => { el.textContent = clock(el.dataset.since, now) })\n }, 1000)\n d2.onUnmount(() => clearInterval(t))\n },\n}\n"}},"store":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"store"}}}},"maxConversations":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"maxConversations"}}}},"onSelect":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onSelect"}}}}}}}}}},{"_id":"6af1d01ac3bb7547e8619e52","component":"data2-core-types@Component","system":"6671e96b001009d97f222f73","params":{"extends":"data2-core-primitives@Block","component":"agentDeskQuickMessages","package":"natura-br-cf","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"// Mensagens rápidas. Lê do store `data.quickMessages`: [{ _id, title, text, scope: 'mine' | 'general' }].\n// - mine: mensagens do agente; ele define a ordem arrastando pelo puxador (⋮⋮).\n// - general: mensagens da equipe; ordem definida pela gestão (sem arraste).\n// mode 'panel' (lateral do atendimento) ou 'manage' (aba Gerenciar Mensagens Rápidas).\n// A nova ordem sai por onReorder({ scope:'mine', ids }) — quem grava é o UC.\nconst esc = (s) => String(s ?? '').replace(/[&<>\"']/g, (c) => ({ '&': '&', '<': '<', '>': '>', '\"': '"', \"'\": ''' }[c]))\nconst norm = (s) => String(s || '').toLowerCase().normalize('NFD').replace(/[̀-ͯ]/g, '')\nconst field = (d2, key) => d2.field(d2.params.store, 'data.' + key)\n// fila da conversa em foco (mesma regra do workspace): no painel só aparecem as mensagens dessa fila\n// (mensagem sem fila marcada vale para todas)\nconst focusedQueue = (d2) => {\n const convs = field(d2, 'conversations').value || []\n let c\n if (field(d2, 'viewMode').value === 'dual') c = convs[Number(field(d2, 'focusedSlot').value || '1') - 1]\n else { const sel = field(d2, 'selectedConversationId').value; c = convs.find((x) => x._id === sel) || convs[0] }\n return c && c.transfer && c.transfer.queueId ? String(c.transfer.queueId) : ''\n}\nconst forQueue = (m, qid) => !qid || !m.queues || !m.queues.length || m.queues.map(String).includes(qid)\nconst I = {\n bolt: ``,\n send: ``,\n search: ``,\n grip: ``,\n lock: ``,\n}\n\n// ---- arraste: move o item com o ponteiro e desliza os vizinhos; ao soltar, emite a nova ordem ----\nconst startDrag = (d2, e, grip) => {\n const item = grip.closest('.item'); if (!item) return\n const items = d2.$$('.item[data-scope=\"mine\"]')\n const from = items.indexOf(item); if (from < 0) return\n e.preventDefault()\n const rects = items.map((el) => el.getBoundingClientRect())\n const gap = items.length > 1 ? Math.max(0, rects[1].top - rects[0].bottom) : 0\n const step = rects[from].height + gap\n const mids = rects.map((r) => r.top + r.height / 2)\n const list = d2.$('.list')\n let dy = 0, to = from, lastY = e.clientY, scrollBase = list ? list.scrollTop : 0\n item.classList.add('dragging')\n items.forEach((el) => { if (el !== item) el.classList.add('shifting') })\n const paint = () => {\n const scrolled = list ? list.scrollTop - scrollBase : 0\n const center = mids[from] + dy + scrolled\n to = 0\n mids.forEach((m, i) => { if (i !== from && m < center) to += 1 })\n item.style.transform = `translateY(${dy + scrolled}px)`\n items.forEach((el, i) => {\n if (el === item) return\n let shift = 0\n if (from < to && i > from && i <= to) shift = -step\n if (to < from && i >= to && i < from) shift = step\n el.style.transform = shift ? `translateY(${shift}px)` : ''\n })\n }\n const move = (ev) => {\n lastY = ev.clientY\n dy = ev.clientY - e.clientY\n // rola a lista quando o ponteiro chega perto das bordas\n if (list) {\n const lr = list.getBoundingClientRect()\n if (lastY < lr.top + 30) list.scrollTop -= 8\n else if (lastY > lr.bottom - 30) list.scrollTop += 8\n }\n paint()\n }\n const end = () => {\n window.removeEventListener('pointermove', move)\n window.removeEventListener('pointerup', end)\n window.removeEventListener('pointercancel', end)\n items.forEach((el) => { el.classList.remove('dragging', 'shifting'); el.style.transform = '' })\n if (to !== from) {\n const ids = items.map((el) => el.dataset.id)\n const [moved] = ids.splice(from, 1)\n ids.splice(to, 0, moved)\n d2.emit('onReorder', { scope: 'mine', ids })\n }\n }\n window.addEventListener('pointermove', move)\n window.addEventListener('pointerup', end)\n window.addEventListener('pointercancel', end)\n d2.onUnmount(end)\n}\n\nexport default {\n css: `\n :host{display:block;height:100%}\n .wrap{height:100%;box-sizing:border-box;display:flex;flex-direction:column;font-family:'NaturaCo','Inter',system-ui,sans-serif;color:#2a2622;background:#fff;border-top:1px solid #ece7df}\n .wrap.manage{border-top:0;background:#f7f5f2;padding:24px}\n .box{display:flex;flex-direction:column;min-height:0;flex:1}\n .manage .box{max-width:760px;width:100%;margin:0 auto;background:#fff;border:1px solid #ece7df;border-radius:16px;padding:8px 0}\n .head{display:flex;align-items:center;gap:8px;padding:14px 16px 8px;font-size:13px;font-weight:600}\n .manage .head{font-size:16px;padding:16px 20px 4px}\n .head .b{color:#e0962b;display:flex}\n .chip{margin-left:auto;font-size:11px;color:#8a8178;background:#f3eee8;border-radius:10px;padding:2px 8px;font-weight:400}\n .sub{padding:0 20px 10px;font-size:12.5px;color:#8a8178}\n .search{margin:0 12px 8px;display:flex;align-items:center;gap:8px;border:1px solid #e6dfd5;border-radius:10px;padding:8px 10px;color:#8a8178;background:#faf8f5}\n .manage .search{margin:4px 20px 10px}\n .search input{border:0;outline:0;background:transparent;font:inherit;font-size:13px;flex:1;color:#2a2622}\n .list{flex:1;overflow:auto;padding:0 8px 12px}\n .manage .list{padding:0 12px 12px}\n .group{display:flex;align-items:center;gap:6px;padding:10px 8px 6px;font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#9a9088}\n .group small{font-weight:400;letter-spacing:0;text-transform:none;display:flex;align-items:center;gap:4px}\n .item{position:relative;padding:12px 40px 12px 26px;margin-bottom:9px;border-radius:10px;cursor:pointer;background:#fff}\n .manage .item{cursor:default}\n .item:hover{background:#fdf1df}\n /* separador desligado a pedido (09/11); para voltar: .item:not(:last-child)::after{content:'';position:absolute;left:50%;bottom:-5px;transform:translateX(-50%);width:40%;height:1px;background:#ebe4da} */\n .item:last-child{margin-bottom:0}\n .item.shifting{transition:transform .16s ease}\n .item.dragging{z-index:5;background:#fff;box-shadow:0 10px 24px rgba(42,38,34,.18);cursor:grabbing}\n .item.dragging::after,.item.shifting::after{opacity:0}\n .grip{position:absolute;left:4px;top:50%;transform:translateY(-50%);width:18px;height:28px;border:0;background:transparent;color:#b3a99d;display:flex;align-items:center;justify-content:center;cursor:grab;opacity:0;border-radius:6px;padding:0;touch-action:none}\n .item:hover .grip,.manage .grip,.dragging .grip{opacity:1}\n .grip:hover{background:#f3eee8;color:#8a8178}\n .cat{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:700;letter-spacing:.04em;color:#b8741b;text-transform:uppercase;margin-bottom:3px}\n .txt{font-size:12.5px;line-height:1.4;color:#4a433c}\n .manage .txt{font-size:13.5px}\n .qs{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:0;border-radius:8px;background:#fff;color:#b8741b;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .12s;box-shadow:0 1px 3px rgba(42,38,34,.12)}\n .item:hover .qs,.qs:focus{opacity:1}\n .qs:hover{background:#e0962b;color:#fff}\n .lockgrip{position:absolute;left:8px;top:50%;transform:translateY(-50%);color:#cfc6bb;display:flex}\n .empty{padding:12px 8px;font-size:12px;color:#8a8178}\n .new{margin-left:12px;border:0;border-radius:9px;background:#e0962b;color:#fff;font:inherit;font-size:12.5px;font-weight:600;padding:7px 12px;cursor:pointer}\n .acts{display:flex;gap:6px;margin-top:8px}\n .acts button{border:1px solid #e6dfd5;background:#fff;border-radius:8px;padding:4px 10px;font:inherit;font-size:12px;color:#5d554d;cursor:pointer}\n .acts button:hover{background:#fdf1df}\n .acts .del:hover{background:#fbe8e1;color:#c45f3c;border-color:#f1c9b9}\n .qtags{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}\n .qtags span{font-size:10.5px;color:#6a85b8;background:#eef2fa;border-radius:8px;padding:2px 7px}\n .form{margin:4px 8px 14px;padding:14px;border:1px solid #f1d9b0;background:#fffaf2;border-radius:12px;display:flex;flex-direction:column;gap:8px}\n .form .ft{font-size:13px;font-weight:600}\n .form input,.form textarea{border:1px solid #e6dfd5;border-radius:8px;padding:8px 10px;font:inherit;font-size:13px;background:#fff;color:#2a2622;resize:vertical}\n .form input:focus,.form textarea:focus{outline:0;border-color:#e0962b}\n .fq{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12.5px;color:#4a433c}\n .fq span{width:100%;font-size:11.5px;color:#8a8178}\n .fq label{display:flex;align-items:center;gap:5px;cursor:pointer}\n .fa{display:flex;justify-content:flex-end;gap:8px}\n .fa button{border:0;border-radius:9px;padding:7px 14px;font:inherit;font-size:13px;cursor:pointer}\n .fa .cancel{background:#f3eee8;color:#5d554d}\n .fa .save{background:#e0962b;color:#fff;font-weight:600}\n `,\n render(d2) {\n const manage = d2.param('mode') === 'manage'\n const all = field(d2, 'quickMessages').value || []\n const q = norm(d2.state.q)\n const match = (m) => !q || norm(m.title).includes(q) || norm(m.text).includes(q)\n const qid = manage ? '' : focusedQueue(d2)\n const opts = field(d2, 'queueOptions').value || []\n const qname = (id) => { const o = opts.find((x) => String(x._id) === String(id)); return o ? o.name : '' }\n const mine = all.filter((m) => m.scope !== 'general' && match(m) && forQueue(m, qid))\n const general = all.filter((m) => m.scope === 'general' && match(m) && forQueue(m, qid))\n // com filtro (texto ou fila) a lista é parcial: arraste desligado\n const canDrag = !q && mine.length === all.filter((m) => m.scope !== 'general').length\n const ed = manage ? d2.state.editing : null\n const form = ed ? `Conversas em andamento
${convs.length}/${max}
${rows || '
\n Nenhuma conversa em andamento.
'}\n
` : ''\n const item = (m, draggable) => `${ed._id ? 'Editar mensagem' : 'Nova mensagem'}
\n \n \n ${opts.length ? `Filas onde aparece (nenhuma marcada = todas)${opts.map((o) => ``).join('')}
` : ''}\n \n \n ${draggable && canDrag ? `` : ''}\n ${!draggable && manage ? `${I.lock}` : ''}\n
`\n const groups = `\n ${mine.length ? `${I.bolt}${esc(m.title)}
\n ${esc(m.text)}
\n ${manage && m.queues && m.queues.length ? `` : ''}\n ${manage && draggable ? `` : ''}\n ${manage ? '' : ``}\n Minhas mensagens
${mine.map((m) => item(m, true)).join('')}` : ''}\n ${general.length ? `Da equipe ${I.lock} ordem definida pela gestão
${general.map((m) => item(m, false)).join('')}` : ''}`\n return `\n
${I.bolt}${manage ? 'Gerenciar mensagens rápidas' : 'Mensagens rápidas'}${all.length}${manage && !ed ? '' : ''}
\n ${manage ? 'Arraste pelo ⋮⋮ para definir a ordem das suas mensagens. As mensagens da equipe seguem a ordem definida pela gestão.
' : ''}\n \n ${form}${mine.length || general.length ? groups : '
\n Nenhuma mensagem encontrada.
'}' : ''}${m.type === 'image' ? '🖼️' : m.type === 'audio' ? '🎧' : m.type === 'video' ? '🎬' : '📎'} abrir anexo` : '')\nconst MAX_FILE = 10 * 1024 * 1024\nconst ACCEPT = '.csv,.pdf,.xls,.xlsx,.mp4,.txt,.jpeg,.jpg,.png,.doc,.docx'\nconst slotOf = (d2) => String(d2.param('slot', '1'))\n// estado da conversa deste painel, sempre lido na hora\nconst ctx = (d2) => {\n const convs = field(d2, 'conversations').value || []\n const dual = field(d2, 'viewMode').value === 'dual'\n const slot = slotOf(d2)\n let conv\n if (dual) conv = convs[Number(slot) - 1] || null\n else { const sel = field(d2, 'selectedConversationId').value; conv = convs.find((c) => c._id === sel) || convs[0] || null }\n const focused = !dual || String(field(d2, 'focusedSlot').value || '1') === slot\n const colors = SLOT[dual ? slot : '1'] || SLOT[1]\n return { conv, dual, slot, focused, colors }\n}\n\n// sincroniza input/placeholder e rolagem com a conversa exibida (chamado no mounted e no updated)\nconst syncView = (d2) => {\n const panel = d2.$('.panel'); if (!panel) return\n const cid = panel.dataset.cid || ''\n const count = d2.$$('.msgs [data-key]').length\n // trocou de conversa: limpa o rascunho e atualiza o placeholder (input é data-d2-static)\n if (cid !== d2.root.dataset.cid) {\n d2.root.dataset.cid = cid\n const i = d2.$('.composer .txt')\n if (i) { i.value = ''; i.placeholder = `Escreva uma mensagem para ${panel.dataset.first || ''}...` }\n }\n // chegou mensagem nova ou trocou de conversa: rola para o fim\n const sig = `${cid}:${count}`\n if (sig !== d2.root.dataset.sig) {\n d2.root.dataset.sig = sig\n const box = d2.$('.msgs'); if (box) box.scrollTop = box.scrollHeight\n }\n}\n\nexport default {\n css: `\n :host{display:block;height:100%}\n .panel{height:100%;box-sizing:border-box;display:flex;flex-direction:column;background:#f4f1ec;font-family:'NaturaCo','Inter',system-ui,sans-serif;color:#2a2622;position:relative}\n /* modo 2 conversas: a conversa fora de foco fica apagada (clareia no hover para indicar que dá para clicar) */\n .panel.dual>.head,.panel.dual>.msgs,.panel.dual>.composer{transition:opacity .18s,filter .18s}\n .panel.dual:not(.focused)>.head,.panel.dual:not(.focused)>.msgs,.panel.dual:not(.focused)>.composer{opacity:.5;filter:grayscale(.55)}\n .panel.dual:not(.focused):hover>.head,.panel.dual:not(.focused):hover>.msgs,.panel.dual:not(.focused):hover>.composer{opacity:.75}\n .head{display:flex;align-items:center;gap:12px;padding:12px 20px 12px 16px;background:#fff;border-bottom:1px solid #ece7df;position:relative;z-index:3}\n .left{display:flex;align-items:center;gap:12px;flex:1;min-width:0;overflow:hidden}\n .right{display:flex;align-items:center;gap:6px;flex:none;margin-left:16px}\n .av{position:relative;flex:none;width:40px;height:40px;border-radius:50%;background:var(--accent);color:#fff;font-weight:600;font-size:14px;display:flex;align-items:center;justify-content:center}\n .av i{position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:50%;background:#3aa65c;border:2px solid #fff}\n .nm{flex:0 1 auto;font-size:16px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:40px}\n .tag{font-size:11px;border-radius:8px;padding:3px 8px;white-space:nowrap}\n .tag.ok{background:#e6f4ea;color:#2f8a4c}\n .tag.slot{background:var(--accent-soft);color:var(--accent);font-weight:700}\n .timer{display:flex;align-items:center;gap:4px;font-size:12px;border:1px solid #ece7df;border-radius:10px;padding:3px 8px;color:#5d554d;white-space:nowrap;flex:none;font-variant-numeric:tabular-nums}\n .timer span{display:inline-block;min-width:5.2ch;text-align:left}\n .tag{flex:none}\n .sp{flex:1}\n .btn{display:flex;align-items:center;gap:6px;border:0;border-radius:9px;padding:8px 14px;background:var(--accent);color:#fff;font:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}\n .more{position:relative}\n .more>button{border:0;background:transparent;color:#8a8178;padding:6px;border-radius:8px;cursor:pointer;display:flex}\n .more>button:hover{background:#f3eee8}\n .menu{position:absolute;right:0;top:36px;z-index:20;min-width:220px;background:#fff;border:1px solid #ece7df;border-radius:12px;box-shadow:0 8px 24px rgba(42,38,34,.12);padding:6px}\n .menu button{display:block;width:100%;text-align:left;border:0;background:transparent;border-radius:8px;padding:9px 12px;font:inherit;font-size:13px;color:#2a2622;cursor:pointer}\n .menu button:hover{background:#fdf1df}\n .msgs{flex:1;overflow:auto;padding:18px 20px;display:flex;flex-direction:column;gap:10px}\n .day{font-size:11px;color:#8a8178;letter-spacing:.04em}\n .sys{align-self:center;font-size:12px;color:#5d554d;background:#ebe5dd;border-radius:12px;padding:5px 12px}\n .line{display:flex;gap:8px;align-items:flex-end;max-width:78%}\n .line.me{align-self:flex-end;flex-direction:row-reverse}\n .mini{flex:none;width:28px;height:28px;border-radius:50%;background:var(--accent);color:#fff;font-size:10px;font-weight:600;display:flex;align-items:center;justify-content:center}\n .bubble{border-radius:14px;padding:10px 14px;font-size:13.5px;line-height:1.45;white-space:pre-wrap;word-break:break-word}\n .them .bubble{background:#fff;border:1px solid #ece7df;border-bottom-left-radius:4px}\n .me .bubble{background:var(--accent);color:#fff;border-bottom-right-radius:4px}\n .bot .bubble{background:#fbf6ee;border:1px dashed #e6d3b3}\n .bot .who{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:#b8741b;margin-bottom:3px}\n .att{display:inline-block;margin-top:4px;font-size:12px;text-decoration:underline;color:inherit}\n .meta{font-size:10.5px;color:#9a9088;margin-top:3px;display:flex;align-items:center;gap:4px}\n .me .meta{justify-content:flex-end}\n .composer{position:relative;display:flex;align-items:center;gap:10px;margin:10px 16px 14px;background:#fff;border:1px solid #e6dfd5;border-radius:14px;padding:6px 6px 6px 12px}\n .composer:focus-within{border-color:var(--accent)}\n .composer input{flex:1;min-width:0;border:0;outline:0;font:inherit;font-size:13.5px;background:transparent;color:#2a2622}\n .ic{border:0;background:transparent;color:#8a8178;display:flex;padding:6px;border-radius:8px;cursor:pointer}\n .ic:hover{background:#f3eee8}\n .send{border:0;width:36px;height:36px;flex:none;border-radius:10px;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;cursor:pointer}\n .send:hover{background:var(--accent);color:#fff}\n .emojis{position:absolute;right:46px;bottom:52px;z-index:20;display:grid;grid-template-columns:repeat(8,30px);gap:2px;background:#fff;border:1px solid #ece7df;border-radius:12px;box-shadow:0 8px 24px rgba(42,38,34,.12);padding:6px}\n .emojis button{border:0;background:transparent;font-size:18px;border-radius:6px;cursor:pointer;padding:2px}\n .emojis button:hover{background:#fdf1df}\n .empty{flex:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;color:#8a8178;font-size:13px;text-align:center;padding:24px}\n .empty b{color:#2a2622;font-size:15px}\n .ic.mic.rec{color:#d9534f;gap:6px;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;align-items:center}\n .rdot{width:8px;height:8px;border-radius:50%;background:#d9534f;animation:rp 1s infinite}\n @keyframes rp{50%{opacity:.3}}\n .busy{font-size:12px;color:#8a8178;padding:0 6px}\n .queued{display:flex;align-items:center;gap:12px;justify-content:space-between;margin:10px 16px 14px;background:#fff;border:1px dashed var(--accent);border-radius:14px;padding:10px 12px 10px 16px;font-size:13px;color:#5d554d}\n .queued b{color:#2a2622}\n .btn[disabled]{opacity:.6;cursor:default}\n .tag.q{background:#fdf1df;color:#b8741b}\n `,\n render(d2) {\n const { conv: c, dual, slot, focused, colors } = ctx(d2)\n // a distribuição do servidor já entrega o atendimento em andamento (in_progress); a tela não recebe in_queue.\n // Se um dia aparecer, mostra só o aviso, sem envio.\n const queued = !!(c && c.transfer && c.transfer.status === 'in_queue')\n const style = `--accent:${colors.accent};--accent-soft:${colors.soft}`\n const cls = `panel ${dual ? 'dual' : ''} ${focused ? 'focused' : ''}`\n if (!c) {\n return `
${dual ? `Conversa ${esc(slot)} livre` : 'Nenhuma conversa aberta'}Quando um novo atendimento chegar, ele aparece aqui.
${esc(day)}
` : ''\n lastDay = day || lastDay\n const key = esc(m.id || m._id || `m${i}`)\n if (m.sender === 'SYSTEM') return `${dayHtml}${esc(m.text)}
`\n if (m.sender === 'AGENT') return `${dayHtml}${msgBody(m)}
${bot ? I.star : esc(initials(c.name))}
${bot ? `
${I.star} Assistente virtual
` : ''}${msgBody(m)}\n
`\n },\n mounted(d2) {\n const input = () => d2.$('.composer .txt')\n const send = () => {\n const el = input(); if (!el) return\n const text = el.value.trim(); if (!text) return\n el.value = ''\n d2.emit('onSend', { slot: slotOf(d2), text })\n }\n d2.on('.panel', 'mousedown', () => { if (!ctx(d2).focused) d2.emit('onFocus', slotOf(d2)) })\n d2.on('[data-act=\"send\"]', 'click', send)\n d2.on('.composer .txt', 'keydown', (e) => { if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); send() } })\n d2.on('[data-act=\"close\"]', 'click', () => d2.emit('onCloseConversation', { slot: slotOf(d2) }))\n // áudio: 1º clique grava, 2º clique para e envia; o X descarta\n d2.on('[data-act=\"mic\"]', 'click', () => { if (d2.state.rec) stopRec(d2, false); else startRec(d2) })\n d2.on('[data-act=\"mic-cancel\"]', 'click', () => stopRec(d2, true))\n d2.onUnmount(() => stopRec(d2, true))\n d2.on('[data-act=\"menu\"]', 'click', (e) => { e.stopPropagation(); d2.setState({ menu: !d2.state.menu, emoji: false }) })\n d2.on('[data-menu]', 'click', (e, el) => { e.stopPropagation(); d2.state.menu = false; d2.emit('onMenuAction', { slot: slotOf(d2), action: el.dataset.menu }) })\n // anexo: escolhe o arquivo aqui na tela (o gesto do usuário fica no iframe) e manda o arquivo pela ponte\n d2.on('[data-act=\"attach\"]', 'click', () => { const f = d2.$('.composer .file'); if (f) f.click() })\n d2.on('.composer .file', 'change', (e, el) => {\n const file = el.files && el.files[0]\n el.value = ''\n if (!file) return\n if (file.size > MAX_FILE) { if (d2.dialog && d2.dialog.alert) d2.dialog.alert('O arquivo passa de 10 MB.'); return }\n d2.emit('onAttach', { slot: slotOf(d2), file })\n })\n d2.on('[data-act=\"emoji\"]', 'click', (e) => { e.stopPropagation(); d2.setState({ emoji: !d2.state.emoji, menu: false }) })\n d2.on('[data-emoji]', 'click', (e, el) => {\n e.stopPropagation()\n const i = input(); if (i) { i.value += el.dataset.emoji; i.focus() }\n d2.state.emoji = false\n })\n d2.on(document, 'click', () => { if (d2.state.menu || d2.state.emoji) d2.setState({ menu: false, emoji: false }) })\n if (d2.bus) d2.bus.on('agentDesk:insertText', (p) => {\n if (!p || String(p.slot) !== slotOf(d2)) return\n const i = input(); if (!i) return\n i.value = i.value ? `${i.value} ${p.text}` : p.text\n i.focus()\n })\n const t = setInterval(() => { d2.$$('[data-since]').forEach((el) => { el.textContent = clock(el.dataset.since, Date.now()) }) }, 1000)\n d2.onUnmount(() => clearInterval(t))\n syncView(d2)\n },\n updated(d2) {\n syncView(d2)\n },\n}\n"}},"store":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"store"}}}},"slot":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"slot"}}}},"onFocus":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onFocus"}}}},"onSend":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onSend"}}}},"onCloseConversation":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onCloseConversation"}}}},"onMenuAction":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onMenuAction"}}}},"onAttach":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onAttach"}}}}}}}}}},{"_id":"6af1d07008aee8a1aa8c2a47","component":"data2-core-types@Component","system":"6671e96b001009d97f222f73","params":{"extends":"data2-core-primitives@Block","component":"agentDeskCustomerPanel","package":"natura-br-cf","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"// Painel do cliente: mostra a conversa em foco (lida do store).\nconst esc = (s) => String(s ?? '').replace(/[&<>\"']/g, (c) => ({ '&': '&', '<': '<', '>': '>', '\"': '"', \"'\": ''' }[c]))\nconst fmt = (t) => { const d = new Date(t); return t && !isNaN(d) ? d.toLocaleString('pt-BR', { day: '2-digit', month: '2-digit', hour: '2-digit', minute: '2-digit' }) : '--' }\nconst dur = (s) => { if (s == null || s === '') return '--'; s = Number(s); const p = (n) => String(n).padStart(2, '0'); return `${p(Math.floor(s / 3600))}:${p(Math.floor((s % 3600) / 60))}:${p(s % 60)}` }\nconst SLOT = { 1: { accent: '#e0962b', soft: '#fdf1df' }, 2: { accent: '#c45f3c', soft: '#fbe8e1' } }\nconst I = {\n user: ``,\n note: ``,\n hist: ``,\n prev: ``,\n chev: ``,\n}\nconst field = (d2, key) => d2.field(d2.params.store, 'data.' + key)\nconst ctx = (d2) => {\n const convs = field(d2, 'conversations').value || []\n const dual = field(d2, 'viewMode').value === 'dual'\n const slot = String(field(d2, 'focusedSlot').value || '1')\n let conv\n if (dual) conv = convs[Number(slot) - 1] || null\n else { const sel = field(d2, 'selectedConversationId').value; conv = convs.find((c) => c._id === sel) || convs[0] || null }\n return { conv, dual, slot, colors: SLOT[dual ? slot : '1'] || SLOT[1] }\n}\n// textarea é data-d2-static: ao trocar de conversa, carrega a anotação dela\nconst syncNotes = (d2) => {\n const wrap = d2.$('.wrap'); if (!wrap) return\n const cid = wrap.dataset.cid || ''\n if (cid !== d2.root.dataset.cid) {\n d2.root.dataset.cid = cid\n const ta = d2.$('textarea'); const { conv } = ctx(d2)\n if (ta) ta.value = (conv && conv.notes) || ''\n }\n}\n\nexport default {\n css: `\n :host{display:block;height:100%}\n .wrap{height:100%;box-sizing:border-box;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:10px;background:#faf8f5;font-family:'NaturaCo','Inter',system-ui,sans-serif;color:#2a2622}\n .who{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--accent);background:var(--accent-soft);border-radius:10px;padding:8px 12px}\n .who i{width:8px;height:8px;border-radius:50%;background:var(--accent)}\n .card{background:#fff;border:1px solid #ece7df;border-radius:14px;overflow:hidden;flex:none}\n .ch{display:flex;align-items:center;gap:10px;padding:14px;cursor:pointer;font-size:13.5px;font-weight:600;user-select:none}\n .ch .ico{color:#e0962b;display:flex}\n .ch .n{margin-left:auto;font-size:11px;color:#8a8178;font-weight:400}\n .ch .cv{color:#8a8178;display:flex;transition:transform .15s}\n .card.open .cv{transform:rotate(180deg)}\n .cb{padding:0 14px 12px}\n .cb.hide{display:none}\n .f{padding:8px 0;border-top:1px solid #f1ece5}\n .f:first-child{border-top:0}\n .lb{font-size:10px;font-weight:700;letter-spacing:.05em;color:#9a9088;text-transform:uppercase;margin-bottom:3px}\n .vl{font-size:13px;word-break:break-word}\n .badge{display:inline-block;margin-left:6px;font-size:10px;font-weight:600;color:#2f8a4c;background:#e6f4ea;border-radius:8px;padding:1px 6px;vertical-align:middle}\n textarea{width:100%;box-sizing:border-box;min-height:90px;border:1px solid #e6dfd5;border-radius:10px;padding:8px 10px;font:inherit;font-size:13px;resize:vertical;outline:0}\n textarea:focus{border-color:#e0962b}\n .save{margin-top:8px;border:0;border-radius:9px;padding:7px 14px;background:#e0962b;color:#fff;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}\n .ok{margin-left:8px;font-size:12px;color:#2f8a4c}\n .h{padding:8px 0;border-top:1px solid #f1ece5;font-size:12.5px}\n .h:first-child{border-top:0}\n .h a{color:#b8741b;font-weight:600;cursor:pointer;text-decoration:underline}\n .h small{display:block;color:#8a8178;margin-top:2px}\n .empty{font-size:12.5px;color:#8a8178;padding:4px 0 6px}\n `,\n render(d2) {\n const { conv: c, dual, slot, colors } = ctx(d2)\n const style = `--accent:${colors.accent};--accent-soft:${colors.soft}`\n if (!c) return `\n
\n \n
\n ${esc(initials(c.name))}
\n ${esc(c.name)}
\n ${I.clock}${clock(c.since, Date.now())}\n ${queued ? 'Na fila' : ''}\n \n ${queued ? '' : ``}\n
\n \n ${d2.state.menu ? `` : ''}\n
\n ${body}
\n ${queued ? 'Na fila · o atendimento começa sozinho quando a distribuição te atribuir
' : `\n \n \n \n \n ${d2.state.emoji ? `
`}\n ${EMOJIS.map((e) => ``).join('')}
` : ''}\n ${d2.state.recBusy ? 'preparando áudio…' : d2.state.rec ? `` : ``}\n \n Selecione uma conversa para ver os dados do cliente.
${lb}
${esc(v || '--')}${extra}
\n
`\n return `${ico}${title}${count != null ? `${count}` : ''}${I.chev}
\n ${open[id] || keep ? `${inner}
` : ''}\n \n ${dual ? `
`\n },\n mounted(d2) {\n d2.on('[data-sec]', 'click', (e, el) => {\n const open = Object.assign({ data: true }, d2.state.open)\n open[el.dataset.sec] = !open[el.dataset.sec]\n d2.state.open = open\n })\n d2.on('[data-act=\"notes\"]', 'click', () => {\n const ta = d2.$('textarea')\n d2.emit('onSaveNotes', { notes: ta ? ta.value : '' })\n d2.state.saved = true\n clearTimeout(d2.root.__savedTimer)\n d2.root.__savedTimer = setTimeout(() => { d2.state.saved = false }, 2500)\n })\n d2.onUnmount(() => clearTimeout(d2.root.__savedTimer))\n d2.on('[data-hist]', 'click', (e, el) => d2.emit('onOpenHistory', el.dataset.hist))\n syncNotes(d2)\n },\n updated(d2) {\n syncNotes(d2)\n },\n}\n"}},"store":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"store"}}}},"onSaveNotes":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onSaveNotes"}}}},"onOpenHistory":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onOpenHistory"}}}}}}}}}},{"_id":"6af1d099d169681f5e7c8c37","component":"data2-core-types@Component","system":"6671e96b001009d97f222f73","params":{"extends":"data2-core-primitives@Block","component":"agentDeskWorkspace","package":"natura-br-cf","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"// Monta a tela de atendimento: lista + mensagens rápidas | 1 ou 2 chats | painel do cliente.\n// Fonte única de verdade = store `data.*` (conversations, selectedConversationId, focusedSlot, viewMode, activeTab).\n// Cada filho lê o store sozinho; aqui só fica o layout e o encaminhamento das ações.\n// Regra de negócio sai pelos handlers (on*), que serão ligados a UCs.\n// Com useMockData = true, carrega conversas de exemplo no store e simula as ações localmente.\nconst MENU_LABEL = { transfer: 'Transferir atendimento', download: 'Baixar conversa (PDF)', history_cpf: 'Histórico deste CPF', history_ip: 'Histórico do IP' }\n\nconst field = (d2, key) => d2.field(d2.params.store, 'data.' + key)\nconst isMock = (d2) => d2.param('useMockData', true) !== false\nconst getConvs = (d2) => field(d2, 'conversations').value || []\nconst setConvs = (d2, list) => field(d2, 'conversations').set(list)\n\n// conversa exibida num slot, sempre calculada na hora\nconst convOfSlot = (d2, slot) => {\n const convs = getConvs(d2)\n if (field(d2, 'viewMode').value === 'dual') return convs[Number(slot) - 1] || null\n const sel = field(d2, 'selectedConversationId').value\n return convs.find((c) => c._id === sel) || convs[0] || null\n}\nconst focusedConv = (d2) => {\n const dual = field(d2, 'viewMode').value === 'dual'\n return convOfSlot(d2, dual ? String(field(d2, 'focusedSlot').value || '1') : '1')\n}\nconst patchConv = (d2, id, fn) => setConvs(d2, getConvs(d2).map((c) => (c._id === id ? fn(c) : c)))\nconst esc = (s) => String(s ?? '').replace(/[&<>\"']/g, (c) => ({ '&': '&', '<': '<', '>': '>', '\"': '"', \"'\": ''' }[c]))\nconst PDF_LIB = { url: 'https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js', global: 'html2pdf' }\nconst SENDER_LABEL = { AGENT: 'Atendente', HUMAN: 'Cliente', ASSISTANT: 'Assistente virtual', SYSTEM: 'Sistema' }\nconst fmtTime = (t) => { const d = new Date(t); return isNaN(d) ? '' : d.toLocaleString('pt-BR') }\n// espera a biblioteca de PDF carregar (até ~10 s); null se falhar\nconst loadPdfLib = async (d2) => {\n for (let i = 0; i < 100; i++) {\n const lib = d2.lib(PDF_LIB)\n if (lib) return lib\n if (d2.lib.state && d2.lib.state(PDF_LIB) === 'error') return null\n await new Promise((r) => setTimeout(r, 100))\n }\n return null\n}\nconst downloadPdf = async (d2, conv) => {\n if (!conv) return\n const proto = (conv.transfer && conv.transfer.protocol) || conv._id\n const html = `Conversa ${esc(slot)} · ${esc(c.name)}
` : ''}\n ${section('data', I.user, 'Dados do cliente', [\n field_('Nome', cu.name || c.name),\n field_('E-mail', cu.email),\n field_('Documento', cu.document),\n field_('Código do cliente', cu.code, cu.authenticated ? 'autenticado' : ''),\n field_('Telefone', cu.phone),\n field_('IP consumidor', cu.ip),\n field_('Fila', cu.queue),\n ].join(''))}\n ${section('notes', I.note, 'Anotações de atendimento', `${d2.state.saved ? 'Anotação salva' : ''}
`, null, true)}\n ${section('current', I.hist, 'Histórico deste atendimento', [\n field_('Protocolo', tr.protocol), field_('Chat ID', tr.chat_id), field_('Canal', tr.channel), field_('Estado', tr.status),\n field_('Entrada na fila', fmt(tr.queued_at)), field_('Início do atendimento', fmt(tr.agent_joined_at)), field_('Tempo na fila', dur(tr.queue_time)),\n ].join(''))}\n ${section('previous', I.prev, 'Atendimentos anteriores', hist.length ? hist.map((h, i) => `${esc(h.protocol || '--')}${esc(h.classification || '--')} · ${fmt(h.ended_at)}
`).join('') : 'Nenhum atendimento anterior hoje.
', hist.length)}\n \n
`\n const lib = await loadPdfLib(d2)\n if (lib) {\n const el = document.createElement('div')\n el.innerHTML = html\n await lib().set({ margin: 10, filename: `atendimento-${proto}.pdf`, html2canvas: { scale: 2 }, jsPDF: { unit: 'mm', format: 'a4' } }).from(el).save()\n return\n }\n // reserva: janela de impressão do navegador (salvar como PDF)\n const w = window.open('', '_blank')\n if (w) { w.document.write(html); w.document.close(); w.focus(); w.print() }\n}\nconst notice = (d2, msg) => { if (d2.dialog && d2.dialog.alert) d2.dialog.alert(msg); else d2.log(msg) }\n// Ponte (tela dentro de iframe): além do evento da instância, cada ação vira um evento de janela\n// 'agentDesk:action'. O agentDeskBridgeGuest escuta e repassa para o app de fora. Sem a ponte, ninguém escuta.\nconst relay = (type, payload) => { try { window.dispatchEvent(new CustomEvent('agentDesk:action', { detail: { type, payload } })) } catch (e) {} }\nconst out = (d2, name, payload) => { d2.emit(name, payload); relay(name, payload) }\n\nconst mock = () => {\n const now = Date.now()\n const at = (minAgo) => new Date(now - minAgo * 60000).toISOString()\n return [\n {\n _id: 'mock-camila', name: 'Camila Ferreira', since: at(3.2), notes: '',\n customer: { name: 'Camila Ferreira', email: 'camila.ferreira@email.com', document: '312.***.***-04', code: 'NAT-4471829', phone: '(11) 9 4xxx-xx21', ip: '189.45.118.7', queue: 'AVON CFD & AVON VD', authenticated: true },\n transfer: { protocol: '2026110900123', chat_id: 'kxHxRfzm8WFx', channel: 'web', status: 'in_progress', queued_at: at(5), agent_joined_at: at(3.2), queue_time: 108 },\n history: [{ protocol: '2026110800871', classification: 'ended_by_agent', ended_at: at(1300), chat_id: 'abc' }, { protocol: '2026110700512', classification: 'ended_by_user', ended_at: at(2900), chat_id: 'def' }],\n messages: [\n { id: 's1', sender: 'SYSTEM', text: 'Conversa transferida do assistente virtual para você', time: at(4) },\n { id: 'h1', sender: 'HUMAN', text: 'Oi, boa tarde! Fiz um pedido semana passada (nº 4471829) e ainda não recebi.', time: at(4) },\n { id: 'h2', sender: 'HUMAN', text: 'Já passou da data prevista de entrega e estou ficando preocupada 😟', time: at(3.8) },\n { id: 'a1', sender: 'AGENT', text: 'Olá, Camila! Tudo bem? Vou cuidar disso com você agora mesmo.', time: at(3) },\n { id: 'a2', sender: 'AGENT', text: 'Só um instante enquanto localizo o seu pedido pelo número, tá?', time: at(2.9) },\n { id: 'h3', sender: 'HUMAN', text: 'Tá bom, fico no aguardo 🙂', time: at(2) },\n { id: 'a3', sender: 'AGENT', text: 'Encontrei aqui ✅ Seu pedido saiu para entrega hoje de manhã e deve chegar até as 19h.', time: at(1) },\n ],\n },\n {\n _id: 'mock-juliana', name: 'Juliana Souza', since: at(11.8), notes: '',\n customer: { name: 'Juliana Souza', email: 'juliana.souza@email.com', document: '458.***.***-90', code: 'NAT-5520193', phone: '(21) 9 8xxx-xx44', ip: '177.22.90.13', queue: 'NATURA CF' },\n transfer: { protocol: '2026110900131', chat_id: 'pQ7sLm2Kx9aZ', channel: 'web', status: 'in_progress', queued_at: at(14), agent_joined_at: at(11.8), queue_time: 132 },\n history: [],\n messages: [\n { id: 's1', sender: 'SYSTEM', text: 'Conversa transferida do assistente virtual para você', time: at(12) },\n { id: 'b1', sender: 'ASSISTANT', text: 'Resumo: cliente quer trocar um produto que chegou com a embalagem danificada.', time: at(12) },\n { id: 'h1', sender: 'HUMAN', text: 'Oi! Meu hidratante chegou com a tampa quebrada, consigo trocar?', time: at(11.5) },\n { id: 'a1', sender: 'AGENT', text: 'Oi, Juliana! Consegue sim. Você pode me mandar uma foto da embalagem?', time: at(10) },\n ],\n },\n ]\n}\n// scope 'mine' = do agente (ordem dele); 'general' = da equipe (ordem da gestão)\nconst MOCK_QUICK = [\n { _id: 'q1', scope: 'mine', title: 'Saudação', text: 'Olá! Tudo bem? Sou o Ramon e vou te ajudar agora mesmo. 😊' },\n { _id: 'q2', scope: 'mine', title: 'Localizar pedido', text: 'Você pode me informar o número do pedido para eu localizar, por favor?' },\n { _id: 'q3', scope: 'mine', title: 'Aguardar', text: 'Só um instante enquanto verifico essa informação para você.' },\n { _id: 'q4', scope: 'mine', title: 'Prazo de entrega', text: 'Seu pedido já saiu para entrega e deve chegar ainda hoje até as 19h.' },\n { _id: 'q5', scope: 'general', title: 'Política de troca', text: 'A troca pode ser solicitada em até 7 dias após o recebimento. Posso te enviar o passo a passo.' },\n { _id: 'q6', scope: 'general', title: 'Reembolso', text: 'O reembolso é processado em até 5 dias úteis, na mesma forma de pagamento.' },\n { _id: 'q7', scope: 'general', title: 'Virar consultora', text: 'Que ótimo! Vou te enviar o link de cadastro para você começar como consultora. 💛' },\n]\n\n// ---- handlers: sempre leem o store na hora do clique ----\nconst handlers = (d2) => ({\n onSelect: (id) => {\n const convs = getConvs(d2)\n const idx = convs.findIndex((c) => c._id === id)\n if (field(d2, 'viewMode').value === 'dual' && idx > -1 && idx < 2) field(d2, 'focusedSlot').set(String(idx + 1))\n else { field(d2, 'selectedConversationId').set(id); field(d2, 'focusedSlot').set('1') }\n },\n onFocus: (slot) => field(d2, 'focusedSlot').set(String(slot)),\n onSend: (p) => {\n const conv = convOfSlot(d2, p && p.slot)\n if (!conv || !p || !p.text) return\n if (isMock(d2)) {\n const msg = { id: `local-${Date.now()}`, sender: 'AGENT', text: p.text, time: new Date().toISOString() }\n patchConv(d2, conv._id, (c) => ({ ...c, messages: [...(c.messages || []), msg] }))\n }\n out(d2, 'onSend', { slot: p.slot, text: p.text, conversationId: conv._id })\n },\n onCloseConversation: async (p) => {\n const conv = convOfSlot(d2, p && p.slot)\n if (!conv) return\n // confirma sempre (com dados de exemplo ou de verdade)\n const ok = d2.dialog && d2.dialog.confirm ? await d2.dialog.confirm(`Encerrar o atendimento com ${conv.name}? Essa ação é irreversível.`) : true\n if (!ok) return\n if (isMock(d2)) {\n setConvs(d2, getConvs(d2).filter((c) => c._id !== conv._id))\n field(d2, 'selectedConversationId').set('')\n field(d2, 'focusedSlot').set('1')\n }\n out(d2, 'onCloseConversation', { slot: p.slot, conversationId: conv._id })\n },\n onMenuAction: (p) => {\n const conv = convOfSlot(d2, p && p.slot)\n // baixar conversa: o PDF é gerado aqui na tela (o app de fora não enxerga o conteúdo do iframe)\n if (p && p.action === 'download') { downloadPdf(d2, conv); return }\n if (isMock(d2)) notice(d2, `\"${MENU_LABEL[p.action] || p.action}\" será ligado na etapa de lógica.`)\n out(d2, 'onMenuAction', { slot: p.slot, action: p.action, conversationId: conv && conv._id })\n },\n onAttach: (p) => {\n const conv = convOfSlot(d2, p && p.slot)\n if (!conv || !p || !p.file) return\n if (isMock(d2)) notice(d2, `Anexo \"${p.file.name}\" (dados de exemplo: não é enviado).`)\n out(d2, 'onAttach', { slot: p.slot, conversationId: conv._id, file: p.file })\n },\n onSaveNotes: (p) => {\n const conv = focusedConv(d2)\n if (!conv) return\n if (isMock(d2)) patchConv(d2, conv._id, (c) => ({ ...c, notes: p.notes }))\n out(d2, 'onSaveNotes', { notes: p.notes, conversationId: conv._id })\n },\n onOpenHistory: (chatId) => {\n if (isMock(d2)) notice(d2, 'Abrir atendimento anterior será ligado na etapa de lógica.')\n out(d2, 'onOpenHistory', chatId)\n },\n // envio rápido de uma mensagem pronta: vai direto para o chat em foco (mesmo caminho do envio normal)\n onQuickSend: (text) => {\n const dual = field(d2, 'viewMode').value === 'dual'\n const slot = dual ? String(field(d2, 'focusedSlot').value || '1') : '1'\n handlers(d2).onSend({ slot, text })\n },\n // nova ordem das mensagens do agente (as da equipe não mudam)\n onReorder: (p) => {\n if (!p || !p.ids) return\n if (isMock(d2)) {\n const all = field(d2, 'quickMessages').value || []\n const mine = p.ids.map((id) => all.find((m) => m._id === id)).filter(Boolean)\n const rest = all.filter((m) => !p.ids.includes(m._id))\n field(d2, 'quickMessages').set([...mine, ...rest])\n }\n out(d2, 'onReorderQuickMessages', { scope: 'mine', ids: p.ids })\n },\n // cadastro de mensagens rápidas (aba Gerenciar)\n onSaveQuickMessage: (p) => {\n if (!p || !p.text) return\n if (isMock(d2)) {\n const all = field(d2, 'quickMessages').value || []\n if (p._id) field(d2, 'quickMessages').set(all.map((m) => (m._id === p._id ? { ...m, title: p.title || m.title, text: p.text, queues: p.queues || [] } : m)))\n else field(d2, 'quickMessages').set([...all, { _id: `local-${Date.now()}`, scope: 'mine', title: p.title || p.text.slice(0, 40), text: p.text, queues: p.queues || [] }])\n }\n out(d2, 'onSaveQuickMessage', { _id: p._id || '', title: p.title || '', text: p.text, queues: p.queues || [] })\n },\n onDeleteQuickMessage: (p) => {\n if (!p || !p._id) return\n if (isMock(d2)) field(d2, 'quickMessages').set((field(d2, 'quickMessages').value || []).filter((m) => m._id !== p._id))\n out(d2, 'onDeleteQuickMessage', { _id: p._id })\n },\n onPick: (text) => {\n const dual = field(d2, 'viewMode').value === 'dual'\n if (d2.bus) d2.bus.emit('agentDesk:insertText', { slot: dual ? String(field(d2, 'focusedSlot').value || '1') : '1', text })\n },\n})\n\nexport default {\n css: `\n :host{display:block;height:100%}\n .ws{height:100%;display:grid;grid-template-columns:300px minmax(0,1fr) 300px;background:#f7f5f2;font-family:'NaturaCo','Inter',system-ui,sans-serif}\n .left{display:grid;grid-template-rows:200px minmax(0,1fr);border-right:1px solid #ece7df;background:#fff;min-height:0}\n .center{display:grid;min-height:0;min-width:0}\n .center.dual{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1px;background:#e6dfd5}\n .right{border-left:1px solid #ece7df;min-height:0}\n .cell{min-height:0;min-width:0;height:100%}\n .placeholder{display:flex;align-items:center;justify-content:center;color:#8a8178;font-size:14px;background:#f4f1ec}\n `,\n render(d2) {\n // este componente só reage ao layout (modo e aba); o conteúdo é lido pelos filhos\n const dual = field(d2, 'viewMode').value === 'dual'\n const tab = field(d2, 'activeTab').value || 'conversations'\n const h = handlers(d2)\n const store = d2.params.store\n const chat = (slot) => `Atendimento ${esc(proto)}
\n${esc(conv.name)} · gerado em ${esc(new Date().toLocaleString('pt-BR'))}
\n ${(conv.messages || []).map((m) => `${esc(SENDER_LABEL[m.sender] || m.sender)} ${esc(fmtTime(m.time))}
${esc(m.text)}${m.link ? ` ${esc(m.link)}` : ''}
`).join('')}\n ${esc(m.text)}${m.link ? ` ${esc(m.link)}` : ''}
${d2.render(d2.param('chatPanel'), { store, slot: String(slot) }, {\n key: `chat-${dual ? slot : 'single'}`,\n onFocus: h.onFocus, onSend: h.onSend, onCloseConversation: h.onCloseConversation, onMenuAction: h.onMenuAction, onAttach: h.onAttach,\n })}
`\n const center = tab === 'quick'\n ? `${d2.render(d2.param('quickMessages'), { store, mode: 'manage' }, { key: 'quick-manage', onReorder: h.onReorder, onSaveQuickMessage: h.onSaveQuickMessage, onDeleteQuickMessage: h.onDeleteQuickMessage })}
${dual ? chat(1) + chat(2) : chat(1)}
`\n return `\n \n
`\n },\n mounted(d2) {\n // carrega as conversas de exemplo no store (só se ainda estiver vazio)\n if (isMock(d2) && !getConvs(d2).length) setConvs(d2, mock())\n if (isMock(d2) && !(field(d2, 'quickMessages').value || []).length) field(d2, 'quickMessages').set(MOCK_QUICK)\n },\n}\n"}},"store":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"store"}}}},"conversationList":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"conversationList"}}}},"quickMessages":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"quickMessages"}}}},"chatPanel":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"chatPanel"}}}},"customerPanel":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"customerPanel"}}}},"useMockData":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"useMockData"}}}},"onSend":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onSend"}}}},"onCloseConversation":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onCloseConversation"}}}},"onMenuAction":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onMenuAction"}}}},"onSaveNotes":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onSaveNotes"}}}},"onOpenHistory":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onOpenHistory"}}}},"onAttach":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onAttach"}}}},"onReorderQuickMessages":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onReorderQuickMessages"}}}},"onSaveQuickMessage":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onSaveQuickMessage"}}}},"onDeleteQuickMessage":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"onDeleteQuickMessage"}}}}}}}}}},{"_id":"6af1f384257f7c9b0d960973","component":"data2-core-types@Component","system":"6671e96b001009d97f222f73","params":{"extends":"data2-core-primitives@Block","component":"agentDeskBridgeGuest","package":"natura-br-cf","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"// Ponte — lado de DENTRO. Roda no app \"embed\" (.next), dentro do iframe da tela ponte.\n// - Recebe do app de fora (window.parent) o estado da tela (conversas, mensagens rápidas, status) e grava no store.\n// - Repassa ao app de fora as ações da tela (evento de janela 'agentDesk:action' que os outros componentes disparam).\n// Não lê dado nenhum e não precisa de login: só aceita mensagem do window.parent com origem do portal.\nconst PARENT_OK = /^https:\\/\\/([a-z0-9-]+\\.)*natura-br-cf\\.(data2\\.app|next\\.data2\\.app|data2\\.qa|data2\\.builders)$/\n// chaves que o app de fora pode preencher. O resto (aba, 1/2 conversas, foco) é estado de tela local.\nconst STATE_KEYS = ['conversations', 'quickMessages', 'agentStatus', 'agent', 'statusOptions', 'queueOptions']\n\nconst field = (d2, key) => d2.field(d2.params.store, 'data.' + key)\nconst embedded = () => { try { return window.parent && window.parent !== window } catch (e) { return true } }\nconst parentOrigin = () => {\n let o = ''\n try { if (location.ancestorOrigins && location.ancestorOrigins.length) o = location.ancestorOrigins[0] } catch (e) {}\n if (!o && document.referrer) { try { o = new URL(document.referrer).origin } catch (e) {} }\n return { origin: o, ok: PARENT_OK.test(o) }\n}\nconst plain = (v) => { try { return JSON.parse(JSON.stringify(v === undefined ? null : v)) } catch (e) { return null } }\n// onSend -> send, onCloseConversation -> closeConversation, ...\nconst eventName = (t) => { const n = String(t || '').replace(/^on/, ''); return n.charAt(0).toLowerCase() + n.slice(1) }\nconst esc = (s) => String(s ?? '').replace(/[&<>\"']/g, (c) => ({ '&': '&', '<': '<', '>': '>', '\"': '"', \"'\": ''' }[c]))\n\nexport default {\n css: `\n :host{display:block;height:100%;pointer-events:none}\n .chip{pointer-events:auto;display:flex;align-items:center;gap:10px;height:100%;box-sizing:border-box;padding:0 12px;border-radius:10px;background:rgba(42,38,34,.88);color:#fff;font:12px/1.2 'Inter',system-ui,sans-serif;white-space:nowrap;overflow:hidden}\n .dot{flex:none;width:8px;height:8px;border-radius:50%;background:#a39a90}\n .dot.ok{background:#3aa65c}.dot.wait{background:#e0962b}.dot.err{background:#d9534f}\n .mut{color:#cfc6bc}\n button{pointer-events:auto;border:0;border-radius:7px;padding:4px 9px;background:#e0962b;color:#fff;font:inherit;cursor:pointer}\n `,\n render(d2) {\n if (!d2.param('debug', false)) return ''\n const s = d2.state\n const cls = s.level === 'ok' ? 'ok' : s.level === 'err' ? 'err' : 'wait'\n return `\n
\n ${center}\n ${d2.render(d2.param('conversationList'), { store, maxConversations: 2 }, { key: 'list', onSelect: h.onSelect })}
\n ${d2.render(d2.param('quickMessages'), { store, mode: 'panel' }, { key: 'quick', onPick: h.onPick, onQuickSend: h.onQuickSend, onReorder: h.onReorder, onSaveQuickMessage: h.onSaveQuickMessage, onDeleteQuickMessage: h.onDeleteQuickMessage })}
\n ${d2.render(d2.param('customerPanel'), { store }, { key: 'customer', onSaveNotes: h.onSaveNotes, onOpenHistory: h.onOpenHistory })}
\n \n Ponte (dentro): ${esc(s.status || '')}\n recebidos ${s.got || 0} · enviados ${s.sent || 0}\n \n ${esc(s.mic || '')}\n
`\n },\n mounted(d2) {\n let alive = true\n d2.onUnmount(() => { alive = false })\n\n // teste de microfone (item 3 do protótipo) — ligado antes de qualquer retorno, funciona dentro ou fora do iframe\n d2.on('[data-act=\"mic\"]', 'click', async () => {\n d2.state.mic = 'testando…'\n let policy = 'desconhecida'\n try {\n const fp = document.permissionsPolicy || document.featurePolicy\n if (fp && fp.allowsFeature) policy = fp.allowsFeature('microphone') ? 'liberado nesta página' : 'bloqueado nesta página'\n } catch (e) {}\n try {\n const stream = await navigator.mediaDevices.getUserMedia({ audio: true })\n stream.getTracks().forEach((t) => t.stop())\n d2.state.mic = `microfone OK (${policy})`\n } catch (err) {\n d2.state.mic = `microfone falhou: ${(err && err.name) || err} (${policy})`\n }\n })\n\n const p = parentOrigin()\n if (!embedded()) { d2.setState({ status: 'aberto fora de iframe (sem app de fora)', level: 'err' }); return }\n if (!p.ok) { d2.setState({ status: `origem do app de fora não permitida: ${p.origin || '(vazia)'}`, level: 'err' }); return }\n d2.setState({ status: `aguardando o app de fora (${p.origin})`, level: 'wait', got: 0, sent: 0 })\n\n const post = (type, payload) => {\n try {\n // arquivo (anexo) vai inteiro; o resto vira JSON puro\n const file = payload && typeof Blob !== 'undefined' && payload.file instanceof Blob ? payload.file : null\n const data = plain(file ? { ...payload, file: undefined } : payload)\n if (file && data) data.file = file\n window.parent.postMessage({ type: 'agentDesk:' + type, payload: data }, p.origin)\n d2.state.sent = (d2.state.sent || 0) + 1\n } catch (e) { d2.setState({ status: `erro ao enviar: ${e && e.message}`, level: 'err' }) }\n }\n\n // estado vindo do app de fora -> store\n d2.on(window, 'message', (e) => {\n if (e.source !== window.parent || e.origin !== p.origin) return\n const m = e.data\n if (!m || m.type !== 'agentDesk:state' || !m.data || typeof m.data !== 'object') return\n STATE_KEYS.forEach((k) => { if (Object.prototype.hasOwnProperty.call(m.data, k)) field(d2, k).set(m.data[k]) })\n d2.setState({ status: `conectada (${p.origin})`, level: 'ok', got: (d2.state.got || 0) + 1 })\n })\n\n // ações da tela -> app de fora\n d2.on(window, 'agentDesk:action', (e) => {\n const d = (e && e.detail) || {}\n if (d.type) post(eventName(d.type), d.payload)\n })\n\n // \"estou pronto\": repete a cada 1 s até chegar o primeiro estado (o app de fora pode carregar depois do iframe)\n let tries = 0\n const hello = () => {\n if (!alive || d2.state.got || tries++ >= 30) return\n post('ready', { at: Date.now() })\n setTimeout(hello, 1000)\n }\n hello()\n },\n}\n"}},"store":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"store"}}}},"debug":{"component":"data2-core-types@Reference","params":{"reference":{"component":"data2-core-primitives@String","params":{"content":"debug"}}}}}}}}}},{"_id":"6af21068e88217babb72fc6a","component":"data2-core-types@Component","system":"6671e96b001009d97f222f73","params":{"extends":"data2-core-primitives@Block","component":"kanban_mcp_boas_praticas","package":"natura-br-cf","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"const SECOES = [\n {\n id: 'kanban',\n titulo: 'O combinado do kanban',\n sub: 'Cada Claude grava os cards do mesmo jeito, para que o Claude de outra pessoa consiga ler sem perguntar nada.',\n itens: [\n [\"Ler antes de gravar\", \"Antes de criar um card, leia a tabela para não duplicar o card de outra pessoa.\"],\n [\"ID do card\", \"O `card_id` é a frente mais o número (`TRC-07`), gerado pelo `kanban_tarefa_criar`. O ticket do JIRA fica na demanda (`JCFA-1234`), ligada pelo `demand_key`. O nome da sessão do Claude começa com o `card_id`.\"],\n [\"Declarar o que vai mexer\", \"Preencha `touches` com a reference completa e o nome de cada serviço, tela ou UC que vai editar. O `kanban_tarefa_pegar` avisa quando outra tarefa em andamento mexe no mesmo lugar: combine com a dona por um evento `request` antes de seguir.\"],\n [\"O card anda com o trabalho\", \"Começou: `kanban_tarefa_pegar`. Mexeu no system: `kanban_mudanca`. Entregou: `in_validation` com `result` e `approver`. Publicou: `done` com a `app_version`.\"],\n [\"Dependência em depends_on\", \"Ligue tarefas pelo `card_id` em `depends_on`. Ninguém pega uma tarefa enquanto alguma dependência não estiver em `done`.\"],\n [\"Pedido é evento\", \"Precisa de algo de outra pessoa? `kanban_evento` com `type: request` e `to` = ela. Entra na caixa de entrada dela, no `kanban_minha_fila`. Dúvida de regra vira `question`, nunca suposição.\"],\n [\"Não apagar\", \"Tarefa descartada vai para `cancelled` com `reason`, para o histórico ficar. A escrita direta nas tabelas é recusada: tudo passa pelos rushes.\"],\n [\"Quem só planeja não grava\", \"Sessão de planejamento escreve no plano uma 'Nota proposta para o card'. O dono do card decide o que entra.\"]\n ]\n },\n {\n id: 'analise',\n titulo: 'Antes de afirmar como algo funciona',\n sub: 'O br-cf tem muito código comentado e muita integração fora do fluxo principal. Entender direito vale mais do que terminar rápido.',\n itens: [\n [\"Comece pelos dois artboards\", \"Todo fluxo do bot parte de `onboarding-navigation-CHAT` (`h-6OYFkUln7jfbRri6t2R`), que escolhe a tela pelo `data.flow`, e do menu `new-service-menu` (`nrbALWBoiqECspZ_sIBW1`), cujos cards gravam `data.flow` e `data.navigation`. Os fluxos não usam rotas do router.\"],\n [\"Comentado é disabled:true\", \"O `handlerCode`, o `definitionCode` e o d2lang do MCP escondem o `disabled`. Antes de afirmar comportamento, leia o JSON cru: `get_service` com `view:'full'`, `get_artboard_tree` full ou `get_component` com `maxChars:0`.\"],\n [\"O nome engana\", \"Na Troca, os rushes da família '⚠️WIP⚠️' são a produção. Antes de chamar algo de legado ou de teste, olhe os logs de execução.\"],\n [\"Siga a cadeia inteira\", \"Rodapés compartilhados (`goTo_onClick` e `goBack_onClick`), UC que chama UC, rush, store antigo e mensagens do PowerCord. Muita regra mora fora da tela que parece óbvia.\"],\n [\"find_references é cego para UC\", \"Ele não enxerga referências feitas dentro da definition de um user component. Para achar quem usa algo, baixe o JSON e procure a reference.\"],\n [\"Rush pode ignorar o body\", \"Vários rushes leem `$sessionData` (tabela '📅Server - API Responses'), carregada no início, e não o `$body`. Campo novo que só vem no body tem de ser lido como `$body.X`.\"],\n [\"Confirme executando\", \"Quando der, rode o rush (`execute_rush_request`) ou leia os logs antes de afirmar.\"],\n [\"Contradição: reverifique\", \"Se o que a pessoa descreve contradiz o que você leu, suspeite primeiro da sua leitura.\"]\n ]\n },\n {\n id: 'editar',\n titulo: 'Editando sem quebrar',\n sub: 'O system é grande e compartilhado. Toda alteração precisa poder ser revisada e desfeita.',\n itens: [\n [\"systemId em toda chamada\", \"O foco do MCP é compartilhado e muda sem aviso quando outra sessão aponta para outro system. Passe `systemId` (`6671e96b001009d97f222f73`) em toda leitura e escrita.\"],\n [\"Backup antes, auditoria depois\", \"Antes de alterar, salve o JSON do componente. Registre o caminho de cada alteração, para quem revisar conseguir desfazer.\"],\n [\"Edição cirúrgica\", \"Em handler com cards desligados, use `update_records` com dot-path no dataset do componente (`ComponentInstancesDataSet`, `DataComponentInstancesDataSet`, `ServiceComponentInstancesDataSet` ou `UserComponentsDataSet`), com `dryRun` primeiro. `patch_block_interaction`, `patch_rush_handler` e `set_block_interaction` regeneram tudo a partir do handlerCode e religam o que estava comentado.\"],\n [\"Cuidado com set_params\", \"Ele corrompe o CD: reference terminada em '-' vira subtração, `@Mod.metodo()` vira `args:{}` (o runtime pula a interação) e `title` vira objeto e derruba o canvas do workspace.\"],\n [\"Nunca invente reference\", \"Crie sem `reference` e deixe a plataforma gerar. Atualize no lugar, nunca recrie: reference repetida gera duplicata com resolução aleatória.\"],\n [\"Antes de apagar, olhe o canvas\", \"Instância órfã num workspace derruba o canvas inteiro. Confira com `list_workspace_instances`.\"],\n [\"HML e PRD dividem peças\", \"Rodapés, componentes e o router do portal de agentes são compartilhados. Antes de mexer 'só em HML', confira quem mais usa.\"],\n [\"Revisão só leitura sem aggregate_dataset\", \"Ele grava o pipeline no dataset e gera commit em seu nome. Use `query_dataset` com `fields`.\"]\n ]\n },\n {\n id: 'd2lang',\n titulo: 'Armadilhas de d2lang e rush',\n sub: 'Erros que passam na validação e só aparecem em execução.',\n itens: [\n [\"match sem casar é verdadeiro\", \"`match()` sem resultado devolve `[]`, que é verdadeiro. Teste com `count(match(...)) > 0`.\"],\n [\"if sem else\", \"Devolve o `prevResult` de fora, e `else { null }` some na gravação. Escreva sempre um else com valor explícito (`false`, `''` ou `[]`).\"],\n [\"return null\", \"Vira `then: null` e não sai. Use `data2-core-flow@Return`.\"],\n [\"Erro de Request aborta no get\", \"`x = (Request(...) || {})` segura o erro, mas `get($x, '0')` aborta o fluxo inteiro. Leia `$x.0.campo` direto.\"],\n [\"deleteRecord precisa de objeto\", \"`deleteRecord($id)` não apaga e responde ok. Use `deleteRecord({_id: $id})`.\"],\n [\"execute_d2lang é sandbox\", \"Ele não tem o `prevResult` de fora. Lógica nova vai num rush de teste em HML, com dados reais.\"],\n [\"Conta dentro de template vira texto\", \"`${$total + 1}` dentro de um template literal concatena (`01`). Faça a conta num passo antes e use só a variável no template.\"],\n [\"else { null } some\", \"Na gravação, `else { null }` desaparece e o `if` passa a devolver o `prevResult` de fora. Use `\\\"\\\"`, `false` ou `[]` no else.\"],\n [\"Objeto em lambda precisa de parênteses\", \"`map($x, (t) => {a: 1})` quebra o rush inteiro (424, sem log). Escreva `(t) => ({a: 1})`.\"],\n [\"patch_user_component come cifrão\", \"No texto novo, `$$` vira `$`. Para gravar `$$`, escreva `$$$$`.\"]\n ]\n },\n {\n id: 'code',\n titulo: 'Code components',\n sub: 'Tudo do kanban é code component. Eles falham calados, então o cuidado vem antes.',\n itens: [\n [\"Constantes antes do export default\", \"`export default` age como return: `const` e `let` declarados depois dele nunca inicializam.\"],\n [\"Todo módulo por param declarado\", \"Store, dataset, rush e UC filho chegam por `parameters` e são ligados na instância. Reference montada no código resolve às vezes e falha calada.\"],\n [\"Store pelo d2.field\", \"Leia e grave com `d2.field(d2.params.store, 'data.x')`.\"],\n [\"Atualização imutável\", \"Filho de `d2.render` só re-renderiza quando recebe objeto novo (`{...obj, campo}`).\"],\n [\"Onde renderiza\", \"No builder `.data2.qa` e no player `.next.data2.app`. No player de produção `.data2.app` aparece um quadro preto, o que não importa para uso interno.\"]\n ]\n },\n {\n id: 'publish',\n titulo: 'Publish, versão e segurança',\n sub: 'Segurança é rotina em qualquer system, não um passo extra.',\n itens: [\n [\"A versão do app controla o que sobe\", \"O publish leva o system inteiro; o que chega ao usuário é a versão do app. Registre no card a `app_version` da entrega.\"],\n [\"Gravado não é publicado\", \"Escrita em bloco, rush ou store volta `_publish_required` e só vale depois do publish.\"],\n [\"Publish só com OK\", \"Nenhum Claude publica sem a pessoa dona do card pedir.\"],\n [\"Tabela nova nasce com policy\", \"Login do board OU Rush OU Builder. Sem login, a leitura dá 401. Policy de rota é só redirect de UX.\"],\n [\"Rush fura a policy\", \"Dentro de rush, `find` e `saveRecord` ignoram a policy da tabela. Nenhum listener público devolve dado de tabela fechada.\"],\n [\"security_scan depois de criar\", \"Rode depois de criar tabela, rush ou app, e confira se nada novo aparece aberto.\"],\n [\"Tabela de senhas é trancada\", \"A tabela usada como verifier de um login fica visível só para a própria pessoa logada; builder e rush leem vazio e não conseguem alterar registro existente. Dados de perfil (papel, nome) vão numa tabela à parte.\"],\n [\"Usuário logado edita o próprio registro\", \"Sem policy de negação, a pessoa logada consegue mudar o próprio papel. Na tabela de senhas, negue tudo que não for find e get.\"],\n [\"Saber se houve publish\", \"Consulte o `BundlesDataSet`. Rush chamado por invoke herda o bundle de quem chamou.\"]\n ]\n },\n {\n id: 'escrita',\n titulo: 'Escrita e dados',\n sub: 'Para que o texto de um sirva para o outro.',\n itens: [\n [\"Reference completa e nome\", \"Nunca abrevie (`u1qws…` não serve para achar nada). Escreva a reference inteira e o nome do componente.\"],\n [\"Fuso -03:00\", \"Filtro de data com `dateFormat(x, 'YYYY-MM-DDT00:00:00-03:00')`. Sem fuso, o servidor lê UTC e o dia escolhido começa às 21h do dia anterior.\"],\n [\"Data que importa vai num campo seu\", \"O `updatedAt` é da plataforma e muda em qualquer atualização em lote.\"]\n ]\n }\n]\n\nconst COMBINADO = [\n \"## Kanban do time (br-cf)\",\n \"O kanban fica no system natura-br-cf (6671e96b001009d97f222f73), workspace \\\"kanban mcp\\\". Toda chamada leva systemId explícito.\",\n \"\",\n \"Ler (query_dataset, só leitura):\",\n \"- Tarefas: xGWFJ6YYPw7_18GmH_ypIDataSet\",\n \"- Demandas: hCvHde1zOzxLcT1GWZJrGDataSet\",\n \"- Eventos: IY33jMLn6x8R1eF8xlzlHDataSet\",\n \"- Catálogo (frentes, papéis, pessoas): r4oehJcseoCIPn_fYVWg3DataSet\",\n \"\",\n \"Gravar: só pelos rushes, com execute_rush_request (POST). Todo corpo leva actor: { person: \\\"\n
`\n\n const corpo = visiveis.length ? visiveis.map(x => `\n \n
\n Combinado para colar no ClaudeVai no CLAUDE.md ou na memória do projeto de cada dev.
\n \n ${esc(COMBINADO)}\n ${esc(x.s.titulo)}
${esc(x.s.sub)}
- ${x.itens.map((i, k) => `\n
${fmt(i[0])}
${fmt(i[1])}
`).join('')}\n
Nada encontrado para \"${esc(q)}\".
`\n\n return `\n \n \n
`\n },\n\n mounted(d2) {\n d2.on('.busca', 'input', (e, el) => { d2.state.q = el.value })\n d2.on('.nav-it', 'click', (e, el) => {\n const alvo = d2.$('#sec-' + el.dataset.id)\n if (alvo) alvo.scrollIntoView({ behavior: 'smooth', block: 'start' })\n })\n d2.on('.copiar', 'click', async () => {\n try {\n await navigator.clipboard.writeText(COMBINADO)\n d2.state.copiado = true\n setTimeout(() => { d2.state.copiado = false }, 2000)\n } catch (err) {\n const pre = d2.$('.comb pre')\n if (pre) {\n const r = document.createRange()\n r.selectNodeContents(pre)\n const sel = window.getSelection()\n sel.removeAllRanges()\n sel.addRange(r)\n }\n }\n })\n }\n}\n\nfunction esc(v) {\n return String(v == null ? '' : v)\n .replace(/&/g, '&').replace(//g, '>').replace(/\"/g, '"')\n}\n\nfunction fmt(s) {\n return esc(s).replace(/`([^`]+)`/g, 'kanban mcp · natura-br-cf
\n Boas práticas do MCP no br-cf
\nO que todo Claude do time segue ao trabalhar no natura-br-cf: como gravar os cards do kanban, como ler o system antes de afirmar, e como editar e publicar sem quebrar o trabalho dos outros.
\n \n\n \n ${corpo} \n
\n $1')\n}\n"}}}}}}}},{"_id":"6af22bb6a804ce16a6f59b9b","component":"data2-core-types@Component","system":"6671e96b001009d97f222f73","params":{"extends":"data2-core-primitives@Block","component":"kanban_mcp_modelo","package":"natura-br-cf","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"const SYSTEM_ID = '6671e96b001009d97f222f73'\n\nconst TABELAS = [\n { nome: '📋 Kanban - Catálogo', ds: 'r4oehJcseoCIPn_fYVWg3DataSet', papel: 'O que vale no kanban', desc: 'Frentes (prefixos dos cards), papéis de agente com instruções e pessoas. Os rushes validam tudo contra esta tabela. O builder pode editar direto.', campos: 'kind (frente | papel | pessoa), key, name, description, instructions, active, order' },\n { nome: '📋 Kanban - Demandas', ds: 'hCvHde1zOzxLcT1GWZJrGDataSet', papel: 'O ticket do JIRA', desc: 'Uma por ticket (JCFA-1234) ou demanda interna (CF-N). É a fonte da verdade: se uma doc de agente divergir do ticket, vale o ticket.', campos: 'key, title, url, jira_text, summary, acceptance[], prefix, owner, requester, status, priority, due, datas e autoria' },\n { nome: '📋 Kanban - Tarefas', ds: 'xGWFJ6YYPw7_18GmH_ypIDataSet', papel: 'Os nós da rede', desc: 'Cada tarefa tem dona, papel de agente, critério de pronto, dependências e o que vai mexer. Tudo que outro agente precisa ler fica aqui, não em arquivo local.', campos: 'card_id, prefix, number, demand_key, title, type, owner, agent, session, approver, description, acceptance[], plan, depends_on[], touches[], status, status_changed_at, blocked_reason, priority, due, result, changes[], links[], env, app_version, datas e autoria' },\n { nome: '📋 Kanban - Usuários', ds: 'tRlbJferL7uuiK4XRB90rDataSet', papel: 'Login do time (senhas)', desc: 'Tabela que a estratégia \"📋 Kanban - Login do time\" (Eg1eRV26seZ-YdxhhvYln) usa para conferir a senha. A plataforma tranca: cada pessoa logada só vê o próprio registro e não consegue alterá-lo; nem builder nem rush leem. Só o kanban_usuario_salvar cria acessos.', campos: 'email, password (guardado pela plataforma), created_at' },\n { nome: '📋 Kanban - Perfis', ds: 'hMctQ1zQRf75g-sjb9JMLDataSet', papel: 'Quem é quem no board', desc: 'Liga o e-mail do login à pessoa do catálogo e ao papel no board (admin, editor, leitor, bloqueado). Os rushes descobrem quem está chamando por aqui; só eles gravam.', campos: 'email, person, role, must_change_password, datas e autoria' },\n { nome: '📋 Kanban - Eventos', ds: 'IY33jMLn6x8R1eF8xlzlHDataSet', papel: 'Linha do tempo e caixa de entrada', desc: 'Cada nota, pedido, pergunta, decisão, mudança de status e alteração é um registro novo. Ninguém apaga a nota de ninguém.', campos: 'card_id, demand_key, type, from_person, from_agent, to, text, data, resolved, resolved_by, resolved_at, created_at' }\n]\n\nconst STATUS = [\n ['backlog', 'Registrada, ainda não refinada', '—', 'ready, cancelled'],\n ['ready', 'Aprovada pelo orquestrador; pode ser pega', 'acceptance e agent', 'backlog, blocked, cancelled (começar é pelo kanban_tarefa_pegar)'],\n ['in_progress', 'Uma sessão está trabalhando', 'dependências em done e session', 'blocked, in_validation, ready, cancelled'],\n ['blocked', 'Depende de algo de fora', 'blocked_reason', 'in_progress, ready, cancelled'],\n ['in_validation', 'Entregue, esperando aprovação', 'result e approver', 'in_progress, awaiting_deploy, done, cancelled'],\n ['awaiting_deploy', 'Aprovada, falta publicar', 'changes registradas', 'done, in_progress, cancelled'],\n ['done', 'Aprovada ou publicada', 'app_version, se veio do deploy', '— (precisa de ajuste? abra um bug)'],\n ['cancelled', 'Descartada, nunca apagada', 'reason', 'backlog']\n]\n\nconst RUSHES = [\n ['kanban_minha_fila', 'le1ED3ML02nCGBCq1jhRP', '{ person, agent? }', 'Primeiro passo de toda sessão. Devolve caixa de entrada, em andamento, prontas para pegar (dependências já feitas), esperando dependência, bloqueadas, em validação, para aprovar e aguardando deploy.'],\n ['kanban_demanda_salvar', 'l2x8cq1Ba9JV5fzjlgiUN', '{ actor, key?, title, owner, prefix, jira_text, summary, acceptance, status? … }', 'Cria ou atualiza pela key. Sem key, gera CF-N. Valida pessoa, frente e status e grava o evento.'],\n ['kanban_tarefa_criar', 'd8UkM-ZJOPWOWkZNx5Pry', '{ actor, prefix, demand_key, type, title, agent, acceptance, depends_on, touches, approver, status? … }', 'Gera o card_id (maior número da frente + 1). Crie uma por vez. Nasce em backlog, ou ready se já tiver acceptance e agent.'],\n ['kanban_tarefa_atualizar', '7ukxnQTL4Yjr3LSixfEWk', '{ actor, card_id, campos…, note? }', 'Tudo menos status: description, acceptance, plan, depends_on, touches, agent, approver, result, links, session… Só a pessoa dona.'],\n ['kanban_tarefa_pegar', 'VKOHGMiGy7rRhU6FDsFvZ', '{ actor, card_id, session }', 'ready → in_progress, só se as dependências estiverem em done. Devolve aviso de colisão com tarefas em andamento que mexem nas mesmas references.'],\n ['kanban_tarefa_mover', '5Si_x8rE-PiUh-IdlwBMz', '{ actor, card_id, to, result?, approver?, blocked_reason?, app_version?, reason? }', 'Valida a transição e o que cada status exige. Move quem é dona ou quem aprova.'],\n ['kanban_mudanca', 'f3RXndAJjSpfYOFifjTkK', '{ actor, card_id, reference, name, kind, what, backup }', 'Registra cada alteração feita no system (com a tarefa em in_progress) e acrescenta a reference em touches.'],\n ['kanban_evento', 'cy2BrvIvCa89mk9J_nqkR', '{ actor, type, card_id ou demand_key, to?, text, data? }', 'note, request, answer, question ou decision. request e question exigem to (uma pessoa do catálogo) e entram na caixa de entrada dela.'],\n ['kanban_evento_resolver', '_B1ZiptjVMKVQK3dNcSK7', '{ actor, event_id, answer? }', 'Fecha request ou question. question exige answer, que vira um evento decision: a regra decidida.'],\n ['kanban_quadro', '4gnGRN5tFeuBicawv04U9', '{ }', 'Do board: tarefas, demandas, catálogo e pedidos abertos numa chamada.'],\n ['kanban_card', 'MwJgzXAkBEBWRFfpwvcF7', '{ card_id }', 'Do board: o card, a linha do tempo, a demanda, as dependências e quem depende dele.'],\n ['kanban_eu', 'gHlaiRCi-O7vR0uLOCT6w', '{ }', 'Do board: o perfil de quem está logado e, para admin, a equipe.'],\n ['kanban_senha_ok', 'RKSAmkvOcbm9Kcx9Hriiw', '{ }', 'Do board: marca que a pessoa já trocou a senha temporária.'],\n ['kanban_usuario_salvar', '06HyhvqG4jXD6YoDn68Fw', '{ actor, email, person, role, temp_password? }', 'Só admin (ou builder): cadastra acesso com senha temporária ou muda o papel. Não redefine senha de quem já tem acesso.']\n]\n\nconst ROTINA = [\n ['Ler o papel', 'No catálogo, o registro kind papel com a sua key. Siga as instructions.'],\n ['Abrir a fila', 'kanban_minha_fila com o seu nome. Responda primeiro a caixa de entrada.'],\n ['Pegar uma tarefa', 'kanban_tarefa_pegar com o nome da sessão começando pelo card_id. Leia o card, os eventos dele, a demanda e as dependências.'],\n ['Trabalhar', 'Backup antes, kanban_mudanca a cada alteração. Precisa de outra pessoa? kanban_evento request para ela. Dúvida de regra? question, nunca suposição.'],\n ['Entregar', 'kanban_tarefa_mover para in_validation com result e approver.']\n]\n\nconst SEGURANCA = [\n ['Tarefas, Demandas e Eventos', 'O builder só lê (find e get). Gravar é só pelos rushes. save_records e update_records direto dão 401.'],\n ['Catálogo', 'Builder lê e edita; rushes leem.'],\n ['DataSources das 4 tabelas', 'Builder ou rush deste system.'],\n ['Usuários e Perfis', 'Builder ou rush; Usuários também aceita a pessoa logada, mas só para ler o próprio registro.'],\n ['Os 14 rushes', 'Builder (o MCP de cada dev) ou pessoa logada no board. Quando a chamada vem do board, a pessoa é a da sessão, não a do corpo; leitor e bloqueado não gravam.']\n]\n\nconst COMBINADO = [\n '## Kanban do time (br-cf)',\n 'O kanban fica no system natura-br-cf (6671e96b001009d97f222f73), workspace \"kanban mcp\". Toda chamada leva systemId explícito.',\n '',\n 'Ler (query_dataset, só leitura):',\n '- Tarefas: xGWFJ6YYPw7_18GmH_ypIDataSet',\n '- Demandas: hCvHde1zOzxLcT1GWZJrGDataSet',\n '- Eventos: IY33jMLn6x8R1eF8xlzlHDataSet',\n '- Catálogo (frentes, papéis, pessoas): r4oehJcseoCIPn_fYVWg3DataSet',\n '',\n 'Gravar: só pelos rushes, com execute_rush_request (POST). Todo corpo leva actor: { person: \"${esc(titulo)}
${esc(sub)}
${TABELAS.map(t => `\n
`\n\n const status = `\n
`).join('')}${esc(t.papel)}
\n ${esc(t.nome)}
\n${esc(t.desc)}
\n${esc(t.ds)}
${esc(t.campos)}
\n | Status | Quando | Para entrar exige | Pode ir para |
|---|---|---|---|
${s[0]} | ${esc(s[1])} | ${esc(s[2])} | ${esc(s[3])} |
| Rush | Corpo | O que garante |
|---|---|---|
${esc(r[0])}${esc(r[1])} | ${esc(r[2])} | ${esc(r[3])} |
- ${ROTINA.map((p, i) => `
- ${esc(p[0])}${esc(p[1])} `).join('')}
| Onde | Quem passa |
|---|---|
| ${esc(s[0])} | ${esc(s[1])} |
\n \n
`\n\n return `Combinado para colar no ClaudeVai no CLAUDE.md ou na memória do projeto de cada dev.
\n ${esc(COMBINADO)}\n \n \n \n \n ${secao(1, 'As tabelas', 'Catálogo define o que vale; demanda é o ticket; tarefa é o nó da rede; evento é tudo que acontece.', tabelas, 'sec-tabelas')}\n ${secao(2, 'Status da tarefa', 'O kanban_tarefa_mover recusa qualquer transição fora desta tabela.', status, 'sec-status')}\n ${secao(3, 'A API: 9 rushes', 'Chamados pelo MCP com execute_rush_request (POST). Todo corpo que grava leva actor: { person, agent }.', rushes, 'sec-rushes')}\n ${secao(4, 'Como uma sessão trabalha', 'A mesma rotina para qualquer papel.', rotina, 'sec-rotina')}\n ${secao(5, 'Segurança', 'Policies aplicadas em 09/11/2026.', seg, 'sec-seg')}\n ${secao(6, 'Combinado', 'O texto que cada dev cola no próprio Claude.', comb, 'sec-comb')}\n \n
`\n },\n\n mounted(d2) {\n d2.on('.copiar', 'click', async () => {\n try {\n await navigator.clipboard.writeText(COMBINADO)\n d2.state.copiado = true\n setTimeout(() => { d2.state.copiado = false }, 2000)\n } catch (err) {\n const pre = d2.$('.comb pre')\n if (pre) {\n const r = document.createRange()\n r.selectNodeContents(pre)\n const sel = window.getSelection()\n sel.removeAllRanges()\n sel.addRange(r)\n }\n }\n })\n }\n}\n\nfunction esc(v) {\n return String(v == null ? '' : v)\n .replace(/&/g, '&').replace(//g, '>').replace(/\"/g, '"')\n}\n"}}}}}}}},{"_id":"6af23213afec9e7dd0cf1f27","component":"data2-core-types@Component","system":"6671e96b001009d97f222f73","params":{"extends":"data2-core-primitives@Block","component":"kanban_mcp_app","package":"natura-br-cf","definition":{"preventEvaluation":true,"component":"data2-core-types@Definition","params":{"def":{"component":"data2-code-components@CodeHost","params":{"code":{"component":"data2-core-primitives@String","params":{"content":"const STATUS = [\n { k: 'backlog', n: 'Backlog', c: '#8a8f98' },\n { k: 'ready', n: 'Pronta', c: '#4f7cff' },\n { k: 'in_progress', n: 'Em andamento', c: '#0e9f9a' },\n { k: 'blocked', n: 'Bloqueada', c: '#e5484d' },\n { k: 'in_validation', n: 'Em validação', c: '#d97706' },\n { k: 'awaiting_deploy', n: 'Aguardando deploy', c: '#9b59b6' },\n { k: 'done', n: 'Feita', c: '#2f9e44' },\n { k: 'cancelled', n: 'Cancelada', c: '#adb5bd' }\n]\nconst STATUS_DEMANDA = ['open', 'in_progress', 'in_validation', 'done', 'cancelled']\nconst TRANS = {\n backlog: ['ready', 'cancelled'],\n ready: ['backlog', 'blocked', 'cancelled'],\n in_progress: ['blocked', 'in_validation', 'ready', 'cancelled'],\n blocked: ['in_progress', 'ready', 'cancelled'],\n in_validation: ['in_progress', 'awaiting_deploy', 'done', 'cancelled'],\n awaiting_deploy: ['done', 'in_progress', 'cancelled'],\n done: [],\n cancelled: ['backlog']\n}\nconst TIPOS = { feature: 'Feature', spike: 'Spike', bug: 'Bug' }\nconst COR_TIPO = { feature: '#4f7cff', spike: '#0e9f9a', bug: '#e5484d' }\nconst EVENTOS = { created: 'Criada', status: 'Status', note: 'Nota', request: 'Pedido', answer: 'Resposta', question: 'Pergunta', decision: 'Decisão', change: 'Alteração', publish: 'Publicação' }\nconst ROLES = ['admin', 'editor', 'leitor', 'bloqueado']\nconst ENVS = ['DEV', 'HML', 'PRD']\n\nconst AUTOTESTE = autoteste()\n\nexport default {\n css: `\n :host{display:block;height:100%;--bg:#f5f4f1;--card:#fff;--line:#e4e1da;--soft:#f1efea;--tx:#1d1d1b;--tx2:#5c5a55;--tx3:#8b8880;--ac:#a0522d;--ok:#2f9e44;--bad:#e5484d}\n *{box-sizing:border-box}\n .root{height:100%;background:var(--bg);color:var(--tx);font:14px/1.5 system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;display:flex;flex-direction:column;overflow:hidden}\n button{font:inherit;cursor:pointer}\n input,select,textarea{font:inherit;color:var(--tx);background:#fff;border:1px solid #d9d5cc;border-radius:8px;padding:8px 10px;width:100%}\n textarea{min-height:70px;resize:vertical}\n label{display:block;font-size:12px;color:var(--tx2);margin:10px 0 4px;font-weight:600}\n .btn{border:1px solid #d9d5cc;background:#fff;border-radius:8px;padding:7px 12px;color:var(--tx);white-space:nowrap}\n .btn:hover{background:var(--soft)}\n .btn.pri{background:var(--tx);border-color:var(--tx);color:#fff}\n .btn.pri:hover{opacity:.9}\n .btn.min{padding:4px 9px;font-size:12px}\n .btn[disabled]{opacity:.5;cursor:default}\n .erro{background:#fdecec;color:#9b1c1f;border-radius:8px;padding:8px 10px;margin-top:10px;font-size:13px}\n .aviso{background:#fdf0e3;color:#8a4a12;border-radius:8px;padding:8px 10px;margin-top:10px;font-size:13px}\n .centro{flex:1;display:flex;align-items:center;justify-content:center;padding:24px}\n .caixa{width:min(400px,100%);background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px}\n .caixa h1{margin:0 0 4px;font-size:22px}\n .caixa p{margin:0 0 6px;color:var(--tx2)}\n .marca{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ac);font-weight:700}\n .top{display:flex;align-items:center;gap:12px;padding:10px 16px;background:#fff;border-bottom:1px solid var(--line);flex-wrap:wrap}\n .top .nome{font-weight:800;font-size:16px;margin-right:6px}\n .tabs{display:flex;gap:4px;background:var(--soft);border-radius:10px;padding:3px}\n .tab{border:0;background:transparent;border-radius:8px;padding:6px 12px;color:var(--tx2)}\n .tab.on{background:#fff;color:var(--tx);box-shadow:0 1px 2px rgba(0,0,0,.08)}\n .badge{display:inline-block;min-width:18px;padding:0 5px;border-radius:9px;background:var(--bad);color:#fff;font-size:11px;font-weight:700;margin-left:5px;text-align:center}\n .esp{flex:1}\n .eu{font-size:13px;color:var(--tx2)}\n .filtros{display:flex;gap:8px;padding:10px 16px;flex-wrap:wrap;align-items:center;border-bottom:1px solid var(--line);background:#fbfaf8}\n .filtros input[type=search]{width:240px}\n .filtros select{width:auto;min-width:130px}\n .chk{display:flex;gap:6px;align-items:center;font-size:13px;color:var(--tx2);margin:0}\n .chk input{width:auto}\n .main{flex:1;overflow:auto;min-height:0}\n .cols{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(250px,1fr);gap:12px;padding:14px 16px;height:100%;min-height:400px}\n .col{background:var(--soft);border-radius:12px;display:flex;flex-direction:column;min-height:0}\n .col-h{display:flex;align-items:center;gap:8px;padding:10px 12px;font-weight:700;font-size:13px}\n .dot{width:9px;height:9px;border-radius:50%;flex:none}\n .col-h .n{margin-left:auto;color:var(--tx3);font-weight:600}\n .col-b{overflow:auto;padding:0 8px 8px;display:flex;flex-direction:column;gap:8px}\n .tile{background:#fff;border:1px solid var(--line);border-left:3px solid var(--line);border-radius:10px;padding:10px 11px;cursor:pointer;text-align:left;width:100%}\n .tile:hover{box-shadow:0 2px 8px rgba(0,0,0,.06)}\n .tile .l1{display:flex;gap:6px;align-items:center;font-size:12px;color:var(--tx3);font-weight:700}\n .tile .t{font-weight:600;margin:4px 0 8px;font-size:13.5px;line-height:1.35;color:var(--tx)}\n .tile .l3{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--tx2)}\n .chip{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:1px 8px;font-size:11.5px;font-weight:600;background:var(--soft);color:var(--tx2)}\n .av{width:22px;height:22px;border-radius:50%;background:#e9e3d8;color:#6b4a2b;font-size:10.5px;font-weight:800;display:inline-flex;align-items:center;justify-content:center}\n .vazio{color:var(--tx3);font-size:13px;padding:10px;text-align:center;border:1px dashed var(--line);border-radius:10px}\n .painel{padding:16px;display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}\n .kpis{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));grid-column:1/-1}\n .kpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px}\n .kpi .v{font-size:28px;font-weight:800}\n .kpi .r{font-size:12px;color:var(--tx3);text-transform:uppercase;letter-spacing:.04em}\n .bloco{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px}\n .bloco h3{margin:0 0 10px;font-size:14px}\n .barra{display:grid;grid-template-columns:130px 1fr 34px;gap:8px;align-items:center;font-size:13px;margin:6px 0}\n .barra .trilho{height:8px;background:var(--soft);border-radius:4px;overflow:hidden}\n .barra .enche{height:100%;border-radius:4px}\n .barra .q{text-align:right;color:var(--tx2);font-weight:600}\n .lin{display:flex;gap:8px;align-items:flex-start;padding:8px 0;border-top:1px solid var(--soft);font-size:13px}\n .lin:first-of-type{border-top:0}\n .link{border:0;background:none;padding:0;color:var(--ac);font-weight:700;text-decoration:underline;cursor:pointer}\n .scrim{position:fixed;inset:0;background:rgba(20,18,15,.45);display:flex;align-items:flex-start;justify-content:center;padding:4vh 12px;z-index:50;overflow:auto}\n .modal{background:#fff;border-radius:14px;width:min(1080px,100%);box-shadow:0 20px 60px rgba(0,0,0,.25)}\n .modal.peq{width:min(560px,100%)}\n .m-h{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line)}\n .m-h h2{margin:0;font-size:17px;flex:1}\n .m-b{padding:16px 18px}\n .duas{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:18px}\n .grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px 14px;margin:8px 0 12px}\n .grade div span{display:block;font-size:11.5px;color:var(--tx3);text-transform:uppercase;letter-spacing:.04em}\n .sec{margin-top:14px}\n .sec h4{margin:0 0 6px;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--tx3)}\n .texto{white-space:pre-wrap;word-break:break-word;background:#fbfaf8;border:1px solid var(--soft);border-radius:8px;padding:8px 10px;font-size:13px}\n ul.l{margin:0;padding-left:18px}\n .acoes{background:#fbfaf8;border:1px solid var(--line);border-radius:12px;padding:12px}\n .acoes h4{margin:0 0 4px}\n .ev{border-left:2px solid var(--line);padding:2px 0 10px 12px;position:relative}\n .ev::before{content:'';position:absolute;left:-5px;top:6px;width:8px;height:8px;border-radius:50%;background:var(--ac)}\n .ev .q{font-size:12px;color:var(--tx3)}\n .ev .x{white-space:pre-wrap;word-break:break-word;font-size:13px}\n .ev.aberto::before{background:var(--bad)}\n .linha{display:flex;gap:8px;align-items:center;flex-wrap:wrap}\n .toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:var(--tx);color:#fff;border-radius:10px;padding:9px 16px;z-index:60;font-size:13px}\n table.t{width:100%;border-collapse:collapse;font-size:13px}\n table.t th{text-align:left;font-size:11.5px;color:var(--tx3);text-transform:uppercase;padding:6px 8px;border-bottom:1px solid var(--line)}\n table.t td{padding:8px;border-bottom:1px solid var(--soft);vertical-align:middle}\n table.t select{width:auto}\n .muted{color:var(--tx3);font-size:12.5px}\n @media (max-width:860px){.duas{grid-template-columns:1fr}.filtros input[type=search]{width:100%}}\n `,\n\n render(d2) {\n const S = d2.state\n const fase = S.fase || 'carregando'\n let corpo = ''\n if (fase === 'carregando') corpo = `kanban mcp · natura-br-cf
\n Modelo do kanban
\nA rede de tarefas dos agentes do time. Qualquer agente, de qualquer dev, chega a uma tarefa e consegue trabalhar só com o que está nas tabelas. Os agentes leem direto e gravam só pelos rushes, que validam tudo.
\n \nCarregando o kanban…
${esc(S.toast)}
` : ''\n const falhas = AUTOTESTE.length ? `Autoteste: ${esc(AUTOTESTE.join(' | '))}
` : ''\n return `${falhas}${corpo}${toast}
`\n },\n\n async mounted(d2) {\n d2.on('[data-act]', 'click', (e, el) => { e.preventDefault(); acao(d2, el.dataset.act, el) })\n const filtro = (e, el) => {\n const f = Object.assign({}, d2.state.f || {})\n f[el.dataset.filtro] = el.type === 'checkbox' ? el.checked : el.value\n d2.state.f = f\n }\n d2.on('[data-filtro]', 'input', filtro)\n d2.on('[data-filtro]', 'change', filtro)\n d2.on('select[name=mv_to]', 'change', (e, el) => { d2.state.mvTo = el.value })\n d2.on('select[name=ev_tipo]', 'change', (e, el) => { d2.state.evTipo = el.value })\n d2.on('input[name=lg_senha]', 'keydown', (e) => { if (e.key === 'Enter') acao(d2, 'login') })\n d2.on(window, 'keydown', (e) => { if (e.key === 'Escape' && d2.state.modal) d2.state.modal = null })\n if (d2.context.isBuilder && !d2.context.isPlaying) { d2.state.fase = 'login'; return }\n await iniciar(d2)\n }\n}\n\nfunction autoteste() {\n const falhas = []\n const me = { person: 'Ana Teste', role: 'admin', email: 'ana@x.com' }\n const t1 = { card_id: 'KB-1', prefix: 'KB', number: 1, demand_key: 'CF-1', title: 'Um', type: 'feature', owner: 'Ana Teste', agent: 'DEV', approver: 'Ana Teste', status: 'in_validation', depends_on: [], touches: [{ reference: 'abc', name: 'Tabela', kind: 'table' }], changes: [{ reference: 'abc', name: 'Tabela', what: 'criada', at: '2026-11-09T10:00:00Z', by: 'Ana' }], acceptance: ['a', 'b'], description: 'x', plan: 'p', result: 'r', priority: 1, status_changed_at: '2026-11-09T10:00:00Z' }\n const t2 = Object.assign({}, t1, { card_id: 'KB-2', number: 2, status: 'blocked', depends_on: ['KB-1'], blocked_reason: 'esperando', type: 'bug', acceptance: [] })\n const t3 = Object.assign({}, t1, { card_id: 'KB-3', number: 3, status: 'awaiting_deploy', type: 'spike' })\n const dados = { tasks: [t1, t2, t3], demands: [{ key: 'CF-1', title: 'Demanda', status: 'open', prefix: 'KB', owner: 'Ana Teste', url: 'https://x' }], catalog: [{ kind: 'frente', key: 'KB', name: 'Kanban' }, { kind: 'papel', key: 'DEV', name: 'Dev' }, { kind: 'pessoa', key: 'Ana Teste' }], open: [{ _id: 'e1', type: 'request', to: 'Ana Teste', from_person: 'Bia', card_id: 'KB-1', text: 'oi', created_at: '2026-11-09T10:00:00Z' }] }\n const cardData = { ok: true, card: t1, demand: dados.demands[0], events: [{ _id: 'e1', type: 'question', to: 'Ana Teste', from_person: 'Bia', text: 'q?', resolved: false, created_at: '2026-11-09T10:00:00Z' }, { _id: 'e2', type: 'status', from_person: 'Ana', text: 'a → b', resolved: true }], depends_on: [{ card_id: 'KB-0', title: 'z', status: 'done' }], dependents: [{ card_id: 'KB-2', title: 'dois', status: 'blocked' }] }\n const base = { me, dados, team: [{ email: 'ana@x.com', person: 'Ana Teste', role: 'admin', must_change_password: false }], f: { q: 'k', minhas: true, canceladas: true } }\n const casos = [\n ['login', () => telaLogin({ erroLogin: 'x' })],\n ['trocar', () => telaTrocar({ me, erroSenha: 'x' })],\n ['quadro', () => telaApp(Object.assign({}, base, { view: 'quadro' }))],\n ['painel', () => telaApp(Object.assign({}, base, { view: 'painel' }))],\n ['demandas', () => telaApp(Object.assign({}, base, { view: 'demandas' }))],\n ['equipe', () => telaApp(Object.assign({}, base, { view: 'equipe', erroEquipe: 'x' }))],\n ['card', () => telaApp(Object.assign({}, base, { modal: { tipo: 'card', id: 'KB-1' }, cardData, erroModal: 'x' }))],\n ['card-mover', () => ['in_validation', 'blocked', 'done', 'cancelled', 'in_progress'].map(mv => telaApp(Object.assign({}, base, { modal: { tipo: 'card', id: 'KB-1' }, cardData: Object.assign({}, cardData, { card: Object.assign({}, t3) }), mvTo: mv, evTipo: 'request' }))).join('')],\n ['card-editar', () => telaApp(Object.assign({}, base, { modal: { tipo: 'card', id: 'KB-1' }, cardData, editando: true }))],\n ['card-carregando', () => telaApp(Object.assign({}, base, { modal: { tipo: 'card', id: 'KB-1' }, cardData: null }))],\n ['card-erro', () => telaApp(Object.assign({}, base, { modal: { tipo: 'card', id: 'KB-1' }, cardData: { erro: 'x' } }))],\n ['novoCard', () => telaApp(Object.assign({}, base, { modal: { tipo: 'novoCard', demanda: 'CF-1' } }))],\n ['novaDemanda', () => telaApp(Object.assign({}, base, { modal: { tipo: 'novaDemanda' } }))],\n ['senha', () => telaApp(Object.assign({}, base, { modal: { tipo: 'senha' } }))],\n ['vazio', () => telaApp({ me: { person: 'X', role: 'leitor' }, dados: { tasks: [], demands: [], catalog: [], open: [] } })]\n ]\n casos.forEach(c => { try { const h = c[1](); if (!h || typeof h !== 'string') falhas.push(c[0] + ': vazio') } catch (e) { falhas.push(c[0] + ': ' + e.message) } })\n return falhas\n}\n\nfunction esc(v) {\n return String(v == null ? '' : v).replace(/&/g, '&').replace(//g, '>').replace(/\"/g, '"')\n}\nfunction quando(s) {\n if (!s) return ''\n const d = new Date(s)\n if (isNaN(d.getTime())) return esc(s)\n return d.toLocaleString('pt-BR', { day: '2-digit', month: '2-digit', year: '2-digit', hour: '2-digit', minute: '2-digit' })\n}\nfunction iniciais(n) {\n const p = String(n || '?').trim().split(/\\s+/)\n return esc(((p[0] || '')[0] || '') + ((p.length > 1 ? p[p.length - 1][0] : '') || '')).toUpperCase()\n}\nfunction stInfo(k) { return STATUS.find(s => s.k === k) || { k, n: k || '—', c: '#8a8f98' } }\nfunction opcoes(lista, atual, vazio) {\n const base = vazio != null ? `` : ''\n return base + lista.map(o => {\n const v = typeof o === 'string' ? o : o.v\n const t = typeof o === 'string' ? o : o.t\n return ``\n }).join('')\n}\nfunction val(d2, nome) {\n const el = d2.$(`[name=\"${nome}\"]`)\n return el ? String(el.value || '').trim() : ''\n}\nfunction linhas(t) { return String(t || '').split('\\n').map(x => x.trim()).filter(Boolean) }\nfunction lista(t) { return String(t || '').split(/[,\\s]+/).map(x => x.trim().toUpperCase()).filter(Boolean) }\nfunction msgErro(err) {\n if (!err) return 'erro desconhecido'\n if (typeof err === 'string') return err\n return err.message || (err.data && err.data.message) || err.error || JSON.stringify(err).slice(0, 200)\n}\nfunction catalogo(S, kind) { return ((S.dados && S.dados.catalog) || []).filter(c => c.kind === kind) }\nfunction podeGravar(S) { return S.me && ['admin', 'editor', 'builder'].includes(S.me.role) }\nfunction aviso(d2, t) {\n d2.state.toast = t\n setTimeout(() => { if (d2.state.toast === t) d2.state.toast = null }, 2600)\n}\n\nasync function chamar(d2, nome, body) {\n const r = await d2.rush(d2.param(nome)).invoke(body || {})\n if (r && typeof r === 'object' && r.data && typeof r.data === 'object' && ('ok' in r.data)) return r.data\n return r\n}\n\nasync function iniciar(d2) {\n const S = d2.state\n try {\n const eu = await chamar(d2, 'rEu', {})\n if (eu && eu.ok) {\n S.me = eu.me\n S.team = eu.team || []\n if (eu.me && eu.me.must_change_password) { S.fase = 'trocar'; return }\n await carregar(d2)\n S.fase = 'app'\n return\n }\n if (S.tentouLogin && eu && eu.errors) S.erroLogin = eu.errors.join(' ')\n S.fase = 'login'\n } catch (err) {\n S.fase = 'login'\n }\n}\n\nasync function carregar(d2) {\n const q = await chamar(d2, 'rQuadro', {})\n if (!q || !q.ok) throw new Error(((q && q.errors) || ['não consegui carregar o quadro']).join(' '))\n d2.state.dados = { tasks: q.tasks || [], demands: q.demands || [], catalog: q.catalog || [], open: q.open_events || [], at: q.generated_at }\n}\n\nasync function carregarCard(d2, id) {\n try {\n const c = await chamar(d2, 'rCard', { card_id: id })\n d2.state.cardData = c && c.ok ? c : { erro: ((c && c.errors) || ['não consegui abrir o card']).join(' ') }\n } catch (err) {\n d2.state.cardData = { erro: msgErro(err) }\n }\n}\n\nasync function gravar(d2, nome, body, okMsg) {\n const S = d2.state\n S.busy = true\n S.erroModal = null\n try {\n const r = await chamar(d2, nome, body)\n if (!r || !r.ok) { S.erroModal = ((r && r.errors) || ['a gravação falhou']).join(' • '); return null }\n aviso(d2, okMsg)\n await carregar(d2)\n if (S.modal && S.modal.tipo === 'card') await carregarCard(d2, S.modal.id)\n return r\n } catch (err) {\n S.erroModal = msgErro(err)\n return null\n } finally {\n S.busy = false\n }\n}\n\nfunction limpo(o) {\n const r = {}\n Object.keys(o).forEach(k => { const v = o[k]; if (v !== '' && v != null && !(Array.isArray(v) && v.length === 0 && k !== 'acceptance' && k !== 'depends_on')) r[k] = v })\n return r\n}\n\nasync function acao(d2, act, el) {\n const S = d2.state\n if (S.busy && act !== 'fechar') return\n const card = S.modal && S.modal.tipo === 'card' && S.cardData && S.cardData.card\n if (act === 'login') {\n const email = val(d2, 'lg_email'), senha = val(d2, 'lg_senha')\n if (!email || !senha) { S.erroLogin = 'Informe e-mail e senha.'; return }\n S.busy = true; S.erroLogin = null\n try {\n const r = await d2.auth(d2.param('auth')).login({ email, password: senha })\n if (r && (r.isData2Error || r.error)) throw r\n S.tentouLogin = true\n await iniciar(d2)\n if (S.fase === 'login' && !S.erroLogin) S.erroLogin = 'Entrou, mas o seu e-mail não tem perfil no kanban. Peça ao admin.'\n } catch (err) {\n try { console.error('[kanban] login falhou', err) } catch (e) {}\n S.erroLogin = 'Não consegui entrar. Detalhe técnico: ' + msgErro(err)\n } finally { S.busy = false }\n return\n }\n if (act === 'trocar') {\n const atual = val(d2, 'pw_atual'), nova = val(d2, 'pw_nova'), conf = val(d2, 'pw_conf')\n S.erroSenha = null\n if (nova.length < 8) { S.erroSenha = 'A senha nova precisa ter pelo menos 8 caracteres.'; return }\n if (nova !== conf) { S.erroSenha = 'A confirmação não confere com a senha nova.'; return }\n if (nova === atual) { S.erroSenha = 'A senha nova precisa ser diferente da atual.'; return }\n S.busy = true\n try {\n const r = await d2.auth(d2.param('auth')).changePassword({ email: S.me && S.me.email, password: atual, oldPassword: atual, currentPassword: atual, newPassword: nova, newPasswordConfirmation: nova, passwordConfirmation: nova })\n if (r && (r.isData2Error || r.error)) throw r\n await chamar(d2, 'rSenhaOk', {})\n if (S.me) S.me = Object.assign({}, S.me, { must_change_password: false })\n aviso(d2, 'Senha trocada.')\n if (S.fase === 'trocar') { await carregar(d2); S.fase = 'app' } else S.modal = null\n } catch (err) {\n S.erroSenha = 'Não consegui trocar a senha: ' + msgErro(err)\n } finally { S.busy = false }\n return\n }\n if (act === 'sair') {\n try { await d2.auth(d2.param('auth')).logout() } catch (e) {}\n d2.setState({ fase: 'login', me: null, dados: null, modal: null, cardData: null, team: [], tentouLogin: false, erroLogin: null })\n return\n }\n if (act === 'view') { S.view = el.dataset.v; return }\n if (act === 'recarregar') { S.busy = true; try { await carregar(d2); aviso(d2, 'Atualizado.') } catch (err) { aviso(d2, msgErro(err)) } finally { S.busy = false } return }\n if (act === 'abrir') {\n d2.setState({ modal: { tipo: 'card', id: el.dataset.id }, cardData: null, mvTo: '', editando: false, erroModal: null, evTipo: 'note' })\n await carregarCard(d2, el.dataset.id)\n return\n }\n if (act === 'fechar') { d2.setState({ modal: null, cardData: null, erroModal: null, erroSenha: null }); return }\n if (act === 'novoCard') { d2.setState({ modal: { tipo: 'novoCard', demanda: el.dataset.demanda || '' }, erroModal: null }); return }\n if (act === 'novaDemanda') { d2.setState({ modal: { tipo: 'novaDemanda' }, erroModal: null }); return }\n if (act === 'senhaModal') { d2.setState({ modal: { tipo: 'senha' }, erroSenha: null }); return }\n if (act === 'criarCard') {\n const r = await gravar(d2, 'rCriar', limpo({\n demand_key: val(d2, 'nc_demanda'), prefix: val(d2, 'nc_prefixo'), type: val(d2, 'nc_tipo'), title: val(d2, 'nc_titulo'),\n agent: val(d2, 'nc_papel'), approver: val(d2, 'nc_aprova'), description: val(d2, 'nc_desc'), acceptance: linhas(val(d2, 'nc_aceite')),\n depends_on: lista(val(d2, 'nc_deps')), status: val(d2, 'nc_status'), env: val(d2, 'nc_env'), priority: val(d2, 'nc_prio') ? Number(val(d2, 'nc_prio')) : null\n }), 'Tarefa criada.')\n if (r && r.card) { d2.setState({ modal: { tipo: 'card', id: r.card.card_id }, cardData: null, mvTo: '' }); await carregarCard(d2, r.card.card_id) }\n return\n }\n if (act === 'criarDemanda') {\n const r = await gravar(d2, 'rDemanda', limpo({\n key: val(d2, 'nd_chave'), title: val(d2, 'nd_titulo'), url: val(d2, 'nd_url'), prefix: val(d2, 'nd_prefixo'), owner: val(d2, 'nd_dono'),\n requester: val(d2, 'nd_pediu'), summary: val(d2, 'nd_resumo'), jira_text: val(d2, 'nd_jira'), acceptance: linhas(val(d2, 'nd_aceite'))\n }), 'Demanda salva.')\n if (r) d2.setState({ modal: null })\n return\n }\n if (act === 'statusDemanda') {\n await gravar(d2, 'rDemanda', { key: el.dataset.key, status: val(d2, 'dm_status') }, 'Status da demanda atualizado.')\n return\n }\n if (act === 'eqGerar') {\n const cs = 'ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnpqrstuvwxyz23456789'\n const arr = new Uint32Array(12)\n crypto.getRandomValues(arr)\n const s = Array.from(arr).map(n => cs[n % cs.length]).join('')\n const i = d2.$('[name=\"eq_senha\"]')\n if (i) i.value = s\n return\n }\n if (act === 'eqCriar' || act === 'eqPapel') {\n const body = act === 'eqCriar'\n ? { email: val(d2, 'eq_email'), person: val(d2, 'eq_pessoa'), role: val(d2, 'eq_papel'), temp_password: val(d2, 'eq_senha') }\n : { email: el.dataset.email, role: val(d2, `role_${el.dataset.i}`) }\n S.busy = true\n S.erroEquipe = null\n try {\n const r = await chamar(d2, 'rUsuario', body)\n if (!r || !r.ok) { S.erroEquipe = ((r && r.errors) || ['falhou']).join(' • '); return }\n const eu = await chamar(d2, 'rEu', {})\n if (eu && eu.ok) S.team = eu.team || []\n await carregar(d2)\n if (act === 'eqCriar') {\n aviso(d2, 'Pessoa cadastrada. Passe a senha temporária para ela por um canal privado.')\n ;['eq_email', 'eq_pessoa'].forEach(n => { const i = d2.$(`[name=\"${n}\"]`); if (i) i.value = '' })\n } else aviso(d2, 'Papel atualizado.')\n } catch (err) {\n S.erroEquipe = msgErro(err)\n } finally { S.busy = false }\n return\n }\n if (!card) return\n if (act === 'pegar') { await gravar(d2, 'rPegar', { card_id: card.card_id, session: `Board · ${S.me && S.me.person}` }, 'Tarefa em andamento.'); return }\n if (act === 'mover') {\n const to = val(d2, 'mv_to')\n if (!to) { S.erroModal = 'Escolha o status de destino.'; return }\n const r = await gravar(d2, 'rMover', limpo({ card_id: card.card_id, to, result: val(d2, 'mv_result'), approver: val(d2, 'mv_aprova'), blocked_reason: val(d2, 'mv_bloq'), app_version: val(d2, 'mv_versao'), reason: val(d2, 'mv_motivo') }), 'Status atualizado.')\n if (r) S.mvTo = ''\n return\n }\n if (act === 'editar') { S.editando = true; S.erroModal = null; return }\n if (act === 'cancelarEdicao') { S.editando = false; return }\n if (act === 'salvarEdicao') {\n const prio = val(d2, 'ed_prio')\n const r = await gravar(d2, 'rAtualizar', {\n card_id: card.card_id, title: val(d2, 'ed_titulo'), description: val(d2, 'ed_desc'), acceptance: linhas(val(d2, 'ed_aceite')), plan: val(d2, 'ed_plano'),\n agent: val(d2, 'ed_papel') || undefined, approver: val(d2, 'ed_aprova') || undefined, depends_on: lista(val(d2, 'ed_deps')), env: val(d2, 'ed_env') || undefined,\n priority: prio ? Number(prio) : undefined, result: val(d2, 'ed_result') || undefined\n }, 'Card atualizado.')\n if (r) S.editando = false\n return\n }\n if (act === 'comentar') {\n const tipo = val(d2, 'ev_tipo') || 'note'\n const r = await gravar(d2, 'rEvento', limpo({ type: tipo, card_id: card.card_id, to: (tipo === 'request' || tipo === 'question') ? val(d2, 'ev_para') : '', text: val(d2, 'ev_texto') }), 'Registrado.')\n if (r) { const t = d2.$('[name=\"ev_texto\"]'); if (t) t.value = '' }\n return\n }\n if (act === 'resolver') {\n await gravar(d2, 'rResolver', limpo({ event_id: el.dataset.id, answer: val(d2, `ans_${el.dataset.id}`) }), 'Resolvido.')\n return\n }\n}\n\nfunction telaLogin(S) {\n return `\n
kanban mcp · br-cf
\n Entrar
\nUse o e-mail e a senha que o admin do kanban cadastrou para você.
\n \n \n ${S.erroLogin ? `${esc(S.erroLogin)}
` : ''}\n \n Esqueceu a senha? Peça ao admin do kanban um acesso novo.
\n${esc(S.erroSenha)}
` : ''}`\n}\n\nfunction telaTrocar(S) {\n return `\n
primeiro acesso
\n Defina a sua senha
\n${esc(S.me && S.me.person)}, troque a senha temporária antes de entrar no kanban.
\n ${formSenha(S)}\n\n \n \n
\n \n \n \n \n ${ehAdmin ? `` : ''}\n
`\n const novo = podeGravar(S) ? `` : ''\n const top = `\n \n \n \n \n \n \n \n
`\n}\n\nfunction telaQuadro(S) {\n const tarefas = filtrar(S)\n const f = S.f || {}\n const abertos = (S.dados && S.dados.open) || []\n const todas = (S.dados && S.dados.tasks) || []\n const statusDe = {}\n todas.forEach(t => { statusDe[t.card_id] = t.status })\n const cols = STATUS.filter(s => s.k !== 'cancelled' || f.canceladas).map(s => {\n const lista = tarefas.filter(t => t.status === s.k)\n const tiles = lista.map(t => {\n const depsAbertas = (t.depends_on || []).filter(d => statusDe[d] !== 'done').length\n const pend = abertos.filter(e => e.card_id === t.card_id).length\n return ``\n }).join('')\n return `${esc(s.n)}${lista.length}
\n ${tiles || `
\n Nenhuma tarefa
`}${cols}
${esc(titulo)}
${itens.length ? itens.map(i => ``).join('') : 'Nada ainda.
'}${k[1]}
${esc(k[0])}
Minha caixa de entrada
${minhaCaixa.length ? minhaCaixa.map(e => `${esc(EVENTOS[e.type] || e.type)}${e.card_id ? `` : esc(e.demand_key || '')}
`).join('') : '${esc(e.text)}
${esc(e.from_person)}${e.from_agent ? ' · ' + esc(e.from_agent) : ''} · ${quando(e.created_at)}
Nada esperando por você.
'}Esperando a sua aprovação
${aprovar.length ? aprovar.map(t => `${esc(t.title)}
${esc(t.owner)} · desde ${quando(t.status_changed_at)}
Nenhuma entrega esperando você.
'}Bloqueadas
${bloq.length ? bloq.map(t => `${esc(t.title)}
${esc(t.blocked_reason || '')}
Nenhuma tarefa bloqueada.
'}${kpis}
${caixa}${apr}${blq}${barras('Por status', porStatus)}${barras('Em aberto por frente', porFrente)}${barras('Em aberto por pessoa', porPessoa)}${esc(d.summary || '')}
Demandas
\n| Chave | Título | Frente | Dono | Status | Feitas | |
|---|---|---|---|---|---|---|
| Nenhuma demanda. |
Para filtrar o quadro por uma demanda, use o filtro \"Todas as demandas\" na aba Quadro.
\n\n
\n \n \n
Equipe
\n| Pessoa | Papel | Senha | ||
|---|---|---|---|---|
| Ninguém cadastrado. |
leitor só vê; editor grava; admin também gerencia a equipe; bloqueado não entra no quadro.
\nCadastrar pessoa
\n \n \n \n \n \n ${S.erroEquipe ? `${esc(S.erroEquipe)}
` : ''}\n \n Ainda não dá para redefinir a senha de quem já tem acesso: a própria pessoa troca no board. Se alguém esquecer, fale com o Claude do time.
\nTrocar senha
${formSenha(S)}
Nova demanda
\n \n \n \n \n \n \n \n \n \n ${S.erroModal ? `
${esc(S.erroModal)}
` : ''}\n \n Nova tarefa
\n \n
\n
\n \n \n
\n \n \n \n \n \n
\n ${S.erroModal ? `${esc(S.erroModal)}
` : ''}\n \n ${esc(S.modal.id)}
${fechar}Carregando…
${esc(S.modal.id)}
${fechar}${esc(cd.erro)}
${esc(n)}${v ? esc(v) : '—'}
`\n const grade = `${campo('Dona', c.owner)}${campo('Papel do agente', c.agent)}${campo('Quem aprova', c.approver)}${campo('Sessão', c.session)}${campo('Ambiente', c.env)}${campo('Prioridade', c.priority)}${campo('Versão do app', c.app_version)}${campo('No status desde', quando(c.status_changed_at))}
`\n const lst = (arr) => (arr && arr.length) ? `- ${arr.map(x => `
- ${esc(x)} `).join('')}
${esc(t.reference)} ${t.kind ? `${esc(t.kind)}` : ''}${esc(m.reference)}: ${esc(m.what)}${m.backup ? ` (backup: ${esc(m.backup)})` : ''}${esc(m.by || '')} · ${quando(m.at)}
\n \n \n
\n \n \n \n \n \n ${S.erroModal ? `${esc(S.erroModal)}
` : ''}\n `\n } else {\n esquerda = `${esc(TIPOS[c.type] || c.type || '')}● ${esc(st.n)}\n ${dem.key ? `Demanda ${esc(dem.key)} · ${esc(dem.title || '')}${dem.url ? ` · JIRA` : ''}` : ''}
\n ${grade}\n ${c.blocked_reason ? `Bloqueada: ${esc(c.blocked_reason)}
` : ''}\n Descrição
${esc(c.description || '—')}
Critérios de pronto
${lst(c.acceptance)}Plano
${esc(c.plan)}
Resultado
${esc(c.result)}
Depende de
${deps ? `- ${deps}
Dependem desta
${depd ? `- ${depd}
O que mexe
${toques ? `- ${toques}
Alterações feitas
${mudancas ? `- ${mudancas}
Criada em ${quando(c.created_at)} por ${esc(c.created_by || '')} · atualizada em ${quando(c.updated_at)} por ${esc(c.updated_by || '')}
`\n }\n const destinos = (TRANS[c.status] || []).map(k => ({ v: k, t: stInfo(k).n }))\n const mv = S.mvTo || ''\n const pessoas = catalogo(S, 'pessoa').map(p => p.key)\n let acoes = ''\n if (grava && !S.editando) {\n const extra = mv === 'in_validation' ? ``\n : mv === 'blocked' ? ``\n : mv === 'done' && c.status === 'awaiting_deploy' ? ``\n : mv === 'cancelled' ? ``\n : mv ? `` : ''\n acoes = `\n ${c.status === 'ready' && c.owner === me.person ? `` : ''}\n ${(ehDono || ehAprov) && destinos.length ? `${extra}` : ''}\n ${ehDono ? `` : ''}\n ${S.erroModal ? `
`\n }\n const tipoEv = S.evTipo || 'note'\n const comentar = grava ? `${esc(S.erroModal)}
` : ''}\n Registrar
\n\n ${tipoEv === 'request' || tipoEv === 'question' ? `` : ''}
\n \n \n
`\n }).join('')\n return `${esc(EVENTOS[e.type] || e.type)} · ${esc(e.from_person || '')}${e.from_agent ? ' · ' + esc(e.from_agent) : ''}${e.to ? ' → ' + esc(e.to) : ''} · ${quando(e.created_at)}${aberto ? ' · aberto' : ''}
\n ${esc(e.text)}
\n ${podeResolver ? `` : ''}\n \n \n \n
[${esc(c.card_id)}] ${esc(c.title)}
${fechar}\n
${esquerda}
\n ${acoes}${comentar}
\n