Editor Visual

O editor de workflow é a página em que você passa mais tempo todos os dias.

Layout geral

O editor tem um layout típico de três colunas:

• Barra de ferramentas superior — Operações principais, como salvar/verificar/executar/importar/exportar/histórico de versões, etc.
• tela da coluna esquerda — Visualização DAG, com nós de arrastar e soltar, conexões, zoom e minimapas
• Coluna direita YAML — O Monaco Editor edita diretamente fontes YAML com destaque de sintaxe/preenchimento automático/prompts de erro
• barra de status inferior — Salvar estado, editar titular do bloqueio, posição do cursor do colaborador, hora da última verificação
• Gaveta direita — Assistente de IA, painel de breakpoint, snapshot variável (aberto sob demanda)

Canvas vs YAML: sincronização bidirecional em nível de byte

Esta é a diferença mais óbvia entre Braidrun e outras marcas.

• Você altera uma linha no YAML e o nó correspondente na tela é atualizado instantaneamente;
• Você arrasta uma linha de conexão na tela e o campo depende_on correspondente em YAML aparece simultaneamente;
• Comentários/linhas em branco/ordem de campos não são perdidos - o YAML exportado é exatamente o mesmo que você vê no editor.

Barra de ferramentas superior

Gravar

Por padrão, ele será salvo automaticamente uma vez após você parar de digitar por 5 segundos; instantâneo da versão(Não é uma substituição simples).

Desfazer/refazer

A barra de ferramentas tem botões Desfazer e Refazer, com atalhos Ctrl / Cmd + Z e Ctrl / Cmd + Shift + Z. Esta é uma pilha de histórico de nível de editor: arrastar canvas, editar YAML, e cada passo que o assistente de IA constrói tudo vai para o mesmo histórico — então "a IA estragou um passo" é tão fácil de desfazer. A digitação contínua coalesces em um registro, e timestamps escritos de volta pelo autosave não criam histórico extra; até os 50 instantâneos mais recentes são mantidos, e mudar para outro workflow redefine o histórico.

Verificar

Chame o analisador de plataforma para fazer uma viagem de ida e volta:

1. YAML → objeto WorkflowDefinition (camada de sintaxe)
2. WorkflowDefinition → Verificação semântica (se a referência da variável pode ser analisada, se a predefinição pode ser encontrada, se há loops nas dependências)
3. WorkflowDefinition → ida e volta YAML (um erro será relatado se houver algum desvio)

Erros são marcados com um rabisco vermelho no nível da linha YAML; clique em um para saltar para a linha. Resultados de validação profunda também são fundidos no painel de diagnósticos descrito abaixo. Limpe tudo antes de salvar e ir ao vivo.

Executar

Clicar neste botão abrirá uma caixa de diálogo, permitindo:

• Preencha as variáveis do workflow (os valores padrão serão pré-preenchidos)
• Verificar/Cancelar dry-run (marcado por padrão - altamente recomendado para primeira execução)
• Selecione a fonte do acionador (simulação manual/programada)

Após clicar em “Iniciar Execução”, o editor abrirá automaticamente uma gaveta à direita para exibir o fluxo de eventos em tempo real, e ao mesmo tempo abrirá os detalhes da execução na aba atual.

Importar/Exportar

• Importar YAML - Carrega YAML do arquivo/pastaboard/uma URL sobrescrevendo o conteúdo atual.
• Exportar YAML – Baixe o YAML atual para um arquivo local.
• Importe formatos externos como Dify/Langflow - Pro ou pacote superior necessário, a plataforma converte automaticamente para Braidrun YAML.

Histórico da versão

Cada salvamento cria um instantâneo e retém 100 versões por padrão (sem limite para Enterprise).

• Liste todos os instantâneos (incluindo tempo, economia, número de linhas alteradas)
• Compare com a diferença da versão atual
• Reverter para qualquer versão histórica (a reversão criará um novo instantâneo e não substituirá realmente o histórico)

Promote to module / Demote from module

Selecione várias etapas consecutivas na tela e clique em "Promover para módulo" para extrair essas etapas em um módulo sub_workflow independente, e a posição original se torna uma chamada de módulo. Modularização e reutilização.

Operações de tela da coluna esquerda

Adicionar novo nó

• O botão “+” no canto inferior esquerdo abre o seletor de tipo de etapa e seleciona um modo principal.
• Ele também pode ser adicionado arrastando o "fragmento do modelo de etapa" da coluna direita para a tela.

Ligações

Arraste o terminal de saída de um nó para o terminal de entrada de outro nó para adicionar automaticamente o relacionamento depende_on no YAML.

Menu de clique com o botão direito do mouse

• Editar – Abra o snippet YAML desta etapa para edição parcial.
• Copiar - clona uma cópia da etapa atual (o id é automaticamente sufixado).
• Excluir - um aviso será dado se houver referências posteriores durante a exclusão.
• Definir como início/fim - Marca a entrada/saída explícita do workflow (obrigatório apenas para state_machine).

Zoom e minimapa

Há um minimapa no canto inferior direito, que permite pular rapidamente quando um workflow complexo excede o tamanho da tela.

Coluna direita YAML

Preenchimento automático

Com base no esquema JSON, nomes de campos comuns, nomes predefinidos e IDs de etapas existentes podem ser concluídos.

Dobrar / Desdobrar

Clique na seta ao lado do número da linha à esquerda para recolher toda a etapa.

Pesquisar e substituir

Ctrl / Cmd + F Pesquisa, Ctrl / Cmd + H Substituir.

Painel de diagnósticos e problemas

O editor tem duas camadas de linting que compartilham um conjunto de códigos de regras:

• Diagnóstico instantâneo do lado do cliente — Recomputado localmente após cada edição (regras estruturais como ciclos de dependência, referências penduradas e sugestões para IDs de passos quase errados), dirigindo o painel de problemas, crachás de nó e crachá de barra de ferramentas com latência zero.
• Validação profunda do lado do servidor — Chamado quando você clica em "Validate" na barra de ferramentas POST /api/workflows/lint, retornando todos os problemas de uma vez (a validação de tempo de salvação para no primeiro erro; linting não) e adicionando regras que precisam de dados do lado do servidor, como predefinições de agente e contratos de módulo.

O crachá da barra de ferramentas mostra a contagem de erros / avisos em tempo real (vermelho quando existem erros, amarelo quando apenas avisos); clicando nele executa uma validação profunda e abre o painel de problemas. Cada problema carrega um chip de localização de passos (clique para saltar para o nó) e uma correção sugerida; você também pode "Fix with AI" para um único problema ou todos eles — o editor monta os problemas em um prompt estruturado e envia para o assistente de IA.

Gaveta direita

AI Assistente

Clique no ícone “AI Assistant” no meio da coluna direita para expandir.

• Use linguagem natural para descrever uma parte da lógica a ser alterada e o assistente fornecerá uma visualização da diferença;
• Comandos Slash: /execute, /validate, /export, /new, /undo, /help;
• /undo reverte as alterações do assistente (até 10 passos); o próprio editor Ctrl / Cmd + Z também pode desfazer as alterações da IA uma de cada vez.

Veja recursos completos Orquestrar usando assistentes de IA.

Painel de pontos de interrupção

Este painel acende quando a execução está em modo de depuração. Depuração de pontos de paragem.

Instantâneo variável

Quando você clica em uma etapa, todas as variáveis disponíveis antes da etapa ser executada - incluindo var:* / steps.*.data / classifier.* / credenciais.* (os valores das credenciais serão exibidos insensíveis).

Bloqueio de edição colaborativa

Apenas uma pessoa pode editar o mesmo workflow por vez – quem entrar primeiro ganha o bloqueio.

Teclas de atalho comumente usadas

Alguns dos mais usados no editor – veja a lista completa Atalhos do Teclado.

• Ctrl / Cmd + S — Gravar
• Ctrl / Cmd + E — Executar (abrir caixa de diálogo)
• Ctrl / Cmd + Shift + V — Verificar
• Ctrl / Cmd + Z — Desfazer (aplicável ao editor YAML + assistente de IA)
• Ctrl / Cmd + Shift + Z — Refazer
• Alt + A — Trocar gaveta do assistente de IA
• Alt + B — Painel de ponto de interrupção do switch

Próximo passo

• 8 Tipos de passos — A referência oficial sobre como escrever cada etapa
• Referência de sintaxe YAML — Uma referência de campo mais aprofundada
• Assistente de IA — Use linguagem natural para alterar o workflow