Oi, Carlos, tudo bem?
De fato, os nomes utilizados nas transições, como void => shown
e shown => void
, não são arbitrários, mas sim representações diretas das mudanças de estado que você deseja capturar e animar na sua aplicação.
No exemplo que você mencionou, void
é um estado especial usado em animações Angular para indicar um estado onde o elemento não está anexado ao DOM. O shown
, por outro lado, seria um estado definido por você para indicar que o elemento está visível. A transição void => shown
significa que você está animando o elemento de um estado não presente (ou invisível) para um estado visível. O inverso, shown => void
, anima o elemento na direção oposta, ou seja, de visível para não visível.
Espero ter ajudado. Caso tenha dúvidas, conte com o fórum. Abraços!
Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!