DynamicCard
- Angular:
mds-dynamic-card - CSS/HTML (mds-styles): disponível
- Figma: ❌
- Tipo: Componente Angular
Definição Funcional
Seção intitulada “Definição Funcional”O DynamicCard é um contêiner modular projetado para exibir registros de forma estruturada. Ele mantém uma anatomia fixa que organiza a informação por prioridade, permitindo que os campos internos sejam personalizados sem quebrar a consistência visual da interface. )
Anatomia Padronizada (Hierarquia de Leitura)
Seção intitulada “Anatomia Padronizada (Hierarquia de Leitura)”A estrutura do card é dividida em blocos de importância decrescente:
- Tags de Apoio (Cabeçalho): Localizadas no topo, servem para categorização rápida (ex: Tipo de frete, Origem do cadastro). Use etiquetas curtas.
- Identificação Principal (Título): O dado mestre do card (ex: Código Identificador). Deve estar em Caixa de Título, negrito e maior destaque visual.
- Informações Primárias: Dados essenciais que nunca mudam de posição, garantindo a ancoragem visual (ex: Rota/Origem-Destino).
- Informações Secundárias de Apoio: Campos dinâmicos mapeados conforme a necessidade da etapa. Podem ser ocultados para reduzir a densidade visual.
- Mensagens de Alerta: Espaço reservado para notificações críticas de sistema que exigem atenção imediata.
- Totalizadores e Ações (Rodapé): Agrupa indicadores numéricos (anexos, mensagens), o usuário responsável e o menu de opções (Popover).