O catálogo detalhado de tudo o que você pode construir dentro da tela de um Flow, desde títulos e datas até validações rigorosas de texto.
📏 Limites Globais de Meta
Limite | Valor máximo permitido |
Componentes por tela | 50 máximo. |
Opções em listas suspensas | 200 (100 se tiverem imagem). |
Imagens por tela | 3 máximo. |
Tamanho do Flow JSON | 10 MB. |
🛠️ Inventário de Componentes
A maioria dos componentes de seleção e captura podem ser usados Estáticos (conteúdo fixo) ou Conectáveis (alimentados em tempo real via Data Exchange).
1. Textos e Títulos (Somente Estáticos)
Mostram informação. Suportam variáveis dinâmicas (como {nome}) mas não disparam ações.
Título / Subtítulo: Até 80 caracteres.
Texto (Body/Caption): Suporta negrito, itálico e markdown (v5.1+). Até 4096 caracteres.
2. Entrada de texto (Estático / Conectável)
Capturam dados digitados.
Caixa de texto: Permite input-type (text, number, email, password), max-chars e pattern.
Caixa multilinha: Até 600 caracteres.
3. Seleção (Estático / Conectável)
Campo de opção (Dropdown): Lista suspensa. Pode disparar uma cascata ao escolher (on-select-action).
Caixas de seleção / Opção única: 1 a 20 opções.
4. Data e Mídia
Seletor de data: Mínimo, máximo e datas não disponíveis. (Conectável para disponibilidade real).
Imagem / Carrossel: Somente estáticas (~300 KB recomendado). Não podem ser geradas em tempo real.
Anexar foto/doc: Recebe fotos (até 25 MB) e documentos (até 100 MB).
🧮 Validação de formatos com Regex (Pattern)
Disponível desde a versão 6.2, permite obrigar que o dado tenha um formato exato. Se não cumpre, o usuário não avança.
Dado a validar | Padrão (Regex) | Explicação |
Placa Veicular | ^[A-Z]{3}-?[0-9]{3,4}$ | Três maiúsculas, hífen opcional, 3 ou 4 números. |
Somente números | ^[0-9]+$ | Ideal em caixa de texto para não perder zeros iniciais. |
Correio eletrônico | ^[^@\s]+@[^@\s]+\.[A-Za-z]{2,}$ | Texto sem espaços, uma arroba e domínio válido. |
Telefone 10 dígitos | ^[0-9]{10}$ | Exatamente dez dígitos, sem espaços. |
💡 Boa prática: Acompanhe sempre o padrão com uma mensagem de erro clara ("A placa deve ter 3 letras e 3 números"). Mantenha os padrões simples para evitar frustração.
Projete interfaces perfeitas! 🚀
Saber exatamente o que cada componente faz e como limitar a entrada do usuário através de Regex permite criar mini-aplicações robustas e livres de erros tipográficos. ✅