FesaComponents

@fesa/components

La librería de componentes compartida de los sistemas FESA — un solo paquete, un módulo por dominio.

@fesa/components es el paquete compartido de los sistemas FESA. Nació como la extracción del datatable (antes @fesa/datatable) y hoy agrupa todos los componentes que estaban duplicados entre FesaStore, fesa.com.pa, Fesa ID y el starter. Un solo repo, una sola versión, y cada app importa solo el módulo que usa.

Mapa de módulos

MóduloImportQué contieneEstado
DataTable@fesa/components/datatableTabla server-first completa (paginación, filtros, export, selección masiva)Estable — en producción en 4 apps
Formularios@fesa/components/forms48 campos react-hook-form (~19.000 LOC): moneda, teléfono, firma, crop de imagen, recurrencia…Adoptado — fesa.com.pa (v0.5.2)
UI@fesa/components/uiPrimitivas shadcn que usan los formularios + password-input, comboboxExtraído v0.5.2
Motion@fesa/components/motion + /hooksAnimatedSection, AnimatedCounter, BackToTop, use-in-view (antes 4 copias idénticas)Extraído v0.5.2
Utilidades@fesa/components/utilsErrores, paginación, slug, contraste WCAG, sanitize, cache y rate-limit en memoria, puertos de infraestructuraExtraído v0.5.2
Seguridad@fesa/components/securityWAF por reglas con puntuación (48 reglas, con tests)Extraído v0.5.2
Email@fesa/components/emailDesign system de correos (EmailLayout + MetaBox/CtaButton/CodeBox/AlertBox, el de FesaStore) + adapter ResendExtraído v0.5.2
Auth@fesa/components/authbetter-auth + drizzle MySQL: registro cerrado, roles parametrizables, plugin adminEn producción — developers.fesa.com.pa (v0.6.1)
Storage@fesa/components/storageAdapter Cloudflare R2/S3 detrás de IStorageServiceExtraído v0.5.2

Regla de la casa

Ningún módulo importa next-intl ni catálogos de mensajes: todos los textos tienen default en español y se sobreescriben por props o provider (el patrón del DataTableLabelsProvider). Las dependencias pesadas (aws-sdk, resend, react-email) son peers opcionales: solo las instala la app que importa ese módulo.

Instalación

package.json
"dependencies": {
  "@fesa/components": "git+ssh://[email protected]/AdanSerrano/fesa-components.git#v0.5.2"
}
next.config.ts
transpilePackages: ["@fesa/components"]
app/globals.css
@source "../node_modules/@fesa/components/src";

Igual que siempre: tag pineado, TSX crudo sin build, la app lo compila con su propio Tailwind y tsconfig.

Migrando desde @fesa/datatable

Los pins viejos a fesa-datatable.git#v0.4.0 siguen funcionando (GitHub redirige el repo renombrado). Al subir a v0.5.x: cambia el nombre del paquete, la URL, y los imports de @fesa/datatable@fesa/components/datatable (y /server). El API de la tabla no cambió.

Empezar

En esta pagina