feat: 升级项目 Logo、完善 toast 提示及优化工程化配置

### Features
- **logo**: 替换全套项目图标,更新 wxt.config.ts 浏览器扩展图标配置。

### Bug Fixes
- **ui/toast**: 引入 <Toaster> 组件修复 toast 无法显示问题,并调整位置为正下方。
- **i18n**: 统一将 t() 函数中的 `.` 和 `:` 转换为 `_`,修复国际化文案读取失败问题。
- **context-menu**: 限制 srcUrl 检查仅在二维码图片菜单项生效,避免误判。
- **hooks**: 修复 pre-push 钩子,仅对变更文件进行 eslint 检查,并支持无 upstream 时的回退对比。
- **components**: 修复 CopyButton 动画与组件导入方式,并补齐无障碍属性与测试。
- **async**: 延迟生成二维码以正确渲染 loading 状态,并适配相关异步测试。

### Refactor & Cleans
- **clean**: 清理未使用的组件(ToolCard)、Hook(useDebounce)及多个未使用的工具函数导出。
- **structure**: 统一移动测试文件至 __tests__ 目录,移除不必要的类型导出。

### Documentation
- **docs**: 在 AGENTS.md 中明确规范 Git Commit 必须使用中文描述。
This commit is contained in:
LingandRX
2026-06-06 01:07:27 +08:00
committed by GitHub
parent c992986789
commit a5d86a92c2
29 changed files with 230 additions and 601 deletions
-107
View File
@@ -1,107 +0,0 @@
import type { ComponentType } from 'react';
import React from 'react';
import type { LucideProps } from 'lucide-react';
import { ChevronRight } from 'lucide-react';
import type { PaletteColorKey } from '@/config/features';
import { cn } from '@/lib/utils';
const PALETTE_COLORS: Record<PaletteColorKey, string> = {
primary: '13, 148, 136', // teal
success: '22, 163, 74', // green
warning: '217, 119, 6', // amber (存储清理的橙色轴)
error: '220, 38, 38', // red
secondary: '147, 51, 232',
info: '37, 99, 235', // blue
};
export interface ToolCardProps extends React.HTMLAttributes<HTMLDivElement> {
title: string;
description?: string;
snapshot?: React.ReactNode;
colorKey: PaletteColorKey;
icon: ComponentType<LucideProps>;
onNavigate: () => void;
}
export default function ToolCard({
title,
description,
snapshot,
colorKey,
icon: IconComponent,
onNavigate,
className,
...props
}: ToolCardProps) {
const rgbValues = PALETTE_COLORS[colorKey];
return (
<div
style={{
['--tool-color' as string]: rgbValues,
}}
/* 💡 核心修复点:
- 坚决不用 h-full 或固定高度,锁死 h-auto(高度自适应流),配合 py-4 px-4 牢牢把内容包裹在卡片体内。
- 废除原先会乱飘的内联 style 属性擦写,全权放权给 Tailwind 的声明式 hover 变体。
*/
className={cn(
'group relative rounded-xl border border-border/70 bg-card text-card-foreground p-4 h-auto flex flex-col items-stretch justify-start gap-3 shadow-sm select-none box-border',
'hover:bg-muted/30',
'hover:border-[rgba(var(--tool-color),0.45)]',
'hover:shadow-[0_8px_24px_-8px_rgba(var(--tool-color),0.14)] dark:hover:shadow-[0_8px_30px_-10px_rgba(var(--tool-color),0.25)]',
className,
)}
{...props}
>
{/* 上半部分:核心信息交互排版轴 */}
<div className="flex items-center justify-between w-full relative min-w-0 min-h-[44px]">
<div className="flex gap-3 items-center min-w-0 flex-1 pr-2">
{/* 左侧圆形图标容器 */}
<div
className={cn(
'flex items-center justify-center w-10 h-10 rounded-xl shrink-0',
'bg-[rgba(var(--tool-color),0.08)] dark:bg-[rgba(var(--tool-color),0.12)]',
'text-[rgb(var(--tool-color))]',
)}
>
<IconComponent className="h-5 w-5 shrink-0" />
</div>
{/* 中间文字描述区:利用 flex-1 min-w-0 防御文本过长发生恶性撑开 */}
<div className="flex-1 min-w-0 flex flex-col">
<h4 className="font-bold text-sm tracking-tight text-foreground leading-snug">
{title}
</h4>
{description && (
<p className="text-[11px] font-medium text-muted-foreground/90 mt-0.5 leading-normal w-full truncate">
{description}
</p>
)}
</div>
</div>
{/* 右侧指示小箭头 */}
<div className="text-muted-foreground/40 group-hover:text-[rgb(var(--tool-color))] p-1 shrink-0 group-hover:translate-x-0.5">
<ChevronRight className="h-4 w-4" />
</div>
{/* 覆盖整个上半部分的绝对定位隐形跳转层(A11y 无障碍标准合规) */}
<button
type="button"
onClick={onNavigate}
aria-label={`进入 ${title}`}
className="absolute inset-0 w-full h-full cursor-pointer bg-transparent border-none opacity-0 focus-visible:outline-none"
/>
</div>
{/* 下半部分:未来的动态预览沙箱独立承载区 */}
{snapshot != null && (
<div className="mt-1 pt-3 border-t border-dashed border-border/80 w-full relative z-10 select-text">
{snapshot}
</div>
)}
</div>
);
}
ToolCard.displayName = 'ToolCard';