InteractionBlockingOverlay

O InteractionBlockingOverlay é um componente utilizado para bloquear a interação do usuário em situações onde o sistema não está preparado para o uso, como em telas ou módulos que não possuem responsividade adequada para dispositivos móveis ou no modo paisagem (landscape).

---

Quando usar:

• Quando uma tela ou módulo não possui uma versão responsiva para dispositivos móveis, garantindo que o usuário não interaja com elementos quebrados ou não funcionais.
• Quando um dispositivo móvel estiver em modo paisagem e o layout da aplicação não estiver adaptado para essa orientação.
• Em situações temporárias, onde uma funcionalidade ou conteúdo específico precisa ser desativado para manutenção ou atualização.

Quando não usar:

• Quando o sistema já oferece uma versão responsiva ou uma alternativa viável para a interação em dispositivos móveis.
• Em casos onde a aplicação pode ajustar automaticamente o layout sem necessidade de bloqueio.
• Se o bloqueio da interação pode causar frustração ao usuário, especialmente em funcionalidades essenciais ou em fluxos críticos.

---

Uso

<CdsInteractionBlockingOverlay
	block-interaction="mobile"
	title="título"
	description="descrição"
	button-variant="green"
	button-text="Ir para o início"
	@button-click="handler"
/>

---

Preview

---

Props

Nome	Tipo	Default	Opções	Descrição
* blockInteraction (required)	string	'mobile'	mobile landscape	Define qual critério vai ser usado para exibir o componente.
title	string	''	--	Define o título do componente.
description	string	''	--	Define a mensagem descritiva a ser exibida no componente.
buttonVariant	string	'green'	green teal blue indigo violet pink red orange amber dark	Define qual é a variante de cor do botão exibido quando a propriedade 'block-interaction' for 'mobile'.
buttonText	string	'Ir para o início'	--	Define qual o texto do botão exibido quando a propriedade 'block-interaction' for 'mobile'.

Eventos

Nome	Descrição
@button-click	Evento que indica que o botão de ação foi clicado