Remover
Remover desassocia; excluir deleta. Como diferenciar as duas ações no visual, no labeling e no feedback ao usuário.
Boas Práticas
Use Remover para desassociar um item de uma coleção ou documento — sem deletar o registro do sistema. A distinção com Excluir é crítica: remover preserva o original, excluir o destrói. Use o verbo correto para cada semântica e nunca intercambie os dois.
Contextos
Remover é sempre contextual ao item na lista ou seção — nunca uma ação global da página. Sua posição varia conforme o container onde o item está associado.
O X remove a associação imediatamente. O toast com 'Desfazer' aparece globalmente — nunca como alert inline no card.
Ícone i-lucide-circle-minus ou i-lucide-x na linha. Para itens de pedido, carrinho, seção de documento.
Em documentos ME (Cotações, Pedidos), o chassi tem seções fixas. O padrão Remover aplica-se a linhas dentro dessas seções — como itens de uma cotação. O ícone circle-minus ao final de cada linha remove o item imediatamente; Toast com Desfazer fica disponível.
Remoção em massa. Quando o usuário seleciona vários itens de uma lista ou index, quem assume a remoção é a barra de Ações em massa: o rótulo carrega a contagem (“Remover 5 itens”, nunca “Remover seleção”) — a pessoa enxerga exatamente o que está prestes a tirar antes de confirmar. O feedback segue a mesma régua de impacto: Toast com Desfazer para uma saída segura, sem modal. Ver Padrões › Ações em massa.
Hierarquia
1 — Remover em seções de documentos
Uso
- Desassociar fornecedor de uma cotação, remover item de um pedido
Trigger
- Ícone i-lucide-circle-minus ao final da linha ou ação no menu de mais ações contextual
Heurísticas aplicadas
- Correspondência com o mundo real — "Remover" = tirar de uma lista, não destruir o registro
- Prevenção de erros — diferencia claramente de "Excluir"; sem modal para remoções simples
- Visibilidade do status do sistema — remoção visual imediata com feedback Toast
- Controle e liberdade — ação deve ser desfazível quando possível (Toast com "Desfazer")
Confirmação e feedback
- Não exige confirmação quando a remoção é fácil de refazer
- Exige confirmação quando a remoção tem impacto no fluxo (ex: remover único fornecedor de cotação aprovada)
- Toast "Fornecedor removido." com "Desfazer" por 5s quando aplicável
2 — Remover chip/tag/badge
Trigger
- Ícone × dentro do chip, à direita
- Ação imediata, sem confirmação
Heurísticas aplicadas
- Consistência — ícone × em chips/tags; "Remover" com ícone trash-2 em listas maiores
- Prevenção de erros — quando a remoção tem impacto significativo, exige confirmação
- Reconhecimento — rótulo explícito quando o impacto não é óbvio pelo ícone
Feedback
- Sem Toast para chips de filtro (UX mais leve)
- Toast simples para chips de dado (ex: remover tag de um produto)
3 — Remover item de carrinho/lista temporária
Trigger
- Ícone i-lucide-circle-minus ou label "Remover" ao lado do item
- Sem confirmação, imediato
Feedback
- Toast "Item removido do carrinho." com "Desfazer" por 5s
- Subtotal/contador atualizado imediatamente
Labeling
Em ações de Remover, o rótulo precisa deixar claro que a ação desassocia — sem destruir. O verbo "Remover" é exclusivo para desassociação; nunca o intercambie com "Excluir", "Deletar" ou "Apagar".
Verbos encontrados no produto — quando usar cada um
Desassocia do contexto. Registro original intacto.
DesassociaçãoMesmo significado que Excluir — informal e fora do padrão do produto.
Prefira RemoverAmbíguo — comunica destruição, não desassociação. Gera ansiedade sem necessidade.
Prefira RemoverRemove permanentemente — nunca use para desassociação.
Padrão distintoDesassociar item de uma coleção; registro original permanece
Seções de documentos, abas de composição, listas de associação
Deletar permanentemente o registro do sistema
Índex de cadastros, listas de configuração
Fórmula: verbo de ação + objeto que será desassociado
- Use"Remover" para desassociação e "Excluir" para deleção permanente — nunca intercambie os dois.
- Em chips (filtros e vínculos), oícone × é suficiente sem label texto — contexto visual é claro.
- "Desfazer" no Toast de remoção oferece safety net sem exigir confirmação prévia para ações de baixo risco.
- Não use"Excluir" para desassociação — gera ansiedade desnecessária; o usuário pensa que o registro será deletado.
- Não exijaconfirmação prévia para remover de chips/tags — ação de baixo risco; use Desfazer se necessário.
- Não use"Deletar" ou "Apagar" para remoção de associação — são verbos de deleção permanente no ME.
Exemplos de uso
A ação de Remover deve ser clara, contextual e proporcional ao impacto. O verbo correto e o feedback adequado garantem que o usuário entenda que o registro original não foi destruído.
Chip com X para remover vínculo — sem modal de confirmação
Remover um fornecedor de uma cotação é reversível (o fornecedor ainda existe no sistema). O X no chip executa a remoção imediatamente, com Toast "Fornecedor removido. Desfazer →" por 5 segundos.
Modal de confirmação para remoção de vínculo reversível
"Deseja remover ME Supply da cotação?" com botão de confirmação é desnecessário para ações que têm Desfazer disponível. O modal é reservado para exclusões permanentes.
"Remover" como rótulo — nunca "Deletar", "Apagar" ou "Excluir" para vínculos
Remover fornecedor de uma cotação, remover item de um pedido, remover tag de um produto — sempre "Remover". "Excluir" implica destruição permanente do registro, o que não ocorre aqui.
Usar "Excluir" para remoção de vínculo ou associação
"Excluir fornecedor" da cotação sugere que o cadastro do fornecedor será apagado do sistema — o que não é a intenção. A confusão de rótulo gera medo e abandono da ação.
Ícone i-lucide-circle-minus em linhas de tabela para remover itens
Em tabelas de itens (pedido, cotação, requisição), o ícone de remover fica na última coluna. É sempre visível — não exige hover — e claro sobre seu propósito.
Ícone de lixeira (trash) para remover itens de lista
i-lucide-trash no contexto de lista de itens sugere exclusão permanente do registro. Use i-lucide-circle-minus ou i-lucide-x para comunicar remoção/desassociação sem destruição.
Feedback para Remover
Remover tem dois níveis de impacto. Remoções simples (chips, filtros) precisam apenas de feedback visual imediato; remoções de maior impacto merecem Toast com Desfazer. Nunca Alert — remoção não é ação irreversível de alto risco.
Use em filtros da filter bar — a remoção visual imediata dispensa Toast.
Chips de filtro são efêmeros e de baixo risco — o desaparecimento do filtro é o próprio feedback. Chips de dado (vínculos, tags) usam Toast com Desfazer.
Use em associações de documentos — o Toast com Desfazer oferece uma saída segura sem modal de confirmação.
Ex: "Fornecedor removido. Desfazer"
Fornecedor removido.
DesfazerUse em carrinho e listas — o Toast confirma a remoção enquanto o subtotal atualiza automaticamente.
Ex: "Item removido do carrinho."
Item removido do carrinho.