El catálogo detallado de todo lo que puedes construir dentro de la pantalla de un Flow, desde títulos y fechas hasta validaciones estrictas de texto.
📏 Límites Globales de Meta
Límite | Valor máximo permitido |
Componentes por pantalla | 50 máximo. |
Opciones en listas desplegables | 200 (100 si llevan imagen). |
Imágenes por pantalla | 3 máximo. |
Tamaño del Flow JSON | 10 MB. |
🛠️ Inventario de Componentes
La mayoría de los componentes de selección y captura pueden usarse Estáticos (contenido fijo) o Conectables (alimentados en vivo vía Data Exchange).
1. Textos y Títulos (Solo Estáticos)
Muestran información. Admiten variables dinámicas (como {nombre}) pero no disparan acciones.
Título / Subtítulo: Hasta 80 caracteres.
Texto (Body/Caption): Soporta negrita, itálica y markdown (v5.1+). Hasta 4096 caracteres.
2. Entrada de texto (Estático / Conectable)
Capturan datos escritos.
Caja de texto: Permite input-type (text, number, email, password), max-chars y pattern.
Caja multilínea: Hasta 600 caracteres.
3. Selección (Estático / Conectable)
Campo de opción (Dropdown): Lista desplegable. Puede disparar una cascada al elegir (on-select-action).
Casillas / Opción única: 1 a 20 opciones.
4. Fecha y Media
Selector de fecha: Mínimo, máximo y fechas no disponibles. (Conectable para disponibilidad real).
Imagen / Carrusel: Solo estáticas (~300 KB recomendado). No pueden generarse en tiempo real.
Adjuntar foto/doc: Recibe fotos (hasta 25 MB) y documentos (hasta 100 MB).
🧮 Validación de formatos con Regex (Pattern)
Disponible desde la versión 6.2, permite obligar a que el dato tenga un formato exacto. Si no cumple, el usuario no avanza.
Dato a validar | Patrón (Regex) | Explicación |
Placa Vehicular | ^[A-Z]{3}-?[0-9]{3,4}$ | Tres mayúsculas, guion opcional, 3 o 4 números. |
Solo números | ^[0-9]+$ | Ideal en caja de texto para no perder ceros iniciales. |
Correo electrónico | ^[^@\s]+@[^@\s]+\.[A-Za-z]{2,}$ | Texto sin espacios, una arroba, y dominio válido. |
Teléfono 10 dígitos | ^[0-9]{10}$ | Exactamente diez dígitos, sin espacios. |
💡 Buena práctica: Acompaña siempre el patrón con un mensaje de error claro ("La placa debe tener 3 letras y 3 números"). Mantén los patrones simples para evitar frustración.
¡Diseña interfaces perfectas! 🚀
Conocer exactamente qué hace cada componente y cómo limitar la entrada del usuario mediante Regex te permite crear mini-aplicaciones robustas y libres de errores tipográficos. ✅