diff --git a/src/components/PageSkeleton.tsx b/src/components/PageSkeleton.tsx deleted file mode 100644 index 35c5bdb..0000000 --- a/src/components/PageSkeleton.tsx +++ /dev/null @@ -1,41 +0,0 @@ -/** - * PageSkeleton 组件 - 页面加载骨架屏 - * - * 用于 Suspense fallback 和初始加载状态,提供平滑的视觉过渡 - * 避免白屏闪烁,减少布局偏移 - */ - -/** - * 工具页面骨架屏 - */ -function ToolPageSkeleton() { - return ( -
- {/* 标题区域 */} -
- - {/* 输入区域 */} -
- - {/* 控制栏 */} -
-
-
-
-
-
- - {/* 结果区域 */} -
-
- ); -} - -/** - * 页面加载骨架屏 - */ -export default function PageSkeleton() { - return ; -} - -PageSkeleton.displayName = 'PageSkeleton'; diff --git a/src/components/README.md b/src/components/README.md index 3dd670c..ebcda16 100644 --- a/src/components/README.md +++ b/src/components/README.md @@ -6,7 +6,7 @@ | 组件 | 用途 | | ----------------------- | ------------------------------------------------------------------------------------------------------ | -| `RouterContainer.tsx` | 路由容器,根据当前路由动态渲染对应页面组件,集成错误边界和骨架屏 | +| `RouterContainer.tsx` | 路由容器,根据当前路由动态渲染对应页面组件,集成错误边界 | | `SwitchButtonGroup.tsx` | 通用切换按钮组,支持 `small/medium/large` 三种尺寸,用于页面子模式切换 | | `EmptyPlaceholder.tsx` | 虚线边框空状态占位,统一工具页「暂无结果」提示样式 | | `TextInputArea.tsx` | 增强文本输入区域,支持校验规则、工具栏操作、字符计数、清空 | @@ -17,7 +17,6 @@ | `GlobalSnackbar.tsx` | 全局消息提示组件 + Context Provider,支持受控/Hook/全局单例三种使用方式 | | `ErrorBoundary.tsx` | 全局错误边界(类组件),捕获子组件树 JS 错误并展示友好错误页面 | | `PageErrorBoundary.tsx` | 页面级错误边界,适配 shadcn 暗黑模式,支持 `resetKey` 自动恢复 | -| `PageSkeleton.tsx` | 页面骨架屏,提供 `dashboard` 和 `tool` 两种变体,用于 Suspense fallback | ## 使用约定 diff --git a/src/components/RouterContainer.tsx b/src/components/RouterContainer.tsx index 86186ab..6a68ea6 100644 --- a/src/components/RouterContainer.tsx +++ b/src/components/RouterContainer.tsx @@ -4,7 +4,6 @@ import { useRouter } from '@/providers/RouterProvider'; import type { PageType } from '@/types/storage'; import { type ComponentType, useEffect, useState } from 'react'; import PageErrorBoundary from '@/components/PageErrorBoundary'; -import PageSkeleton from '@/components/PageSkeleton'; import { cn } from '@/lib/utils'; import { AlertTriangle } from 'lucide-react'; @@ -30,7 +29,7 @@ function LoadedPage({ pageKey }: { pageKey: PageType }) { }, [pageKey]); if (!Page) { - return ; + return