@teamix-evo/ui 0.1.1 → 0.2.0

package/README.md

@@ -9,7 +9,7 @@ Source-injected UI components for Teamix Evo. Based on shadcn/ui, extended with
 - **Source injection**: components ship as `.tsx` files, not as a runtime library. `npx teamix-evo ui add button` copies `button.tsx` into the user project under `aliases.components`.
 - **First consumer of `@teamix-evo/design`**: the dev server imports OpenTrek tokens directly from the design package (`dev/index.css`), so components are previewed against the SAME tokens that ship to consumers — no mock values, single source of truth.
 - **No variant**: brand differences are absorbed by `@teamix-evo/design` tokens (CSS variables). One UI package serves all design variants.
-- **className contract**: components write `className="bg-primary"` (Tailwind v4 utility), which resolves to `var(--color-primary)` in v4 mode or `hsl(var(--primary))` in v3 mode. Semantic token names (`primary`, `destructive`, `muted`, ...) align with shadcn — see `@teamix-evo/design` for the token layer.
+- **className contract**: components write `className="bg-primary"` (Tailwind v4 utility), which resolves to `var(--color-primary)` from the project's `tokens.theme.css`. Semantic token names (`primary`, `destructive`, `muted`, ...) align with shadcn — see `@teamix-evo/design` for the token layer.
 - **Imports**: source files use placeholder paths like `@/utils/cn`. The CLI rewrites these to user-configured aliases (e.g. `@/lib/utils`) at install time.
 - **`updateStrategy: frozen`** is the default — once installed, the CLI never overwrites the file. Upgrades go through an AI + skill flow (v0.3, see PLAN §10.9).
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teamix-evo/ui",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "Source-injected UI components for Teamix Evo (shadcn-based, antd capabilities)",
   "type": "module",
   "files": [
@@ -72,9 +72,13 @@
     "vite": "^5.4.0",
     "vite-tsconfig-paths": "^6.1.1",
     "zod": "^3",
-    "@teamix-evo/eslint-config": "0.1.0",
-    "@teamix-evo/registry": "0.2.0",
-    "@teamix-evo/design": "^0.2.0"
+    "@teamix-evo/eslint-config": "0.2.0",
+    "@teamix-evo/design": "^0.3.0",
+    "@teamix-evo/registry": "0.3.0"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
   },
   "scripts": {
     "validate": "tsx scripts/validate-entries.ts",

package/src/components/accordion/accordion.meta.md

@@ -1,13 +1,14 @@
 ---
 id: accordion
 name: Accordion
+displayName: 折叠面板
 type: component
 category: navigation
 since: 0.1.0
-package: "@teamix-evo/ui"
+package: '@teamix-evo/ui'
 ---
 
-# Accordion
+# Accordion 折叠面板
 
 折叠面板 — Radix Accordion + antd Collapse 的 `accordion` 模式(`type="single"` 即单展开)。
 **与 Collapsible 区别**:Accordion 是**多 item 列表**,可单展开 / 多展开;Collapsible 是单个区域的展开收起。
@@ -29,7 +30,9 @@ package: "@teamix-evo/ui"
 > 以下表格由 `pnpm --filter @teamix-evo/ui gen:meta` 自动生成。
 
 <!-- auto:props:begin -->
+
 _(组件无 `<Name>Props` interface — props 详见 [`accordion.tsx`](./accordion.tsx))_
+
 <!-- auto:props:end -->
 
 ## 依赖
@@ -37,13 +40,14 @@ _(组件无 `<Name>Props` interface — props 详见 [`accordion.tsx`](./accordi
 > 以下表格由 `pnpm --filter @teamix-evo/ui gen:meta` 自动生成,数据源是 [`manifest.json`](../../../manifest.json)。**手工编辑 marker 之间的内容会在下次生成时被覆盖**。
 
 <!-- auto:deps:begin -->
+
 ### 同库依赖
 
 > `teamix-evo ui add accordion` 时,以下 entry 会被自动连带安装(无需手动 add)。
 
-| Entry | 类型 | 描述 |
-| --- | --- | --- |
-| `cn` | util | Tailwind className 合并工具(clsx + tailwind-merge) |
+| Entry | 类型 | 描述                                               |
+| ----- | ---- | -------------------------------------------------- |
+| `cn`  | util | Tailwind className 合并工具(clsx + tailwind-merge) |
 
 ### npm 依赖
 
@@ -52,6 +56,7 @@ _(组件无 `<Name>Props` interface — props 详见 [`accordion.tsx`](./accordi
 ```bash
 pnpm add @radix-ui/react-accordion@^1.2.0 lucide-react@^0.460.0
 ```
+
 <!-- auto:deps:end -->
 
 > 子组件:`Accordion`(Root,需 `type="single"` 或 `"multiple"`)/ `AccordionItem` / `AccordionTrigger` / `AccordionContent`。

package/src/components/accordion/accordion.stories.tsx

@@ -10,6 +10,14 @@ const meta: Meta<typeof Accordion> = {
   title: '导航 · Navigation/Accordion',
   component: Accordion,
   tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component:
+          '折叠面板 — Radix Accordion + antd Collapse accordion 模式。支持单展开(collapsible) / 多展开,每项自带 ChevronDown 箭头翻转动画。',
+      },
+    },
+  },
 };
 
 export default meta;
@@ -21,7 +29,8 @@ export const Single: Story = {
       <AccordionItem value="item-1">
         <AccordionTrigger>什么是 Teamix Evo?</AccordionTrigger>
         <AccordionContent>
-          面向产品研发场景的 AI Coding 套件,提供设计体系、技能、组件、文档等可装配资产。
+          面向产品研发场景的 AI Coding
+          套件,提供设计体系、技能、组件、文档等可装配资产。
         </AccordionContent>
       </AccordionItem>
       <AccordionItem value="item-2">
@@ -45,11 +54,7 @@ export const Single: Story = {
 export const Multiple: Story = {
   parameters: { controls: { disable: true } },
   render: () => (
-    <Accordion
-      type="multiple"
-      defaultValue={['a', 'b']}
-      className="w-96"
-    >
+    <Accordion type="multiple" defaultValue={['a', 'b']} className="w-96">
       <AccordionItem value="a">
         <AccordionTrigger>分组 A</AccordionTrigger>
         <AccordionContent>分组 A 的内容</AccordionContent>

package/src/components/affix/affix.meta.md

@@ -1,13 +1,14 @@
 ---
 id: affix
 name: Affix
+displayName: 固钉
 type: component
 category: navigation
 since: 0.1.0
-package: "@teamix-evo/ui"
+package: '@teamix-evo/ui'
 ---
 
-# Affix
+# Affix 固钉
 
 滚动吸顶 / 吸底 — antd 独有补足。**等价 antd `Affix`**。当容器滚出指定偏移时,把 children 切换为 `position: fixed`,保留原占位避免页面跳动。监听 `scroll` 事件 + `getBoundingClientRect()`,无第三方依赖。
 
@@ -24,26 +25,34 @@ package: "@teamix-evo/ui"
 - 弹窗内的吸附 → Drawer / Sheet 已有内置
 - 一页超过 1 个 Affix:容易形成"漂浮屏",有损可读性
 
+## Props
+
 <!-- auto:props:begin -->
-| 名称 | 类型 | 默认值 | 必填 | 说明 |
-| --- | --- | --- | --- | --- |
-| `offsetTop` | `number` | `0` | – | 滚动到此偏移量(相对视口顶部)时开始吸顶,单位 px。 |
-| `offsetBottom` | `number` | – | – | 滚动到此偏移量(相对视口底部)时开始吸底 — 与 `offsetTop` 互斥。 |
-| `onAffixChange` | `(affixed: boolean) => void` | – | – | 吸附状态变化回调(antd `onChange` 并集)。 |
+
+| 名称            | 类型                         | 默认值 | 必填 | 说明                                                           |
+| --------------- | ---------------------------- | ------ | ---- | -------------------------------------------------------------- |
+| `offsetTop`     | `number`                     | `0`    | –    | 滚动到此偏移量(相对视口顶部)时开始吸顶,单位 px。               |
+| `offsetBottom`  | `number`                     | –      | –    | 滚动到此偏移量(相对视口底部)时开始吸底 — 与 `offsetTop` 互斥。 |
+| `onAffixChange` | `(affixed: boolean) => void` | –      | –    | 吸附状态变化回调(antd `onChange` 并集)。                       |
+
 <!-- auto:props:end -->
 
+## 依赖
+
 <!-- auto:deps:begin -->
+
 ### 同库依赖
 
 > `teamix-evo ui add affix` 时,以下 entry 会被自动连带安装(无需手动 add)。
 
-| Entry | 类型 | 描述 |
-| --- | --- | --- |
-| `cn` | util | Tailwind className 合并工具(clsx + tailwind-merge) |
+| Entry | 类型 | 描述                                               |
+| ----- | ---- | -------------------------------------------------- |
+| `cn`  | util | Tailwind className 合并工具(clsx + tailwind-merge) |
 
 ### npm 依赖
 
 _无 — 本组件不依赖任何 npm 包。_
+
 <!-- auto:deps:end -->
 
 ## AI 生成纪律

package/src/components/affix/affix.stories.tsx

@@ -10,7 +10,7 @@ const meta: Meta<typeof Affix> = {
     docs: {
       description: {
         component:
-          '滚动吸顶 / 吸底 — 当容器滚出指定偏移时把 children 切换为 position: fixed,保留原占位。基于 scroll 事件 + getBoundingClientRect。等价 antd `Affix`。视觉走 OpenTrek tokens,所有样式来自 `@teamix-evo/design`,无 mock。',
+          '滚动吸顶 / 吸底 — 当容器滚出指定偏移时把 children 切换为 position: fixed,保留原占位。基于 scroll 事件 + getBoundingClientRect。等价 antd `Affix`。',
       },
     },
   },
@@ -45,7 +45,9 @@ export const Bottom: Story = {
   parameters: { controls: { disable: true } },
   render: () => (
     <div className="space-y-3">
-      <div className="h-[600px] rounded-md border bg-muted/30 p-4">向下滚动</div>
+      <div className="h-[600px] rounded-md border bg-muted/30 p-4">
+        向下滚动
+      </div>
       <Affix offsetBottom={24}>
         <div className="rounded-md border bg-card p-3 shadow-sm">
           <Button block>立即提交(吸底)</Button>

package/src/components/alert/alert.meta.md

@@ -1,13 +1,14 @@
 ---
 id: alert
 name: Alert
+displayName: 警告提示
 type: component
 category: feedback
 since: 0.1.0
-package: "@teamix-evo/ui"
+package: '@teamix-evo/ui'
 ---
 
-# Alert
+# Alert 警告提示
 
 静态提示条 — shadcn 简约视觉 + antd 的 `type / showIcon / closable / banner` 并集。
 **inline 形态**,与对话框 / Toast 不同,常驻在页面上方或表单上方。
@@ -29,15 +30,17 @@ package: "@teamix-evo/ui"
 > 以下表格由 `pnpm --filter @teamix-evo/ui gen:meta` 自动生成。
 
 <!-- auto:props:begin -->
-| 名称 | 类型 | 默认值 | 必填 | 说明 |
-| --- | --- | --- | --- | --- |
-| `type` | `'info' \| 'success' \| 'warning' \| 'error'` | `"info"` | – | 类型(antd `type` 并集)— 控制语义色与默认图标。 |
-| `showIcon` | `boolean` | `true` | – | 是否显示图标(antd `showIcon` 并集)。 |
-| `closable` | `boolean` | `false` | – | 是否可关闭,显示右侧 X 按钮(antd `closable` 并集)。 |
-| `onClose` | `() => void` | – | – | 关闭按钮点击回调。 |
-| `banner` | `boolean` | `false` | – | Banner 模式 — 去除横向圆角,沿屏幕宽度铺满,常用于全局公告条。 |
-| `title` | `React.ReactNode` | – | – | 标题(粗体行)。 |
-| `description` | `React.ReactNode` | – | – | 描述(标题下方主体内容)。 |
+
+| 名称          | 类型                                          | 默认值   | 必填 | 说明                                                         |
+| ------------- | --------------------------------------------- | -------- | ---- | ------------------------------------------------------------ |
+| `type`        | `'info' \| 'success' \| 'warning' \| 'error'` | `"info"` | –    | 类型(antd `type` 并集)— 控制语义色与默认图标。               |
+| `showIcon`    | `boolean`                                     | `true`   | –    | 是否显示图标(antd `showIcon` 并集)。                         |
+| `closable`    | `boolean`                                     | `false`  | –    | 是否可关闭,显示右侧 X 按钮(antd `closable` 并集)。           |
+| `onClose`     | `() => void`                                  | –        | –    | 关闭按钮点击回调。                                           |
+| `banner`      | `boolean`                                     | `false`  | –    | Banner 模式 — 去除横向圆角,沿屏幕宽度铺满,常用于全局公告条。 |
+| `title`       | `React.ReactNode`                             | –        | –    | 标题(粗体行)。                                               |
+| `description` | `React.ReactNode`                             | –        | –    | 描述(标题下方主体内容)。                                     |
+
 <!-- auto:props:end -->
 
 ## 依赖
@@ -45,13 +48,14 @@ package: "@teamix-evo/ui"
 > 以下表格由 `pnpm --filter @teamix-evo/ui gen:meta` 自动生成,数据源是 [`manifest.json`](../../../manifest.json)。**手工编辑 marker 之间的内容会在下次生成时被覆盖**。
 
 <!-- auto:deps:begin -->
+
 ### 同库依赖
 
 > `teamix-evo ui add alert` 时,以下 entry 会被自动连带安装(无需手动 add)。
 
-| Entry | 类型 | 描述 |
-| --- | --- | --- |
-| `cn` | util | Tailwind className 合并工具(clsx + tailwind-merge) |
+| Entry | 类型 | 描述                                               |
+| ----- | ---- | -------------------------------------------------- |
+| `cn`  | util | Tailwind className 合并工具(clsx + tailwind-merge) |
 
 ### npm 依赖
 
@@ -60,6 +64,7 @@ package: "@teamix-evo/ui"
 ```bash
 pnpm add class-variance-authority@^0.7.0 lucide-react@^0.460.0
 ```
+
 <!-- auto:deps:end -->
 
 ## AI 生成纪律

package/src/components/alert/alert.stories.tsx

@@ -9,7 +9,7 @@ const meta: Meta<typeof Alert> = {
     docs: {
       description: {
         component:
-          '警告提示 — 在不打断用户操作的前提下展示重要信息。四种语义状态(`info` / `success` / `warning` / `error`)对齐 design 语义色；支持 `showIcon` 状态图标、`closable` 一键关闭、`banner` 顶部业务通告梨式。能力对齐 antd Alert，视觉走 OpenTrek semantic tokens，所有样式来自 `@teamix-evo/design`，无 mock。',
+          '警告提示 — 在不打断用户操作的前提下展示重要信息。四种语义状态(info / success / warning / error)对齐 design 语义色,支持 showIcon 状态图标、closable 一键关闭、banner 顶部业务通告模式。能力对齐 antd Alert。',
       },
     },
   },

package/src/components/alert/alert.tsx

@@ -15,16 +15,16 @@ const alertVariants = cva(
   {
     variants: {
       type: {
-        info: 'border-blue-200 bg-blue-50 text-blue-900 [&>svg]:text-blue-500 dark:border-blue-900/30 dark:bg-blue-950/40 dark:text-blue-100',
+        info: 'border-info-border bg-info-subtle text-info [&>svg]:text-info',
         success:
-          'border-emerald-200 bg-emerald-50 text-emerald-900 [&>svg]:text-emerald-500 dark:border-emerald-900/30 dark:bg-emerald-950/40 dark:text-emerald-100',
+          'border-success-border bg-success-subtle text-success [&>svg]:text-success',
         warning:
-          'border-amber-200 bg-amber-50 text-amber-900 [&>svg]:text-amber-500 dark:border-amber-900/30 dark:bg-amber-950/40 dark:text-amber-100',
+          'border-warning-border bg-warning-subtle text-warning [&>svg]:text-warning',
         error:
-          'border-destructive/30 bg-destructive/10 text-destructive [&>svg]:text-destructive',
+          'border-destructive bg-destructive/10 text-destructive [&>svg]:text-destructive',
       },
       banner: {
-        true: 'rounded-none border-x-0',
+        true: 'rounded-none border-0',
         false: '',
       },
     },

package/src/components/alert-dialog/alert-dialog.meta.md

@@ -1,16 +1,18 @@
 ---
 id: alert-dialog
 name: AlertDialog
+displayName: 确认对话框
 type: component
 category: feedback
 since: 0.1.0
-package: "@teamix-evo/ui"
+package: '@teamix-evo/ui'
 ---
 
-# AlertDialog
+# AlertDialog 确认对话框
 
 阻断式确认对话框 — Radix AlertDialog + antd `Modal.confirm` 并集。
 **与 Dialog 关键差异**:
+
 - 不可点击外部 / ESC 关闭(强制选择 Action / Cancel)
 - 自带 Action / Cancel 子组件,默认走 Button 视觉
 - 无右上角关闭按钮(避免误关)
@@ -34,7 +36,9 @@ package: "@teamix-evo/ui"
 > 以下表格由 `pnpm --filter @teamix-evo/ui gen:meta` 自动生成。下表是 `AlertDialogContent` 的 props;`AlertDialog`(Root)透传 Radix `open / defaultOpen / onOpenChange`。
 
 <!-- auto:props:begin -->
+
 _(no props)_
+
 <!-- auto:props:end -->
 
 ## 依赖
@@ -42,13 +46,14 @@ _(no props)_
 > 以下表格由 `pnpm --filter @teamix-evo/ui gen:meta` 自动生成,数据源是 [`manifest.json`](../../../manifest.json)。**手工编辑 marker 之间的内容会在下次生成时被覆盖**。
 
 <!-- auto:deps:begin -->
+
 ### 同库依赖
 
 > `teamix-evo ui add alert-dialog` 时,以下 entry 会被自动连带安装(无需手动 add)。
 
-| Entry | 类型 | 描述 |
-| --- | --- | --- |
-| `cn` | util | Tailwind className 合并工具(clsx + tailwind-merge) |
+| Entry    | 类型      | 描述                                                                                    |
+| -------- | --------- | --------------------------------------------------------------------------------------- |
+| `cn`     | util      | Tailwind className 合并工具(clsx + tailwind-merge)                                      |
 | `button` | component | 通用按钮 — shadcn 实现 + antd 功能扩展(loading / icon / shape / block / dashed variant) |
 
 ### npm 依赖
@@ -58,6 +63,7 @@ _(no props)_
 ```bash
 pnpm add @radix-ui/react-alert-dialog@^1.1.0
 ```
+
 <!-- auto:deps:end -->
 
 > 子组件:`AlertDialog`(Root)/ `AlertDialogTrigger` / `AlertDialogContent` / `AlertDialogHeader` / `AlertDialogFooter` / `AlertDialogTitle` / `AlertDialogDescription` / `AlertDialogAction` / `AlertDialogCancel`。
@@ -74,9 +80,15 @@ pnpm add @radix-ui/react-alert-dialog@^1.1.0
 
 ```tsx
 import {
-  AlertDialog, AlertDialogTrigger, AlertDialogContent,
-  AlertDialogHeader, AlertDialogTitle, AlertDialogDescription,
-  AlertDialogFooter, AlertDialogAction, AlertDialogCancel,
+  AlertDialog,
+  AlertDialogTrigger,
+  AlertDialogContent,
+  AlertDialogHeader,
+  AlertDialogTitle,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogAction,
+  AlertDialogCancel,
 } from '@/components/ui/alert-dialog';
 import { Button } from '@/components/ui/button';
 import { buttonVariants } from '@/components/ui/button';
@@ -89,7 +101,8 @@ import { buttonVariants } from '@/components/ui/button';
     <AlertDialogHeader>
       <AlertDialogTitle>确认删除项目?</AlertDialogTitle>
       <AlertDialogDescription>
-        将永久删除 <b>"运营后台"</b> 项目及其下 142 个资源。<br />
+        将永久删除 <b>"运营后台"</b> 项目及其下 142 个资源。
+        <br />
         此操作不可撤销。
       </AlertDialogDescription>
     </AlertDialogHeader>
@@ -103,5 +116,5 @@ import { buttonVariants } from '@/components/ui/button';
       </AlertDialogAction>
     </AlertDialogFooter>
   </AlertDialogContent>
-</AlertDialog>
+</AlertDialog>;
 ```

package/src/components/alert-dialog/alert-dialog.stories.tsx

@@ -20,7 +20,7 @@ const meta: Meta<typeof AlertDialogContent> = {
     docs: {
       description: {
         component:
-          '命令式确认弹窗 — 用于高风险操作(删除、不可恢复变更)的二次确认。基于 Radix AlertDialog，语义角色为 `alertdialog`，自动陷阱焦点 + ESC 关闭；Cancel + Action 双按钮范式对齐 antd `Modal.confirm`。视觉走 OpenTrek semantic tokens，所有样式来自 `@teamix-evo/design`，无 mock。',
+          '确认对话框 — 用于高风险操作(删除、不可恢复变更)的二次确认。基于 Radix AlertDialog,自动陷阱焦点 + ESC 关闭；Cancel + Action 双按钮范式对齐 antd Modal.confirm。',
       },
     },
   },

package/src/components/alert-dialog/alert-dialog.tsx

@@ -35,7 +35,7 @@ const AlertDialogContent = React.forwardRef<
     <AlertDialogPrimitive.Content
       ref={ref}
       className={cn(
-        'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 sm:rounded-lg',
+        'fixed left-1/2 top-1/2 z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 sm:rounded-lg',
         className,
       )}
       {...props}

package/src/components/anchor/anchor.meta.md

@@ -1,13 +1,14 @@
 ---
 id: anchor
 name: Anchor
+displayName: 锚点
 type: component
 category: navigation
 since: 0.1.0
-package: "@teamix-evo/ui"
+package: '@teamix-evo/ui'
 ---
 
-# Anchor
+# Anchor 锚点
 
 锚点导航 — antd 独有补足。**等价 antd `Anchor`**。长文档 / 详情页侧边的目录,点击锚点滚动到对应 `id` 节点,滚动时自动高亮当前可见的锚点(IntersectionObserver)。支持嵌套两层缩进。
 
@@ -23,27 +24,35 @@ package: "@teamix-evo/ui"
 - 主导航(顶部 / 侧栏菜单)→ `NavigationMenu` / `Sidebar`
 - 步骤导航(顺序操作)→ `Steps`
 
+## Props
+
 <!-- auto:props:begin -->
-| 名称 | 类型 | 默认值 | 必填 | 说明 |
-| --- | --- | --- | --- | --- |
-| `items` | `AnchorItem[]` | – | ✓ | 锚点项树(antd `items` 并集)。 |
-| `offsetTop` | `number` | `0` | – | 当目标元素距视口顶部小于此值时高亮(IntersectionObserver `rootMargin`)。 |
-| `scrollBehavior` | `'smooth' \| 'auto'` | `"smooth"` | – | 点击锚点平滑滚动行为。 |
-| `onChange` | `(key: string) => void` | – | – | 当前高亮变化回调。 |
+
+| 名称             | 类型                    | 默认值     | 必填 | 说明                                                                    |
+| ---------------- | ----------------------- | ---------- | ---- | ----------------------------------------------------------------------- |
+| `items`          | `AnchorItem[]`          | –          | ✓    | 锚点项树(antd `items` 并集)。                                           |
+| `offsetTop`      | `number`                | `0`        | –    | 当目标元素距视口顶部小于此值时高亮(IntersectionObserver `rootMargin`)。 |
+| `scrollBehavior` | `'smooth' \| 'auto'`    | `"smooth"` | –    | 点击锚点平滑滚动行为。                                                  |
+| `onChange`       | `(key: string) => void` | –          | –    | 当前高亮变化回调。                                                      |
+
 <!-- auto:props:end -->
 
+## 依赖
+
 <!-- auto:deps:begin -->
+
 ### 同库依赖
 
 > `teamix-evo ui add anchor` 时,以下 entry 会被自动连带安装(无需手动 add)。
 
-| Entry | 类型 | 描述 |
-| --- | --- | --- |
-| `cn` | util | Tailwind className 合并工具(clsx + tailwind-merge) |
+| Entry | 类型 | 描述                                               |
+| ----- | ---- | -------------------------------------------------- |
+| `cn`  | util | Tailwind className 合并工具(clsx + tailwind-merge) |
 
 ### npm 依赖
 
 _无 — 本组件不依赖任何 npm 包。_
+
 <!-- auto:deps:end -->
 
 ## AI 生成纪律

package/src/components/anchor/anchor.stories.tsx

@@ -9,7 +9,7 @@ const meta: Meta<typeof Anchor> = {
     docs: {
       description: {
         component:
-          '锚点导航 — 长文档 / 详情页侧边目录,点击滚动到 id 节点,滚动时 IntersectionObserver 自动高亮。等价 antd `Anchor`。视觉走 OpenTrek tokens,所有样式来自 `@teamix-evo/design`,无 mock。',
+          '锚点导航 — 长文档 / 详情页侧边目录,点击滚动到 id 节点,滚动时 IntersectionObserver 自动高亮。等价 antd `Anchor`。',
       },
     },
   },

package/src/components/app/app.meta.md

@@ -4,10 +4,11 @@ name: App
 type: component
 category: shell
 since: 0.1.0
-package: "@teamix-evo/ui"
+package: '@teamix-evo/ui'
+displayName: 应用容器
 ---
 
-# App
+# App 应用容器
 
 应用根容器 — antd 独有补足。**对标 antd `App`** 的核心职责:挂全局 Toaster + 设置 dir / lang + 承载根级 className。**与 antd 区别**:不接管主题(本库主题靠 design tokens / CSS vars,**不引入 runtime ConfigProvider**),也不收敛 `useApp()` hook(toast / notification 直接 import 即可)。
 
@@ -23,27 +24,35 @@ package: "@teamix-evo/ui"
 - 需要 runtime 切换主题色 → 改 CSS variables(design tokens),**不要**通过 ConfigProvider
 - 单独需要 Toaster → 直接挂 `<Toaster />`
 
+## Props
+
 <!-- auto:props:begin -->
-| 名称 | 类型 | 默认值 | 必填 | 说明 |
-| --- | --- | --- | --- | --- |
-| `withToaster` | `boolean` | `true` | – | 是否挂载 `<Toaster />`(antd `App` 内部托管 message / notification 静态实例) — 全应用根挂一次。 |
-| `toasterProps` | `ToasterProps` | – | – | 传递给 Toaster 的配置(位置 / 主题 / 自动关闭等) — 仅 `withToaster=true` 时生效。 |
-| `dir` | `'ltr' \| 'rtl'` | `"ltr"` | – | 文字方向 — 设到根容器的 `dir` 属性,Radix 等组件会自动适配。 |
+
+| 名称           | 类型             | 默认值  | 必填 | 说明                                                                                           |
+| -------------- | ---------------- | ------- | ---- | ---------------------------------------------------------------------------------------------- |
+| `withToaster`  | `boolean`        | `true`  | –    | 是否挂载 `<Toaster />`(antd `App` 内部托管 message / notification 静态实例) — 全应用根挂一次。 |
+| `toasterProps` | `ToasterProps`   | –       | –    | 传递给 Toaster 的配置(位置 / 主题 / 自动关闭等) — 仅 `withToaster=true` 时生效。               |
+| `dir`          | `'ltr' \| 'rtl'` | `"ltr"` | –    | 文字方向 — 设到根容器的 `dir` 属性,Radix 等组件会自动适配。                                    |
+
 <!-- auto:props:end -->
 
+## 依赖
+
 <!-- auto:deps:begin -->
+
 ### 同库依赖
 
 > `teamix-evo ui add app` 时,以下 entry 会被自动连带安装(无需手动 add)。
 
-| Entry | 类型 | 描述 |
-| --- | --- | --- |
-| `cn` | util | Tailwind className 合并工具(clsx + tailwind-merge) |
+| Entry    | 类型      | 描述                                                                                              |
+| -------- | --------- | ------------------------------------------------------------------------------------------------- |
+| `cn`     | util      | Tailwind className 合并工具(clsx + tailwind-merge)                                                |
 | `sonner` | component | Toast 通知 — sonner 包装,等价 antd message + notification 并集(toast() 函数式 API + Toaster 容器) |
 
 ### npm 依赖
 
 _无 — 本组件不依赖任何 npm 包。_
+
 <!-- auto:deps:end -->
 
 ## AI 生成纪律

package/src/components/app/app.stories.tsx

@@ -12,7 +12,7 @@ const meta: Meta<typeof App> = {
     docs: {
       description: {
         component:
-          '应用根容器 — 挂全局 Toaster + 设置 dir / lang + 承载根级 className。对标 antd `App`,但不接管主题(主题靠 design tokens / CSS vars),也不收敛 useApp() hook。视觉走 OpenTrek tokens,所有样式来自 `@teamix-evo/design`,无 mock。',
+          '应用根容器 — 挂全局 Toaster + 设置 dir / lang + 承载根级 className。对标 antd `App`，但不接管主题（主题靠 design tokens / CSS vars），也不收敛 useApp() hook。',
       },
     },
   },
@@ -30,7 +30,9 @@ export const Playground: Story = {
   render: (args) => (
     <App {...args} className="rounded-md border p-6">
       <div className="flex flex-col gap-3">
-        <span className="text-sm text-muted-foreground">App 内挂载了 Toaster,可直接触发:</span>
+        <span className="text-sm text-muted-foreground">
+          App 内挂载了 Toaster,可直接触发:
+        </span>
         <div className="flex gap-2">
           <Button onClick={() => toast.success('已保存')}>触发 toast</Button>
           <Button

package/src/components/aspect-ratio/aspect-ratio.meta.md

@@ -1,13 +1,14 @@
 ---
 id: aspect-ratio
 name: AspectRatio
+displayName: 宽高比
 type: component
 category: foundation
 since: 0.1.0
-package: "@teamix-evo/ui"
+package: '@teamix-evo/ui'
 ---
 
-# AspectRatio
+# AspectRatio 宽高比
 
 容器保持宽高比 — 基于 `@radix-ui/react-aspect-ratio`,内部用 padding-bottom 技巧实现,**无 layout shift**。
 shadcn-only,antd 无对标。
@@ -28,9 +29,11 @@ shadcn-only,antd 无对标。
 > 以下表格由 `pnpm --filter @teamix-evo/ui gen:meta` 自动生成。
 
 <!-- auto:props:begin -->
-| 名称 | 类型 | 默认值 | 必填 | 说明 |
-| --- | --- | --- | --- | --- |
-| `ratio` | `number` | `1` | – | 宽高比 = 宽 / 高(必传)。常见值:`16 / 9` / `4 / 3` / `1` / `9 / 16`。 |
+
+| 名称    | 类型     | 默认值 | 必填 | 说明                                                                 |
+| ------- | -------- | ------ | ---- | -------------------------------------------------------------------- |
+| `ratio` | `number` | `1`    | –    | 宽高比 = 宽 / 高(必传)。常见值:`16 / 9` / `4 / 3` / `1` / `9 / 16`。 |
+
 <!-- auto:props:end -->
 
 ## 依赖
@@ -38,6 +41,7 @@ shadcn-only,antd 无对标。
 > 以下表格由 `pnpm --filter @teamix-evo/ui gen:meta` 自动生成,数据源是 [`manifest.json`](../../../manifest.json)。**手工编辑 marker 之间的内容会在下次生成时被覆盖**。
 
 <!-- auto:deps:begin -->
+
 ### 同库依赖
 
 _无 — 本组件不依赖其他 ui entry。_
@@ -49,6 +53,7 @@ _无 — 本组件不依赖其他 ui entry。_
 ```bash
 pnpm add @radix-ui/react-aspect-ratio@^1.1.0
 ```
+
 <!-- auto:deps:end -->
 
 > 透传所有 `<div>` 原生属性。`ratio: number` 是最关键的 prop(必传),如 `16 / 9` / `4 / 3` / `1`。

package/src/components/aspect-ratio/aspect-ratio.stories.tsx

@@ -9,7 +9,7 @@ const meta: Meta<typeof AspectRatio> = {
     docs: {
       description: {
         component:
-          '宽高比容器 — 强制子元素按指定比例渲染，常用于图片 / 视频 / iframe 等响应式封面容器。基于 Radix AspectRatio，通过 `ratio` prop 传入任意宽高比(如 16/9、4/3、1)。shadcn 专有，填补了 antd 未提供的纯布局能力。视觉走 OpenTrek semantic tokens，所有样式来自 `@teamix-evo/design`，无 mock。',
+          '宽高比容器 — 强制子元素按指定比例渲染，常用于图片 / 视频 / iframe 等响应式封面容器。基于 Radix AspectRatio，通过 `ratio` prop 传入任意宽高比。shadcn 专有，填补了 antd 未提供的纯布局能力。',
       },
     },
   },