This package starts intentionally small. It holds product language, layout constants, tokens, and workflow metadata before it grows into a component library.

V4 Shell Components

组件为纯展示组件（不引入运行时依赖），通过 transpilePackages 由消费方编译。样式类名与品牌令牌由消费方全局样式表提供（见 apps/contract-web/src/app/globals.css 的 V4 层，令牌定义见 src/tokens.ts）。

SiteHeader

置顶网站导航骨架。品牌与导航链接组件由消费方注入（Next.js 应用传 next/link）。

import Link from "next/link";
import { SiteHeader } from "@yuqei/design-system";

<SiteHeader
  brand={{ href: "/workspace", mark: "钰", title: "钰麒合同", subtitle: "AI 合同平台" }}
  nav={[{ href: "/workspace", label: "工作台", active: true }]}
  link={Link}
  actions={<>{/* 搜索、CTA、用户菜单 */}</>}
  onToggleNav={openDrawer}
  toggleIcon={<Menu size={20} />}
/>

MemberHero

会员主页问候区：衬线标题 + 数据概览 + 行动按钮。

import { MemberHero } from "@yuqei/design-system";

<MemberHero
  title="下午好，张法务"
  kicker="8 月 28 日 星期五 · 法务"
  lead="合同在这里开始……"
  actions={<Link className="button button-primary" href="/legal-documents">起草合同</Link>}
  stats={[{ key: "pending", value: 3, label: "待我处理" }]}
/>