Formularios
Formularios listos para usar: contacto, cotización, reserva e inscripción. La IA los agrega con un solo componente — sin handler de envío que escribir — y cada respuesta llega a la bandeja de envíos de tu app.
Los formularios en Proyecta son una capacidad, no algo que la IA codifica a mano. Cuando tu app necesita que los visitantes te contacten — un formulario de contacto, una solicitud de cotización, una reserva de cita, un registro para un evento — Proyecta provee una definición de formulario lista para usarse y la renderiza a través de un bloque propio del template. La validación, el estado de éxito, el almacenamiento de respuestas y la notificación al propietario vienen incluidos sin costo adicional.
Los presets
Sección titulada «Los presets»Todo formulario parte de uno de cinco presets integrados. Describe el formulario que necesitas y Proyecta elige (y adapta) el correcto — nunca construyes campos desde cero.
| Preset | form api id |
Para qué sirve | Se combina con |
|---|---|---|---|
| Contact | contactForm |
“Contáctanos” general: nombre, correo, teléfono opcional, mensaje | Información del negocio |
| Quote | quoteForm |
Solicitud de cotización: datos de contacto + servicio deseado + detalles | Servicios |
| Booking | bookingForm |
Reserva / cita: servicio, fecha y hora preferida, datos de contacto | Servicios |
| Registration | registrationForm |
Registro a evento o curso (inscripción / RSVP): datos del asistente + nota | Eventos |
| Order | orderForm |
Recepción de pedidos: qué quiere el cliente, datos de contacto, notas | Menú, catálogo |
Puedes tener varios formularios en una sola app (por ejemplo, un formulario de contacto y uno de reserva), y la IA puede agregar, renombrar o modificar campos en cualquiera de ellos.
Cómo lo conecta la IA
Sección titulada «Cómo lo conecta la IA»La IA nunca construye un formulario ni un handler de envío a mano. Inserta el <FormBlock/> propio del template y lo apunta a un formulario por id o api id:
import { FormBlock } from '@/components/blocks/FormBlock';
// En cualquier parte de una página pública — una sección de contacto, un panel de "solicitar cotización", etc.<FormBlock form="contactForm" />;<FormBlock/> hace todo por sí solo:
- Renderiza los campos según su tipo — texto / correo / teléfono como inputs, texto largo como textarea, opciones como dropdown, confirmaciones como checkbox, fechas y horas como selectores nativos, y campos de archivo como un control “adjuntar archivo”.
- Valida en el navegador — los campos obligatorios se verifican antes de enviar cualquier cosa.
- Valida en el servidor — si el servidor rechaza un valor, el error específico se muestra junto al campo correspondiente (sin respuestas perdidas ni fallas silenciosas).
- Muestra un estado de éxito — al enviar, el formulario es reemplazado por una confirmación amigable (el mensaje de confirmación propio del formulario) con la opción de enviar otra respuesta.
- Falla de forma segura — si el formulario no existe o ha sido desactivado, el bloque no renderiza nada, por lo que nunca puede romper una página pública.
Dado que el bloque es propio del template, el trabajo de la IA es simplemente colocarlo y estilizar la sección que lo rodea — la lógica interna está fija y es correcta.
Adjuntos de archivos
Sección titulada «Adjuntos de archivos»Los formularios pueden aceptar un archivo subido (un recibo, una foto de referencia, un brief). Los campos de archivo renderizan un botón “adjuntar archivo”, suben el archivo al storage y colocan su URL pública en la respuesta. Los límites se aplican automáticamente:
- Solo imágenes y PDF, hasta 5 MB (las imágenes grandes se reducen en el navegador primero).
- El botón de envío se deshabilita mientras se sube un archivo, por lo que una respuesta nunca se envía a medias.
A dónde van las respuestas
Sección titulada «A dónde van las respuestas»Cada respuesta se almacena y aparece en la bandeja de envíos de tu app — parte del panel de administración, renderizada por el <SubmissionsInbox/> del template. Desde ahí tú (el propietario) puedes:
- Explorar las respuestas en las pestañas New / Read / Archived, con un badge de no leídas en New.
- Abrir cualquier respuesta para ver los valores enviados, la página de origen y la fecha.
- Marcar una respuesta como read, devolverla a new o archivarla.
- Filtrar la bandeja a un solo formulario, o ver las respuestas de todos los formularios en una sola lista.
La bandeja es solo para administradores — el usuario debe estar autenticado con una cuenta de administrador (aplicado desde el servidor).
Recibir un correo con cada respuesta
Sección titulada «Recibir un correo con cada respuesta»Los formularios pueden notificarte por correo cada vez que alguien envíe una respuesta — activa las notificaciones al propietario y configura la dirección que las recibirá. Recibes el lead en tu bandeja de correo sin necesidad de abrir la app. El correo se envía a través de la capacidad de correo electrónico de Proyecta, así que funciona sin configuración adicional.
Patrones comunes (deja que la IA lo conecte)
Sección titulada «Patrones comunes (deja que la IA lo conecte)»"Agrega un formulario de contacto en el footer con nombre, correo y mensaje, y envíame un correo a hello@mybiz.com cada vez que alguien lo envíe.""Pon un formulario de 'Solicitar cotización' en cada página de servicio que pregunte qué servicio necesitan y los detalles del trabajo.""Agrega un formulario de reserva para que los clientes puedan solicitar una cita con fecha y hora preferida.""Crea un formulario de registro para el evento en la página del taller y permite que los asistentes adjunten un PDF.""Muéstrame la bandeja de envíos y solo las respuestas que aún no he leído."
Relacionado
Sección titulada «Relacionado»- Gestión de contenido — los formularios conviven con tus colecciones en el mismo modelo de contenido.
- Panel de administración — donde se revisan las respuestas.
- Correos electrónicos — cómo se envían los correos de notificación al propietario.