83ba47ab8f
- Card 新增 tone(panel/card/soft)/flat/interactive；cardClass 兼容旧字符串签名 - Button 新增 link(coral 文字链) 变体与 lg 尺寸 - 新增原子件 Eyebrow(统一眉题) / StatusDot(状态点·读屏可见) / Skeleton(motion-safe 占位) / Meter(进度条·progressbar) - PageHeader/SectionHeader 用 display/title 字阶 + Eyebrow 眉题
31 lines
593 B
TypeScript
31 lines
593 B
TypeScript
import type { HTMLAttributes, ReactNode } from "react";
|
|
|
|
import { cardClass, type CardTone } from "@/lib/ui/variants";
|
|
|
|
interface CardProps extends HTMLAttributes<HTMLElement> {
|
|
children: ReactNode;
|
|
as?: "article" | "div" | "section";
|
|
tone?: CardTone;
|
|
flat?: boolean;
|
|
interactive?: boolean;
|
|
}
|
|
|
|
export function Card({
|
|
as: Component = "div",
|
|
children,
|
|
className,
|
|
tone,
|
|
flat,
|
|
interactive,
|
|
...props
|
|
}: CardProps) {
|
|
return (
|
|
<Component
|
|
className={cardClass({ tone, flat, interactive, className })}
|
|
{...props}
|
|
>
|
|
{children}
|
|
</Component>
|
|
);
|
|
}
|