feat(loading-overlay): novo componente interno e implementações do AnimaliaDS

[felipepetuco]

overlay
loading overlay
DTHFUI-7502

---

PR Checklist [Revisor]

• Padrão de Commit (Coeso, de acordo com o que está sendo realizado)
• Código (Boas práticas, nome de variavéis/métodos, etc.)
• Testes unitários (Cobre a situação implementada e coverage está mantido)
• Documentação (Clara, objetiva e com exemplos caso necessário)
• Samples (A implementação possui exemplo no Labs/Caso de uso)
• Rodado em navegadores suportados (Chrome, FireFox, Edge)

Qual o comportamento atual?
Componente Loading Overlay traz na sua composição, uma camada pai fazendo o papel de overlay com fundo composto por rgb e alpha, e uma camada filho que carrega o po-loading, que é a caixa mais clara exibindo conteúdo. Por conta das definições do AnimaliaDS, a forma como está estruturado não atende as especificações de tokens.

Qual o novo comportamento?
Desmembrado a camada pai que era uma div, transformando-a em um componente po-overlay.
Com essa forma é possível atender às especificações do AnimaliaDS e reaproveitá-lo em outros componentes que atualmente se utilizam do efeito de overlay como é o caso da modal, tabela, datepicker e o próprio loading overlay.
Também está implementado os requisitos de acessibilidade conforme o AnimaliaDS.

po-ui/po-style#469
totvs/po-theme-totvs#272

Simulação
No App é possível simular o uso dos dois componentes utilizando dos switchs para habilitar o p-screen-lock de cada um.
1-No primeiro caso é possível ver apenas a implementação do po-overlay carregando um conteúdo qualquer;
2-No segundo caso é possível ver o loading overlay abrindo, porém agora com o uso do po-overlay em sua composição.

app.zip
styles.zip