Files

49 lines
1.4 KiB
Markdown
Raw Permalink Normal View History

2026-05-31 09:36:23 +08:00
# Pika 开发约定
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
## 目录结构
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
- 组件目录使用 **kebab-case**`display/avatar/``entry/tree-select/`
- 组件文件使用 **PascalCase**`Avatar.tsx`
- 每个组件目录包含:`*.tsx``*.module.css``index.ts``*.test.tsx`
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
## 导出规范
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
- 组件 TSX 使用 **named export**
- barrel `index.ts` 统一 re-export 类型与组件
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
## Props 规范
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
- 接口中只声明**已实现**的 props,避免 AI 生成无效代码
- 暂未实现的 API 不要提前写入类型定义
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
## 样式规范
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
| 层级 | 前缀 | 示例 |
|------|------|------|
| 全局 token | `--nv-` | `--nv-color-primary` |
| 组件动态值 | `--_*` | `--_height``--_padding` |
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
- 优先使用 CSS Module + `var(--nv-*)`
- className 拼接使用 `cn()` from `shared/utils/classNames`
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
## 共享层
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
| 模块 | 用途 |
2026-05-28 14:18:56 +08:00
|------|------|
2026-05-31 09:36:23 +08:00
| `shared/hooks/useControllableState` | 受控/非受控状态 |
| `shared/hooks/usePikaContext` | ConfigProvider 上下文 |
| `shared/hooks/useClickOutside` | 下拉/浮层点击外部关闭 |
| `shared/overlay/useOverlay` | Tooltip/Popover 浮层逻辑 |
| `shared/utils/cn` | className 合并 |
| `shared/utils/getSemanticProps` | semantic DOM 样式 |
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
## 类型
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
- 统一使用 `PikaSize``PikaStatus``shared/types/common.ts`
- Entry 组件通过 `DataEntrySize` / `DataEntryStatus` 别名引用
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
## 测试
2026-05-28 14:18:56 +08:00
2026-05-31 09:36:23 +08:00
- 每个主组件至少一个 `*.test.tsx`
- 测试交互行为,而非实现细节