LingandRX
36b6bfd20d
* feat: 生成成功改为 toast 提示 * refactor: 数据预览改为显示示例数据，简化组件逻辑 * fix: 非必填字段预览显示 null * fix: 修复空值率与必填状态的逻辑 * fix: 切换为非必填时默认空值率 100% * feat: 字段编辑弹窗添加「完成」按钮 去除关闭按钮，添加取消按钮 * refactor: 删除未使用的 defaultNullRate 功能 * feat: 优化规则管理功能 * fix: 更新 features 测试断言以匹配新增的 testDataGenerator * refactor: 将 formatFileSize 重命名为 formatBytes 并移至通用工具模块 * refactor: 使用 Label 组件替换原生 label 元素，并在 DecodeResultPaper 中引入 Input 组件 * refactor: 规范化页面组件目录结构 * refactor(JsonTools): 规范化页面组件目录结构 * refactor(StorageCleaner): 规范化页面组件目录结构 * refactor(Timestamp): 规范化页面组件目录结构 * refactor(i18n): 移除 chrome.i18n 国际化，统一使用中文硬编码 * refactor(AppRoot): 移除 RouterProvider 组件，直接渲染子组件 * fix(RouterProvider): 将 goBack 重命名为 goHome，修复跨窗同步 merge 不一致 * fix(ThemeModeProvider): 修复主题快照同步与首屏闪烁问题 * refactor: 将 UI 文案改为中文并优化相关逻辑 * refactor: 清理代码注释并优化组件结构 * feat(Dashboard): 重构仪表板功能组件和逻辑 * refactor: 更新功能键名称并移除 README 文件 * refactor: 重构 TopBar 组件并更新项目结构 * feat(TopBar): 添加搜索功能组件并优化结构 * refactor: 统一使用 Button 组件替换原有 button 元素 * feat: 添加 EmptyPlaceholder 组件并更新相关页面 * feat(TextStatistics): 引入 StatCard 组件以优化统计信息展示 * feat(Timestamp): 重构时间戳转换功能，新增 ConverterForm 组件 * feat(Jwt): 重构 JWT 组件，新增常量和结果视图 * refactor(RightClickRestorer): 用状态配置表简化页面 UI 结构 * fix(business): 修复 skewedRandom 函数中的数学计算错误 * refactor(ImageUploader): 移除预览 URL 相关逻辑并简化粘贴事件处理 * feat(TestDataGenerator): 更新规则编辑提示和警告显示逻辑 * refactor(CopyButton.test): 移除冗余测试用例 * refactor(RouterProvider, chromeStorage, useContextMenuData): 更新存储获取逻辑以移除默认值参数 * refactor(代码重复): 抽取共享工具函数与 UI 组件，消除多处重复实现 * fix(RouterProvider): 修复初始加载状态逻辑，确保在加载前不覆盖 chrome.storage * feat(TopBar): 添加搜索框快捷键提示功能及相关测试 * refactor(StorageCleaner): 移动 isRestrictedUrl 函数到独立模块并更新相关引用 * fix(StorageCleaner): 修复 IndexedDB 清理竞态、部分成功计数与刷新后状态同步 * fix: 修复路由初始化竞态、存储状态静默覆盖与存储清理误删 * refactor: 统一中文文案并简化组件结构，提升代码可读性 * refactor: 更新 Worker 消息类型以支持生成任务 ID * fix: 修复 ruleStorage 写入失败处理与 CopyButton 成功态样式
2.2 KiB
2.2 KiB
components/
通用业务组件目录，存放跨页面复用的 UI 组件，与具体工具页面解耦。
组件列表
| 组件 | 用途 |
|---|---|
RouterContainer.tsx |
路由容器，根据当前路由动态渲染对应页面组件，集成错误边界和骨架屏 |
SwitchButtonGroup.tsx |
通用切换按钮组，支持 small/medium/large 三种尺寸，用于页面子模式切换 |
EmptyPlaceholder.tsx |
虚线边框空状态占位，统一工具页「暂无结果」提示样式 |
TextInputArea.tsx |
增强文本输入区域，支持校验规则、工具栏操作、字符计数、清空 |
CopyButton.tsx |
一键复制按钮，支持复制成功状态动画，封装 copyTextToClipboard 和 toast 反馈 |
ImageUploader.tsx |
图片上传组件，支持拖拽上传、文件选择和预览 |
QrCodePreview.tsx |
二维码预览组件，展示生成的二维码图片，提供复制和下载操作 |
DecodeResultPaper.tsx |
Base64 解码结果展示面板，显示 MIME 类型、文件大小、文件名输入和下载按钮 |
GlobalSnackbar.tsx |
全局消息提示组件 + Context Provider，支持受控/Hook/全局单例三种使用方式 |
ErrorBoundary.tsx |
全局错误边界（类组件），捕获子组件树 JS 错误并展示友好错误页面 |
PageErrorBoundary.tsx |
页面级错误边界，适配 shadcn 暗黑模式，支持 resetKey 自动恢复 |
PageSkeleton.tsx |
页面骨架屏，提供 dashboard 和 tool 两种变体，用于 Suspense fallback |
使用约定
- 优先使用
components/ui/下的 shadcn/ui 基础组件 - 组件使用
cn()合并 Tailwind 类名，支持className透传 - 需要 memo 优化的组件使用
React.memo+displayName - 需要 ref 转发的组件使用
React.forwardRef+displayName