Crea 10 plantillas prácticas para componentes modulares de React que tengan en cuenta las mejores prácticas en el proceso moderno de desarrollo con React. Las plantillas deben cubrir varios casos de uso típicos y ser fácilmente personalizables.

Contexto: [React, JavaScript, componentes, modularidad, reutilización, hooks, gestión de estado, props, diseño UI, desarrollo frontend]

Objetivo: [desarrollo eficiente y mantenible de componentes, estructura clara, integración sencilla, reutilización, técnicas modernas de React]

Para cada plantilla explica:
1) el caso de uso o la funcionalidad del componente
2) la estructura con código de ejemplo, incluyendo características modernas de React (p. ej. hooks, context, suspense)
3) indicaciones sobre mejores prácticas en estructura, manejo de estado y estilos

Las plantillas deben:
- incluir componentes tanto funcionales como con estado
- abordar TypeScript o JavaScript (opcional según indicación)
- considerar diseño UI responsivo y accesible
- ser adecuadas para desarrolladores con conocimientos básicos de React