@meistrari/minuta-nuxt 0.1.0

package/dist/runtime/components/MinutaEmbed.vue

@@ -0,0 +1,783 @@
+<script setup lang="ts">
+import type { Editor } from '@tiptap/core'
+import { computed, markRaw, nextTick, onMounted, onUnmounted, reactive, ref, resolveComponent, shallowRef, watch } from 'vue'
+import type { Minuta, MinutaAnalysis, MinutaChrome, MinutaVersion } from '../composables/useMinutaApi'
+import { useMinutaApi } from '../composables/useMinutaApi'
+import type { ApplyChatEditResult, MinutaChatEdit } from '../composables/chatEditOps'
+import { applyChatEditOps, mergeChatAnnotations } from '../composables/chatEditOps'
+import { pocPageKey } from '../composables/paginationPlugin'
+import { pocEnterVersionDiff, pocExitVersionDiff } from '../composables/versionDiff'
+import { refreshVaultImages } from '../composables/vaultImages'
+import MinutaDocxEditor from './MinutaDocxEditor.vue'
+import MinutaAnnotationsGutter from './MinutaAnnotationsGutter.vue'
+import MinutaChatEditCard from './MinutaChatEditCard.vue'
+import MinutaChromeEditor from './MinutaChromeEditor.vue'
+import MinutaDocumentViewer from './MinutaDocumentViewer.vue'
+
+const props = withDefaults(defineProps<{
+    minutaId: string
+    /** permite editar o documento (default: true) */
+    editable?: boolean
+    /** salva automaticamente 2s após a última edição (default: true) */
+    autoSave?: boolean
+    /** mostra a barra superior com nome, status de save e export (default: true) */
+    showToolbar?: boolean
+    /** margens da página em px @96dpi (default: 2,5cm topo/rodapé, 3cm laterais) */
+    margins?: { top: number, right: number, bottom: number, left: number }
+    /**
+     * id de plataforma de um agente Tela de edição de minuta: habilita o
+     * assistente de chat na coluna esquerda. Requer `@meistrari/chat-nuxt`
+     * registrado como módulo no app host (o pacote já traz a dependência).
+     */
+    chatAgentId?: string | null
+    /** deixa o nome da minuta editável na barra (default: segue `editable`) */
+    renamable?: boolean
+}>(), {
+    editable: true,
+    autoSave: true,
+    showToolbar: true,
+    margins: () => ({ top: 95, right: 113, bottom: 95, left: 113 }),
+    chatAgentId: null,
+    renamable: undefined,
+})
+
+const emit = defineEmits<{
+    ready: [editor: Editor]
+    saved: [minuta: Minuta]
+    error: [message: string]
+}>()
+
+const HEADER = { logoUrl: null as string | null, position: 'left' as const }
+
+// cabeçalho/rodapé editáveis no canvas (persistidos na minuta)
+const chromeText = reactive({
+    header: '',
+    footer: '',
+    headerScope: 'all' as 'all' | 'first',
+    footerScope: 'all' as 'all' | 'first',
+    showPageNumber: true,
+})
+
+function hydrateChrome(chrome?: MinutaChrome | null) {
+    chromeText.header = chrome?.header ?? ''
+    chromeText.footer = chrome?.footer ?? ''
+    chromeText.headerScope = chrome?.headerScope ?? 'all'
+    chromeText.footerScope = chrome?.footerScope ?? 'all'
+    chromeText.showPageNumber = chrome?.showPageNumber !== false
+}
+
+const api = useMinutaApi()
+
+const minuta = ref<Minuta | null>(null)
+const isLoading = ref(true)
+const loadError = ref<string | null>(null)
+const editor = shallowRef<Editor | null>(null)
+// preview de uma versão antiga: trava auto-save, export e edição
+const versionPreview = ref<{ versionNumber: number, createdAt: string } | null>(null)
+// debounce do PATCH de análise (anotações mudam a cada edição do texto)
+let analysisPatchTimer: ReturnType<typeof setTimeout> | null = null
+const saveState = ref<'idle' | 'pending' | 'saving' | 'saved' | 'error'>('idle')
+const isExporting = ref(false)
+
+// nome editável na barra: o host que renderiza sem toolbar própria (ou que só
+// injeta um botão de voltar) continua com o rename dentro do embed
+const canRename = computed(() => props.renamable ?? props.editable)
+const editableName = ref('')
+const nameInputRef = ref<HTMLInputElement | null>(null)
+// não sobrescreve o que o usuário está digitando quando o poll traz a minuta
+watch(minuta, (m) => {
+    if (m && (!import.meta.client || document.activeElement !== nameInputRef.value))
+        editableName.value = m.name
+}, { immediate: true })
+
+async function saveName() {
+    const name = editableName.value.trim()
+    if (!minuta.value || !name || name === minuta.value.name) {
+        editableName.value = minuta.value?.name ?? ''
+        return
+    }
+    try {
+        minuta.value = await api.updateMinuta(props.minutaId, { name })
+    }
+    catch (err) {
+        editableName.value = minuta.value.name
+        emit('error', err instanceof Error ? err.message : 'Falha ao renomear a minuta')
+    }
+}
+
+let pollTimer: ReturnType<typeof setTimeout> | null = null
+let saveTimer: ReturnType<typeof setTimeout> | null = null
+
+async function loadMinuta() {
+    try {
+        const fetched = await api.fetchMinutaById(props.minutaId)
+        minuta.value = fetched
+        hydrateChrome(fetched.chrome)
+        if (fetched.status === 'PROCESSING')
+            schedulePoll()
+    }
+    catch (err) {
+        loadError.value = err instanceof Error ? err.message : 'Falha ao carregar a minuta'
+        emit('error', loadError.value)
+    }
+    finally {
+        isLoading.value = false
+    }
+}
+
+function schedulePoll() {
+    pollTimer = setTimeout(async () => {
+        try {
+            const fetched = await api.fetchMinutaById(props.minutaId)
+            minuta.value = fetched
+            if (fetched.status === 'PROCESSING')
+                schedulePoll()
+        }
+        catch {
+            schedulePoll()
+        }
+    }, 3000)
+}
+
+// só no cliente: `/api/minuta` é rota do próprio app (URL relativa), que não
+// resolve durante o SSR de um host que renderize no servidor
+onMounted(loadMinuta)
+
+onUnmounted(() => {
+    if (pollTimer)
+        clearTimeout(pollTimer)
+    if (saveTimer)
+        clearTimeout(saveTimer)
+    if (analysisPatchTimer)
+        clearTimeout(analysisPatchTimer)
+})
+
+// --- imagens do corpo no Vault: sobe no insert, re-resolve o src no load ---
+async function uploadEditorImage(file: File) {
+    const uploaded = await api.uploadMinutaFile(file)
+    if (!uploaded?.url)
+        return null
+    const src = await api.getDownloadUrl(uploaded.url)
+    return { src, vaultSrc: uploaded.url }
+}
+
+function refreshEditorVaultImages() {
+    const ed = editor.value
+    if (!ed || ed.isDestroyed)
+        return
+    void refreshVaultImages(ed, url => api.getDownloadUrl(url))
+}
+
+function onEditorReady(ed: Editor) {
+    editor.value = ed
+    emit('ready', ed)
+    void nextTick(refreshEditorVaultImages)
+}
+
+function onEditorChanged() {
+    if (!props.autoSave || versionPreview.value)
+        return
+    saveState.value = 'pending'
+    if (saveTimer)
+        clearTimeout(saveTimer)
+    saveTimer = setTimeout(() => void saveNow(), 2000)
+}
+
+async function saveNow(): Promise<boolean> {
+    const ed = editor.value
+    if (!ed || ed.isDestroyed || !minuta.value)
+        return false
+    if (versionPreview.value)
+        return true
+    if (saveTimer) {
+        clearTimeout(saveTimer)
+        saveTimer = null
+    }
+    saveState.value = 'saving'
+    try {
+        const updated = await api.updateMinuta(props.minutaId, { contentHtml: ed.getHTML() })
+        minuta.value = updated
+        saveState.value = 'saved'
+        emit('saved', updated)
+        return true
+    }
+    catch (err) {
+        console.error('[minuta-nuxt] erro ao salvar:', err)
+        saveState.value = 'error'
+        emit('error', 'Falha ao salvar a minuta')
+        return false
+    }
+}
+
+async function exportDocx() {
+    const ed = editor.value
+    if (!ed || ed.isDestroyed || isExporting.value || versionPreview.value)
+        return
+    isExporting.value = true
+    try {
+        await saveNow()
+        // a lib `docx` é o maior pedaço do bundle e só serve no clique:
+        // carregar sob demanda tira ~1 MB do abrir da minuta
+        const { pocExportDocx } = await import('../composables/docxExport')
+        const breaks = pocPageKey.getState(ed.state)?.breaks ?? []
+        const blob = await pocExportDocx(ed, props.margins, {
+            headerText: chromeText.header,
+            footerText: chromeText.footer,
+            headerScope: chromeText.headerScope,
+            footerScope: chromeText.footerScope,
+            headerLogoUrl: HEADER.logoUrl,
+            headerPosition: HEADER.position,
+            showPageNumber: chromeText.showPageNumber,
+        }, { breaks })
+
+        const url = URL.createObjectURL(blob)
+        const link = document.createElement('a')
+        link.href = url
+        link.download = `${(minuta.value?.name || 'minuta').trim()}.docx`
+        link.click()
+        URL.revokeObjectURL(url)
+    }
+    catch (err) {
+        console.error('[minuta-nuxt] erro ao exportar:', err)
+        emit('error', 'Falha ao exportar o DOCX')
+    }
+    finally {
+        isExporting.value = false
+    }
+}
+
+// ==========================================
+// Histórico (preview + diff + restore — mesmo fluxo do defesa.ai)
+// ==========================================
+
+const historyOpen = ref(false)
+const versions = ref<MinutaVersion[]>([])
+const loadingVersions = ref(false)
+const savingCheckpoint = ref(false)
+const restoring = ref(false)
+const previewLoading = ref(false)
+// preview/volta de versão trocam o doc inteiro — re-resolve os src das imagens
+watch(versionPreview, () => void nextTick(refreshEditorVaultImages))
+const compareMode = ref(false)
+const compareChangeCount = ref(0)
+const checkpointComment = ref('')
+let baselineHtml: string | null = null
+
+const VERSION_TYPE_LABEL: Record<string, string> = {
+    initial: 'Original',
+    auto: 'Automática',
+    manual: 'Manual',
+}
+
+function formatVersionDate(iso: string): string {
+    try {
+        return new Date(iso).toLocaleString('pt-BR')
+    }
+    catch {
+        return iso
+    }
+}
+
+async function loadVersions() {
+    loadingVersions.value = true
+    try {
+        versions.value = await api.fetchVersions(props.minutaId)
+    }
+    catch {
+        emit('error', 'Falha ao carregar o histórico')
+    }
+    finally {
+        loadingVersions.value = false
+    }
+}
+
+function toggleHistory() {
+    if (historyOpen.value) {
+        closeHistory()
+        return
+    }
+    historyOpen.value = true
+    void loadVersions()
+}
+
+function closeHistory() {
+    historyOpen.value = false
+    exitPreview()
+}
+
+async function saveCheckpoint() {
+    if (savingCheckpoint.value)
+        return
+    savingCheckpoint.value = true
+    try {
+        if (!await saveNow())
+            return
+        await api.createVersion(props.minutaId, checkpointComment.value)
+        checkpointComment.value = ''
+        await loadVersions()
+    }
+    catch {
+        emit('error', 'Falha ao salvar a versão')
+    }
+    finally {
+        savingCheckpoint.value = false
+    }
+}
+
+async function enterPreview(versionNumber: number) {
+    const ed = editor.value
+    if (!ed || ed.isDestroyed || previewLoading.value)
+        return
+    if (versionPreview.value?.versionNumber === versionNumber)
+        return
+    previewLoading.value = true
+    try {
+        if (!versionPreview.value && !await saveNow())
+            return
+        if (compareMode.value) {
+            pocExitVersionDiff(ed)
+            compareMode.value = false
+        }
+        const full = await api.fetchVersion(props.minutaId, versionNumber)
+        // guard entra ANTES do setContent — o @changed da troca não salva
+        versionPreview.value = { versionNumber: full.versionNumber, createdAt: formatVersionDate(full.createdAt) }
+        ed.commands.setContent(full.contentHtml)
+    }
+    catch {
+        emit('error', 'Falha ao abrir esta versão')
+    }
+    finally {
+        previewLoading.value = false
+    }
+}
+
+function exitPreview() {
+    const ed = editor.value
+    if (!versionPreview.value)
+        return
+    if (ed && !ed.isDestroyed) {
+        pocExitVersionDiff(ed)
+        if (minuta.value?.contentHtml != null)
+            ed.commands.setContent(minuta.value.contentHtml)
+    }
+    compareMode.value = false
+    versionPreview.value = null
+}
+
+/** diff da versão em preview contra a v1 (o documento como o agente entregou) */
+async function toggleCompare() {
+    const ed = editor.value
+    if (!versionPreview.value || !ed || ed.isDestroyed)
+        return
+    if (compareMode.value) {
+        pocExitVersionDiff(ed)
+        compareMode.value = false
+        return
+    }
+    if (baselineHtml === null) {
+        try {
+            baselineHtml = (await api.fetchVersion(props.minutaId, 1)).contentHtml
+        }
+        catch {
+            emit('error', 'Falha ao carregar a versão original para comparar')
+            return
+        }
+    }
+    const { changeCount } = pocEnterVersionDiff(ed, baselineHtml)
+    compareChangeCount.value = changeCount
+    compareMode.value = true
+}
+
+async function restoreVersion(versionNumber: number) {
+    const ed = editor.value
+    if (restoring.value)
+        return
+    restoring.value = true
+    try {
+        const restored = await api.restoreVersion(props.minutaId, versionNumber)
+        minuta.value = restored
+        if (ed && !ed.isDestroyed) {
+            pocExitVersionDiff(ed)
+            ed.commands.setContent(restored.contentHtml || '<p></p>')
+        }
+        compareMode.value = false
+        versionPreview.value = null
+        saveState.value = 'saved'
+        await loadVersions()
+        void nextTick(refreshEditorVaultImages)
+    }
+    catch {
+        emit('error', 'Falha ao restaurar a versão')
+    }
+    finally {
+        restoring.value = false
+    }
+}
+
+// ==========================================
+// Edição de cabeçalho/rodapé (canvas estilo Word, salva na minuta)
+// ==========================================
+
+const chromeEditor = ref<{ part: 'header' | 'footer' } | null>(null)
+
+function onEditChrome(event: Event) {
+    const { part } = (event as CustomEvent).detail || {}
+    if (part !== 'header' && part !== 'footer')
+        return
+    if (versionPreview.value)
+        return
+    chromeEditor.value = { part }
+}
+
+async function applyChrome({ html, scope, showPageNumber }: { html: string, scope: 'all' | 'first', showPageNumber?: boolean }) {
+    if (!chromeEditor.value)
+        return
+    const part = chromeEditor.value.part
+    chromeText[part] = html
+    chromeText[part === 'header' ? 'headerScope' : 'footerScope'] = scope
+    if (showPageNumber !== undefined)
+        chromeText.showPageNumber = showPageNumber
+    chromeEditor.value = null
+    try {
+        minuta.value = await api.updateMinuta(props.minutaId, { chrome: { ...chromeText } })
+    }
+    catch {
+        emit('error', 'Falha ao salvar o cabeçalho/rodapé')
+    }
+}
+
+onMounted(() => window.addEventListener('poc:edit-chrome', onEditChrome))
+onUnmounted(() => window.removeEventListener('poc:edit-chrome', onEditChrome))
+
+// ==========================================
+// Assistente de chat (agente Tela edita a peça via blocos minuta-edit)
+// ==========================================
+
+/** componente do chat-nuxt — presente só quando o host registra o módulo */
+const resolvedChatEmbed = resolveComponent('MeistrariChatEmbed')
+const chatEmbedComponent = typeof resolvedChatEmbed === 'string' ? null : markRaw(resolvedChatEmbed as object)
+const chatComponents = { 'minuta-edit': markRaw(MinutaChatEditCard) }
+
+function htmlToPlainText(html: string): string {
+    const el = document.createElement('div')
+    el.innerHTML = html
+    return el.textContent ?? ''
+}
+
+/** inputs reenviados a cada mensagem: documento atual + análise + nome */
+const chatInputs = computed(() => {
+    const current = minuta.value
+    if (!current)
+        return []
+    // contentHtml muda a cada save → recomputa com o texto vivo do editor
+    void current.contentHtml
+    const documento = editor.value && !editor.value.isDestroyed
+        ? editor.value.getText({ blockSeparator: '\n\n' })
+        : htmlToPlainText(current.contentHtml || '')
+    return [
+        { type: 'text' as const, name: 'documento', content: documento },
+        { type: 'text' as const, name: 'analise', content: JSON.stringify(current.analysis ?? {}) },
+        { type: 'text' as const, name: 'minuta_nome', content: current.name },
+    ]
+})
+
+/** card "Aplicar" do chat → ops no editor + anotações novas na análise */
+async function onChatEditEvent(event: Event) {
+    const detail = (event as CustomEvent).detail as { edit: MinutaChatEdit, onResult?: (result: ApplyChatEditResult) => void } | undefined
+    if (!detail?.edit)
+        return
+    const ed = editor.value
+    if (!ed || ed.isDestroyed || !minuta.value) {
+        detail.onResult?.({ applied: 0, failures: ['Editor indisponível'] })
+        return
+    }
+    if (versionPreview.value) {
+        detail.onResult?.({ applied: 0, failures: ['Volte para a versão atual antes de aplicar edições'] })
+        return
+    }
+
+    const result = applyChatEditOps(ed, detail.edit.ops ?? [])
+    if (result.applied > 0)
+        await saveNow()
+
+    if (detail.edit.anotacoes?.length) {
+        try {
+            const merged = mergeChatAnnotations(minuta.value.analysis, detail.edit.anotacoes)
+            minuta.value = await api.updateMinuta(props.minutaId, { analysis: merged })
+        }
+        catch {
+            result.failures.push('Falha ao salvar as anotações novas')
+        }
+    }
+    detail.onResult?.(result)
+}
+
+onMounted(() => window.addEventListener('minuta-nuxt:chat-edit', onChatEditEvent))
+onUnmounted(() => window.removeEventListener('minuta-nuxt:chat-edit', onChatEditEvent))
+
+// ==========================================
+// Análise da peça (comentários de margem, sempre visíveis)
+// ==========================================
+
+const editorCompRef = ref<any>(null)
+const docPreviewOpen = ref(false)
+const docPreviewUrl = ref<string | null>(null)
+const docPreviewPage = ref<number | null>(null)
+
+function openDocPreview(url?: string | null) {
+    if (!minuta.value?.files.length)
+        return
+    docPreviewUrl.value = url ?? minuta.value.files[0].url
+    docPreviewOpen.value = true
+}
+
+// --- persistência do estado de âncora (anotações editadas + texto adicionado) ---
+function onAnalysisUpdate(analysis: MinutaAnalysis) {
+    // durante preview de versão o documento não é o atual — não persiste nada
+    if (versionPreview.value || !minuta.value)
+        return
+    // otimista (evita re-emissão do gutter); PATCH debounced
+    minuta.value = { ...minuta.value, analysis }
+    if (analysisPatchTimer)
+        clearTimeout(analysisPatchTimer)
+    analysisPatchTimer = setTimeout(async () => {
+        try {
+            await api.updateMinuta(props.minutaId, { analysis })
+        }
+        catch (err) {
+            console.error('[minuta-nuxt] falha ao persistir estado das anotações:', err)
+        }
+    }, 800)
+}
+
+/** card de fato extraído → abre o documento-fonte no visualizador */
+function onOpenDocument(payload: { documento: string, pagina?: number, highlight?: string }) {
+    const file = minuta.value?.files.find(f => f.name === payload.documento)
+        ?? minuta.value?.files.find(f => f.name.includes(payload.documento) || payload.documento.includes(f.name))
+    docPreviewPage.value = payload.pagina ?? null
+    openDocPreview(file?.url)
+}
+
+const hasAnalysis = computed(() => {
+    const analysis = minuta.value?.analysis
+    if (!analysis)
+        return false
+    return Boolean(analysis.resumo || analysis.teses?.length || analysis.jurisprudencias?.length
+        || analysis.citacoes?.length || analysis.documentos?.length || analysis.fatos?.length)
+})
+
+const SAVE_LABEL: Record<'idle' | 'pending' | 'saving' | 'saved' | 'error', string> = {
+    idle: '',
+    pending: 'Alterações pendentes…',
+    saving: 'Salvando…',
+    saved: 'Salvo',
+    error: 'Erro ao salvar',
+}
+
+defineExpose({ saveNow, exportDocx, editor })
+</script>
+
+<template>
+    <div class="minuta-embed">
+        <div v-if="showToolbar && minuta" class="minuta-embed__toolbar">
+            <slot name="toolbar-start" />
+            <input
+                v-if="canRename"
+                ref="nameInputRef"
+                v-model="editableName"
+                class="minuta-embed__name minuta-embed__name--input"
+                :disabled="minuta.status !== 'READY'"
+                @blur="saveName"
+                @keydown.enter="($event.target as HTMLInputElement).blur()"
+            >
+            <span v-else class="minuta-embed__name">{{ minuta.name }}</span>
+            <span class="minuta-embed__save-state">{{ SAVE_LABEL[saveState] }}</span>
+            <button
+                v-if="minuta.status === 'READY' && minuta.files.length"
+                class="minuta-embed__ghost-btn"
+                type="button"
+                @click="openDocPreview()"
+            >
+                Documentos
+            </button>
+            <button
+                v-if="minuta.status === 'READY'"
+                class="minuta-embed__ghost-btn"
+                :class="{ 'minuta-embed__ghost-btn--on': historyOpen }"
+                type="button"
+                @click="toggleHistory"
+            >
+                Histórico
+            </button>
+            <button
+                v-if="minuta.status === 'READY'"
+                class="minuta-embed__export"
+                :disabled="isExporting || !!versionPreview"
+                type="button"
+                @click="exportDocx"
+            >
+                {{ isExporting ? 'Exportando…' : 'Baixar DOCX' }}
+            </button>
+        </div>
+
+        <div v-if="isLoading" class="minuta-embed__status">
+            Carregando…
+        </div>
+
+        <div v-else-if="loadError" class="minuta-embed__status minuta-embed__status--error">
+            {{ loadError }}
+        </div>
+
+        <div v-else-if="minuta?.status === 'PROCESSING'" class="minuta-embed__status">
+            Gerando a minuta… O agente está lendo os documentos e montando o texto.
+        </div>
+
+        <div v-else-if="minuta?.status === 'ERROR'" class="minuta-embed__status minuta-embed__status--error">
+            A geração falhou: {{ minuta.error || 'erro desconhecido' }}
+        </div>
+
+        <div v-else-if="minuta" class="minuta-embed__body">
+            <div class="minuta-embed__document">
+                <MinutaDocxEditor
+                    ref="editorCompRef"
+                    :initial-html="minuta.contentHtml || '<p></p>'"
+                    :margins="props.margins"
+                    :header="HEADER"
+                    :editable="props.editable && !versionPreview"
+                    :show-block-origin="false"
+                    :upload-image="uploadEditorImage"
+                    :chrome-text="chromeText"
+                    @ready="onEditorReady"
+                    @changed="onEditorChanged"
+                >
+                    <template #gutter>
+                        <MinutaAnnotationsGutter
+                            v-if="hasAnalysis && minuta.analysis"
+                            :editor="editor"
+                            :analysis="minuta.analysis"
+                            :scroll-container="editorCompRef?.containerRef ?? null"
+                            @open-document="onOpenDocument"
+                            @update-analysis="onAnalysisUpdate"
+                        />
+                    </template>
+                </MinutaDocxEditor>
+
+                <!-- edição de cabeçalho/rodapé (canvas estilo Word) -->
+                <div v-if="chromeEditor" class="minuta-embed__chrome-overlay">
+                    <MinutaChromeEditor
+                        :key="chromeEditor.part"
+                        :part="chromeEditor.part"
+                        :html="chromeText[chromeEditor.part]"
+                        :scope="chromeText[chromeEditor.part === 'header' ? 'headerScope' : 'footerScope']"
+                        :band-height-px="chromeEditor.part === 'header' ? props.margins.top : props.margins.bottom"
+                        :show-page-number="chromeText.showPageNumber"
+                        :allow-page-number-toggle="true"
+                        @apply="applyChrome"
+                        @close="chromeEditor = null"
+                    />
+                </div>
+
+                <!-- banner do preview de versão -->
+                <div v-if="versionPreview" class="minuta-embed__banner">
+                    <span class="minuta-embed__banner-text">
+                        <template v-if="compareMode">
+                            Mudanças da versão {{ versionPreview.versionNumber }} em relação à original —
+                            {{ compareChangeCount }} {{ compareChangeCount === 1 ? 'trecho alterado' : 'trechos alterados' }}
+                        </template>
+                        <template v-else>
+                            Visualizando a versão {{ versionPreview.versionNumber }}
+                            de {{ versionPreview.createdAt }} — somente leitura
+                        </template>
+                    </span>
+                    <span class="minuta-embed__banner-actions">
+                        <button v-if="versionPreview.versionNumber !== 1" type="button" @click="toggleCompare">
+                            {{ compareMode ? 'Ocultar mudanças' : 'Ver mudanças' }}
+                        </button>
+                        <button type="button" :disabled="restoring" @click="restoreVersion(versionPreview.versionNumber)">
+                            Restaurar
+                        </button>
+                        <button type="button" @click="exitPreview">
+                            Voltar para a atual
+                        </button>
+                    </span>
+                </div>
+            </div>
+
+            <!-- painel: histórico -->
+            <aside v-if="historyOpen" class="minuta-embed__panel">
+                <div class="minuta-embed__panel-head">
+                    <span>Histórico de versões</span>
+                    <button type="button" @click="closeHistory">
+                        ×
+                    </button>
+                </div>
+                <div class="minuta-embed__checkpoint">
+                    <input
+                        v-model="checkpointComment"
+                        placeholder="Comentário (opcional)"
+                        :disabled="savingCheckpoint"
+                        @keydown.enter="saveCheckpoint"
+                    >
+                    <button type="button" :disabled="savingCheckpoint" @click="saveCheckpoint">
+                        {{ savingCheckpoint ? 'Salvando…' : 'Salvar versão' }}
+                    </button>
+                </div>
+                <div class="minuta-embed__versions">
+                    <p v-if="!versions.length && !loadingVersions" class="minuta-embed__versions-empty">
+                        Nenhuma versão ainda — salve uma com o botão acima. Versões
+                        automáticas são criadas conforme você edita.
+                    </p>
+                    <button
+                        v-for="version in versions"
+                        :key="version.id"
+                        class="minuta-embed__version"
+                        :class="{ 'minuta-embed__version--active': versionPreview?.versionNumber === version.versionNumber }"
+                        :disabled="previewLoading"
+                        type="button"
+                        @click="enterPreview(version.versionNumber)"
+                    >
+                        <span class="minuta-embed__version-row">
+                            <strong>v{{ version.versionNumber }}</strong>
+                            <em class="minuta-embed__version-type" :data-type="version.versionType">
+                                {{ VERSION_TYPE_LABEL[version.versionType] ?? version.versionType }}
+                            </em>
+                            <span class="minuta-embed__version-date">{{ formatVersionDate(version.createdAt) }}</span>
+                        </span>
+                        <span v-if="version.comment" class="minuta-embed__version-comment">{{ version.comment }}</span>
+                        <span v-if="version.createdByEmail" class="minuta-embed__version-author">{{ version.createdByEmail }}</span>
+                    </button>
+                </div>
+            </aside>
+
+            <!-- assistente: launcher flutuante nativo do chat-nuxt (bolinha → janela
+                 ancorada). Renderizado por ÚLTIMO: o wrapper fixed do launcher tem
+                 z-index auto e ficaria atrás do editor se viesse antes no DOM. -->
+            <component
+                :is="chatEmbedComponent"
+                v-if="chatAgentId && chatEmbedComponent && minuta.status === 'READY'"
+                variant="floating"
+                launcher-label="Assistente"
+                :tela-agent-id="chatAgentId"
+                :tela-agent-inputs="chatInputs"
+                :conversation-scope="`minuta:${props.minutaId}`"
+                :custom-html-tags="['minuta-edit']"
+                :custom-components="chatComponents"
+                :features="{ showCancelButton: true }"
+            />
+
+            <!-- visualizador de documentos (overlay) -->
+            <MinutaDocumentViewer
+                v-if="docPreviewOpen"
+                :files="minuta.files"
+                :initial-url="docPreviewUrl"
+                :initial-page="docPreviewPage"
+                @close="docPreviewOpen = false"
+                @error="msg => emit('error', msg)"
+            />
+        </div>
+    </div>
+</template>
+
+<style scoped>
+.minuta-embed{background:#f7f7f8;display:flex;flex-direction:column;height:100%}.minuta-embed__toolbar{align-items:center;background:#fff;border-bottom:1px solid #e5e7eb;display:flex;gap:8px;padding:8px 16px}.minuta-embed__name--input{background:transparent;border:0;font-family:inherit;outline:none}.minuta-embed__name--input:focus{text-decoration:underline}.minuta-embed__name{color:#111827;flex:1;font-size:15px;font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.minuta-embed__save-state{color:#9ca3af;font-size:12px;margin-right:4px}.minuta-embed__ghost-btn{background:#fff;border:1px solid #e5e7eb;border-radius:6px;color:#374151;cursor:pointer;font-size:13px;padding:6px 12px}.minuta-embed__ghost-btn--on{background:#f3f4f6}.minuta-embed__export{background:#111827;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:13px;padding:6px 12px}.minuta-embed__export:disabled{cursor:default;opacity:.6}.minuta-embed__chrome-overlay{bottom:16px;position:absolute;right:16px;z-index:30}.minuta-embed__status{color:#6b7280;font-size:14px;padding:48px 24px;text-align:center}.minuta-embed__status--error{color:#b91c1c}.minuta-embed__body,.minuta-embed__document{display:flex;flex:1;min-height:0}.minuta-embed__document{min-width:0;position:relative}.minuta-embed__banner{align-items:center;background:#fffbeb;border:1px solid #fcd34d;border-radius:16px;bottom:16px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);display:flex;flex-wrap:wrap;gap:8px 12px;justify-content:center;left:50%;max-width:calc(100% - 32px);padding:8px 16px;position:absolute;transform:translateX(-50%);width:-moz-max-content;width:max-content;z-index:30}.minuta-embed__banner-text{color:#92400e;font-size:12px;font-weight:500}.minuta-embed__banner-actions{display:flex;gap:8px}.minuta-embed__banner-actions button{background:#fff;border:1px solid #fcd34d;border-radius:6px;color:#92400e;cursor:pointer;font-size:12px;padding:4px 10px;white-space:nowrap}.minuta-embed__banner-actions button:disabled{cursor:default;opacity:.6}.minuta-embed__panel{background:#fff;border-left:1px solid #e5e7eb;display:flex;flex-direction:column;width:320px}.minuta-embed__panel-head{align-items:center;border-bottom:1px solid #e5e7eb;color:#111827;display:flex;font-size:14px;font-weight:600;justify-content:space-between;padding:10px 16px}.minuta-embed__panel-head button{background:none;border:none;color:#6b7280;cursor:pointer;font-size:18px;line-height:1}.minuta-embed__checkpoint{border-bottom:1px solid #e5e7eb;display:flex;flex-direction:column;gap:8px;padding:12px}.minuta-embed__checkpoint input{border:1px solid #e5e7eb;border-radius:6px;font-size:13px;padding:6px 10px}.minuta-embed__checkpoint button{background:#fff;border:1px solid #e5e7eb;border-radius:6px;cursor:pointer;font-size:13px;padding:6px 12px}.minuta-embed__versions{flex:1;min-height:0;overflow-y:auto;padding:8px}.minuta-embed__versions-empty{color:#6b7280;font-size:12px;margin:0;padding:8px 12px}.minuta-embed__version{background:#fff;border:1px solid #e5e7eb;border-radius:10px;cursor:pointer;display:block;margin-bottom:6px;padding:10px;text-align:left;width:100%}.minuta-embed__version:hover{background:#faf5ff;border-color:#c4b5fd}.minuta-embed__version--active{background:#f5f3ff;border-color:#a78bfa}.minuta-embed__version:disabled{cursor:wait;opacity:.7}.minuta-embed__version-row{align-items:center;color:#111827;display:flex;font-size:12px;gap:6px}.minuta-embed__version-type{background:#f3f4f6;border-radius:999px;color:#4b5563;font-size:11px;font-style:normal;padding:1px 8px}.minuta-embed__version-type[data-type=auto]{background:#f5f3ff;color:#6d28d9}.minuta-embed__version-type[data-type=manual]{background:#eff6ff;color:#1d4ed8}.minuta-embed__version-date{color:#9ca3af;font-size:11px;margin-left:auto}.minuta-embed__version-comment{color:#111827;display:block;font-size:12px;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.minuta-embed__version-author{color:#9ca3af;display:block;font-size:11px;margin-top:2px}
+</style>