Component 0 - Copy this React, Tailwind Component to your project

Genera una interfaz de usuario React + Tailwind para editar empleados con los siguientes requisitos: COMPONENTES: Formulario con campos: * ID_Empleado (disabled, formato EMP 001) * Nombre (input texto, validación 2 50 caracteres) * Rol (dropdown: diseñador, fabricante, vendedor, administrador) * Estado (dropdown: activo, inactivo, vacaciones) * Correo (validación regex estándar) * Teléfono (máscara +52 XXX XXX XXXX) * Sucursal (autocompletar con opciones: Norte, Sur, Centro) * Fecha ingreso (datepicker max=hoy) VALIDACIONES: Mensajes de error en rojo bajo cada campo Highlight de bordes rojos en inputs inválidos Previsualización en tiempo real con tarjeta lateral LAYOUT: 2 columnas grid (formulario 60% | previsualización 40%) Botones: Guardar (azul #2563EB), Cancelar (gris #6B7280) Iconos: * Rol → maleta (Heroicons) * Estado → círculo de color (verde/rojo/gris) REQUISITOS TÉCNICOS: Mobile first (responsive con breakpoints md/lg) Accesibilidad WCAG AA (contraste 4.5:1) Integración con API REST (axios ready) Código listo para importar en Next.js 14+ Usar: Tailwind para estilos react hook form para validaciones @headlessui/react para dropdowns