Edifiko
Edifiko UIComponent Catalog
  • Overview
  • Base
  • Shared
Modules
  • Home
  • Users
  • Suppliers
  • Auth
  • Categories
  • Material Catalog
  • Configuration
  • Works
  1. Component Catalog
  2. Auth

Auth

Ready

components/auth

Shared layout and role-based signup screens for the public authentication flow. Each route is built mobile-first and mapped to the Figma signup frames.

Routes

Public auth routes included in the Figma flow.

Register
Ready
Register Buyer
Ready
Register Supplier
Ready
Buyer Profile
Ready
Supplier Profile
Ready
Verify Email
Ready
Verified Email
Ready

Register choice

Pantalla de selección (dos rutas). Usa la prop `selected` para indicar el camino activo (borde/estilo del CTA).

Regístrate en Edifiko

Plataforma que centraliza el abastecimiento de materiales para obras.

Consumidor

Gestiona materiales, solicita licitaciones y haz seguimiento de compras y entregas para tus obras.

Soy consumidor

Proveedor

Envía presupuestos, administra pedidos y coordina entregas para ampliar tus oportunidades de venta.

Soy proveedor

PhoneNumberInput

Input compuesto: selector de prefijo +formateo de dígitos al patrón Edifiko + input hidden con el país. Incluye variante por `defaultCountryCode`.

Casos de uso

  • Campos de teléfono en `register-buyer-profile`, `register-supplier-profile` y teléfono del responsable.
  • Entrada `type tel` con formateo progresivo y país en un input hidden.

Variante — default `+54`

Variante — default `+34`

Buyer signup

Email, password and social sign-up actions.

Regístrate como consumidor
Gestiona materiales, solicita licitaciones y haz seguimiento de compras y entregas para tus obras.

Mínimo 8 caracteres

O

Profile steps

Consumer and supplier profile information forms.

Información del perfil
Completar datos como consumidor.
Información del perfil
Completar datos como proveedor.

Datos de la persona responsable

Email verification (sin código) — cooldown activo

Pantalla por link (sin input de código): muestra email enmascarado, permite cambiar correo y deshabilita “reenviar” con contador.

Verificar correo
Te enviamos un correo a ju******n@email.com. Para verificar la cuenta, tocá el link del correo.
Cambiar correo
Ir al correo

Email verification (sin código) — reenviar habilitado

Misma pantalla, pero “reenviar correo” está habilitado (sin input de verificación).

Verificar correo
Te enviamos un correo a ju******n@email.com. Para verificar la cuenta, tocá el link del correo.
Cambiar correoReenviar correo
Ir al correo

Success state

Estado posterior a verificación exitosa: mensaje y botón “Ingresar” (redirige según `role`).

Correo verificado
Tu cuenta ya está activa.

Ya podés continuar con el acceso a la plataforma.

Continuar
Correo verificado
Tu cuenta ya está activa.

Ya podés continuar con el acceso a la plataforma.

Continuar