创建 10 个实用的模块化 React 组件模板，考虑现代 React 开发流程中的最佳实践。模板应涵盖各种典型应用场景，并且易于定制。

背景：[React、JavaScript、组件、模块化、可复用性、Hooks、状态管理、Props、UI 设计、前端开发]

目标：[高效且可维护的组件开发、清晰的结构、简单的集成、可复用性、现代 React 技术]

对于每个模板说明：
1) 组件的应用场景或功能
2) 结构及示例代码，包括现代 React 特性（如 Hooks、Context、Suspense）
3) 关于结构、状态处理和样式的最佳实践提示

模板应：
- 包含函数式组件和有状态组件
- 涉及 TypeScript 或 JavaScript（根据说明可选）
- 考虑响应式和无障碍的 UI 设计
- 适合具有 React 基础知识的开发者