create-yss-spec 3.3.1 → 3.3.3

package/template/.claude/skills/yss-ui/assets/docs/guide/monorepo-versioning.md

@@ -1,149 +0,0 @@
-# Monorepo 版本管理说明
-
-## ⚠️ 当前方案的限制
-
-### 问题：所有包同步发版
-
-当前我们使用 `standard-version` 配置了统一的版本管理，这导致：
-
-```javascript
-// .versionrc.js
-bumpFiles: [
-  { filename: 'package.json' },
-  { filename: 'packages/components/package.json' },  // ← 所有包
-  { filename: 'packages/hooks/package.json' },       // ← 都会同步
-  { filename: 'packages/utils/package.json' },       // ← bump 版本
-  { filename: 'packages/theme/package.json' },
-]
-```
-
-**影响**：
-- ✅ 优点：版本号统一管理，简单清晰
-- ❌ 缺点：即使只修改了 `hooks`，`components`、`utils` 等所有包的版本号都会一起更新
-
-### 示例
-
-```bash
-# 提交了一个 hooks 的新功能
-git commit -m "feat(hooks): useFullscreen 新增功能"
-
-# 执行发版后
-pnpm release:minor
-
-# 结果：所有包版本号都从 1.0.3 升级到 1.0.4
-- @yss-ui/components: 1.0.3 → 1.0.4  (但实际没有修改)
-- @yss-ui/hooks: 1.0.3 → 1.0.4       (实际修改的包)
-- @yss-ui/utils: 1.0.3 → 1.0.4       (但实际没有修改)
-```
-
----
-
-## 💡 解决方案（可选）
-
-如果需要独立管理各个包的版本号，有以下选择：
-
-### 方案 1：使用 Lerna + Conventional Commits
-
-```bash
-# 安装 Lerna
-pnpm add -D lerna
-
-# 配置 lerna.json
-{
-  "version": "independent",  // 独立版本模式
-  "command": {
-    "version": {
-      "conventionalCommits": true,
-      "message": "chore(release): publish"
-    }
-  }
-}
-
-# 发版命令
-lerna version --conventional-commits
-```
-
-**特点**：
-- ✅ 只更新有变更的包
-- ✅ 自动生成 CHANGELOG
-- ✅ 支持独立版本号
-- ❌ 配置相对复杂
-
-### 方案 2：使用 Changeset
-
-```bash
-# 安装 Changeset
-pnpm add -D @changesets/cli
-
-# 初始化
-pnpm changeset init
-
-# 工作流
-pnpm changeset       # 创建变更文件
-pnpm changeset version  # 消费变更并 bump 版本
-pnpm changeset publish  # 发布包
-```
-
-**特点**：
-- ✅ 精确控制哪些包需要发版
-- ✅ 支持独立版本号
-- ✅ 社区广泛使用
-- ❌ 需要手动创建 changeset 文件
-
-### 方案 3：保持当前方案（推荐 ⭐）
-
-如果你们的发版策略是：
-- 各个包通常一起发版
-- 版本号保持同步
-- 简化管理流程
-
-那么 **当前方案已经足够**，无需改动。
-
----
-
-## 🔧 当前方案的使用建议
-
-### 1. 版本号语义
-
-即使所有包都同步 bump，但更新日志中会清晰标注哪个包有真实变更：
-
-```markdown
-## v1.0.4
-
-### ✨ Features
-- **[@yss-ui/hooks]** useFullscreen: 新增 Esc 键提示功能
-
-### 🐞 Bug Fixes
-(empty - components 和 utils 没有实际变更)
-```
-
-### 2. 发版时机
-
-建议按照实际需求发版：
-- **Patch** (1.0.0 → 1.0.1)：Bug 修复
-- **Minor** (1.0.0 → 1.1.0)：新功能
-- **Major** (1.0.0 → 2.0.0)：破坏性更新
-
-### 3. npm 发布策略
-
-如果发布到 npm，可以配置 Lerna 的 `--force-publish` 避免发布没有变更的包：
-
-```bash
-# 只发布有变更的包
-lerna publish from-package --no-git-tag-version
-```
-
----
-
-## 📝 总结
-
-| 方案 | 版本管理 | 复杂度 | 适用场景 |
-|------|---------|--------|---------|
-| **当前方案** (standard-version) | 统一版本号 | ⭐ 简单 | 各包同步发版 |
-| **Lerna** | 独立版本号 | ⭐⭐⭐ 中等 | 需要独立管理版本 |
-| **Changeset** | 独立版本号 | ⭐⭐⭐⭐ 复杂 | 精确控制发版范围 |
-
-**建议**：
-- 如果当前工作流没有问题，保持现状即可
-- 如果需要独立版本管理，可以考虑引入 Changeset
-- 定期检查发版日志，确保每次发版都有相应的代码变更

package/template/.claude/skills/yss-ui/assets/docs/guide/release-workflow.md

@@ -1,251 +0,0 @@
-# YSS UI 发版工作流指南
-
-## 📋 Commit Message 规范（必须遵守）
-
-### 格式
-
-```
-<type>(<scope>): <subject>
-
-[可选的 body]
-
-[可选的 footer]
-```
-
-### Type 类型
-
-| Type | Emoji | 说明 | 示例 |
-|------|-------|------|------|
-| `feat` | ✨ | 新功能 | `feat(@yss-ui/components): Table 新增远程筛选功能` |
-| `fix` | 🐞 | Bug 修复 | `fix(@yss-ui/hooks): useFullscreen 修复 iOS 兼容性` |
-| `docs` | 📝 | 文档更新 | `docs(components): 更新 Table 组件文档` |
-| `style` | 💅 | 代码格式 | `style(@yss-ui/components): 统一组件代码缩进` |
-| `refactor` | 🛠 | 重构 | `refactor(@yss-ui/hooks): 优化 useLoading 实现` |
-| `perf` | ⚡ | 性能优化 | `perf(@yss-ui/utils): 优化 formatDate 性能` |
-| `test` | ✅ | 测试 | `test(@yss-ui/components): 添加 Table 单元测试` |
-| `build` | 📦 | 构建系统 | `build: 升级 vite 到 5.0` |
-| `ci` | 🔧 | CI 配置 | `ci: 更新 GitLab CI 配置` |
-| `chore` | 🔨 | 其他 | `chore: 更新依赖包` |
-
-### Scope 范围
-
-- `@yss-ui/components` 或 `components` - 组件库
-- `@yss-ui/hooks` 或 `hooks` - Hooks 库
-- `@yss-ui/utils` 或 `utils` - 工具库
-- `@yss-ui/theme` 或 `theme` - 主题配置
-- `docs` - 文档
-- `scripts` - 脚本
-- `config` - 配置文件
-- `deps` - 依赖更新
-
-### 示例
-
-**✅ 正确示例**：
-
-```bash
-# 新功能
-git commit -m "feat(@yss-ui/components): Table 支持虚拟滚动"
-git commit -m "feat(@yss-ui/hooks): 新增 useDebounce Hook"
-
-# Bug 修复
-git commit -m "fix(@yss-ui/components): Table 修复空数据时的报错"
-git commit -m "fix(@yss-ui/utils): formatDate 修复时区问题"
-
-# 文档更新
-git commit -m "docs(components): 更新 Table API 文档"
-git commit -m "docs(hooks): 添加 useFullscreen 使用示例"
-
-# 重构
-git commit -m "refactor(@yss-ui/hooks): useLoading 采用模块化结构"
-
-# 多行 commit message（使用编辑器）
-```
-feat(@yss-ui/components): Table 新增远程筛选功能
-
-- 支持服务端分页
-- 支持多字段筛选
-- 新增 filterMethod 配置项
-
-Closes #123
-```
-```
-
-**❌ 错误示例**：
-
-```bash
-# 缺少 scope
-git commit -m "feat: 添加新功能"
-
-# type 错误
-git commit -m "add: 新增功能"
-
-# scope 不在枚举中
-git commit -m "feat(table): 新增功能"
-
-# 以句号结尾
-git commit -m "feat(@yss-ui/components): 新增功能。"
-```
-
----
-
-## 🚀 发版流程
-
-### 本地发版（推荐）
-
-```bash
-# 步骤 1: 确保本地代码最新
-git pull origin main
-
-# 步骤 2: 选择发版类型
-
-# 发布补丁版本 (1.0.0 -> 1.0.1) - 修复 bug
-pnpm release:patch
-
-# 发布次版本 (1.0.0 -> 1.1.0) - 新增功能，向下兼容
-pnpm release:minor
-
-# 发布主版本 (1.0.0 -> 2.0.0) - 破坏性更新
-pnpm release:major
-
-# 首次发版（不改变版本号，只生成日志和 tag）
-pnpm release:first
-
-# 步骤 3: 脚本自动执行以下操作
-# - 根据 commit 历史生成 docs/changelog.md
-# - bump 所有 package.json 的版本号
-# - 创建 git commit 和 tag
-# - 等待你确认推送
-
-# 步骤 4: 检查生成的日志
-git diff HEAD~1 docs/changelog.md
-
-# 步骤 5: 如果满意，推送到远程
-git push --follow-tags origin main
-
-# 步骤 6: 在 GitLab UI 点击「手动发版」按钮触发 CI/CD
-```
-
-### GitLab CI 自动发版
-
-如果配置了 GitLab CI，可以自动化整个流程：
-
-```yaml
-# .gitlab-ci.yml 示例
-release:
-  stage: release
-  only:
-    - main
-  when: manual
-  script:
-    - git config user.name "GitLab CI"
-    - git config user.email "ci@gitlab.com"
-    - pnpm release  # 自动检测版本类型
-    - git push --follow-tags origin main
-```
-
----
-
-## 📝 更新日志管理
-
-### 自动生成规则
-
-standard-version 会根据 commit message 自动生成更新日志：
-
-1. **Type 映射**：
-   - `feat` → ✨ Features
-   - `fix` → 🐞 Bug Fixes
-   - `docs` → 📝 Documentation
-   - `refactor` → 🛠 Refactoring
-   - `style` → 💅 Style
-
-2. **Scope 转换**：
-   - `@yss-ui/components` → `[@yss-ui/components]`
-   - `components` → `[@yss-ui/components]`
-   - `@yss-ui/hooks` → `[@yss-ui/hooks]`
-   - `hooks` → `[@yss-ui/hooks]`
-
-3. **分包日志**：
-   - 自动从综合日志提取各包的更新
-   - 生成 `docs/changelog/{components,hooks,utils}.md`
-
-### 手动调整日志
-
-如果自动生成的日志需要调整：
-
-```bash
-# 1. 发版后手动编辑综合日志
-vim docs/changelog.md
-
-# 2. 手动更新分包日志
-vim docs/changelog/hooks.md
-vim docs/changelog/components.md
-vim docs/changelog/utils.md
-
-# 3. 修正 commit（如果还没推送）
-git add docs/changelog*
-git commit --amend --no-edit
-
-# 4. 推送
-git push --follow-tags origin main
-```
-
----
-
-## 🔧 常见问题
-
-### Q: Commit message 格式错误怎么办？
-
-A: Husky 的 commit-msg hook 会自动检查格式，不符合规范的 commit 会被拒绝：
-
-```bash
-$ git commit -m "add new feature"
-⧗   input: add new feature
-✖   subject may not be empty [subject-empty]
-✖   type may not be empty [type-empty]
-```
-
-修正方式：
-```bash
-git commit -m "feat(@yss-ui/components): Table 新增远程筛选功能"
-```
-
-### Q: 如何撤销错误的发版？
-
-A: 使用 Git 回退：
-
-```bash
-# 回退到上一个版本
-git reset --hard HEAD~1
-
-# 删除错误的 tag
-git tag -d v1.0.1
-git push origin :refs/tags/v1.0.1
-```
-
-### Q: 如何跳过某些 commit？
-
-A: 在 commit message 中添加 `[skip ci]` 或使用 `chore` type：
-
-```bash
-git commit -m "chore: 更新 README (不会出现在 changelog 中)"
-```
-
-### Q: 如何添加 Breaking Changes？
-
-A: 在 commit message 中添加 `BREAKING CHANGE:`：
-
-```bash
-git commit -m "feat(@yss-ui/components): 重构 Table API
-
-BREAKING CHANGE: `columns` 属性不再支持字符串数组
-"
-```
-
----
-
-## 📚 参考资源
-
-- [Conventional Commits 规范](https://www.conventionalcommits.org/)
-- [Semantic Versioning](https://semver.org/lang/zh-CN/)
-- [standard-version 文档](https://github.com/conventional-changelog/standard-version)
-- [commitlint 文档](https://commitlint.js.org/)

package/template/.claude/skills/yss-ui/assets/docs/hooks/use-table-height.md

@@ -1,101 +0,0 @@
----
-title: useTableHeight
-description: 动态计算表格高度的 Hook
-toc: content
----
-
-# useTableHeight
-
-用于动态计算 `YTable` 或 `YEditTable` 的高度，使其在 Flex 容器中自适应。
-自动处理窗口缩放及容器尺寸变化，支持自动减去分页、工具栏等预设高度。
-
-## 核心思路
-
-Hook 通过 `ResizeObserver` 监听传入的父容器（`tableAreaRef`）高度，并根据配置减去内部固定元素（如分页、工具栏）的高度，从而计算出表格主体的精确 `height`。
-
-```
-容器 (固定高度/flex:1)
-├── 工具栏 (可选，Hook 可自动减去高度)
-├── 表格主体 (height = 容器高度 - 偏移量)
-└── 分页 (可选，Hook 可自动减去高度)
-```
-
-## 代码演示
-
-### 基础布局 (Flex)
-
-最常见的场景：页面整体采用 Flex 布局，表格占据中间剩余空间。
-使用 `withPagination` 和 `withToolbar` 自动扣除对应高度。
-
-<code id="flex-layout" src="./demos/useTableHeight/flex-layout/index.vue"></code>
-
-### 弹窗场景 (Modal)
-
-在 Modal 中固定内容高度，让表格撑满弹窗主体。
-
-<code id="in-modal" src="./demos/useTableHeight/in-modal/index.vue"></code>
-
-### 抽屉场景 (Drawer)
-
-在侧边抽屉中展示长列表，高度随抽屉高度自适应。
-
-<code id="in-drawer" src="./demos/useTableHeight/in-drawer/index.vue"></code>
-
-## API
-
-```typescript
-const { tableHeight, isReady, recalculateHeight } = useTableHeight(tableAreaRef, options?);
-```
-
-### Params
-
-| 参数         | 说明                                                                 | 类型                                                  | 默认值 |
-| ------------ | -------------------------------------------------------------------- | ----------------------------------------------------- | ------ |
-| tableAreaRef | 表格父容器引用，支持原生 DOM 或 Vue 组件实例（如 YCard） | `Ref<HTMLElement \| ComponentPublicInstance \| undefined>` | -      |
-| options      | 配置选项                                                             | `UseTableHeightOptions`                               | -      |
-
-> [!TIP]
-> 当 `ref` 绑定到 `YCard` 或 `AntCard` 组件时，Hook 会自动获取其内部的 `.ant-card-body` 元素进行高度计算，无需额外配置。
-
-### UseTableHeightOptions
-
-| 参数             | 说明                                                       | 类型      | 默认值  |
-| ---------------- | ---------------------------------------------------------- | --------- | ------- |
-| minHeight        | 最小高度限制                                               | `number`  | `200`   |
-| defaultHeight    | 初始默认高度                                               | `number`  | `400`   |
-| extraOffset      | 额外偏移量（用于边框、padding 等微调）                     | `number`  | `0`     |
-| withPagination   | 是否包含分页（减去 48px）                                  | `boolean` | `false` |
-| paginationHeight | 自定义分页高度，覆盖默认 48px                              | `number`  | -       |
-| withToolbar      | 是否包含工具栏（减去 48px）                                | `boolean` | `false` |
-| toolbarHeight    | 自定义工具栏高度，覆盖默认 48px                            | `number`  | -       |
-| withAddButton    | 是否包含添加按钮（减去 40px，仅 EditTable）                | `boolean` | `false` |
-| addButtonHeight  | 自定义添加按钮高度，覆盖默认 40px                          | `number`  | -       |
-
-### UseTableHeightReturn
-
-| 参数              | 说明                                                   | 类型            |
-| ----------------- | ------------------------------------------------------ | --------------- |
-| tableHeight       | 响应式的表格高度值                                     | `Ref<number>`   |
-| isReady           | 高度是否已计算完成，可用于条件渲染或加载状态判断       | `Ref<boolean>`  |
-| recalculateHeight | 手动重新计算高度（通常不需要，Hook 会自动监听）        | `() => void`    |
-
-## 最佳实践与注意事项
-
-1.  **容器样式**：`tableAreaRef` 指向的容器通常需要设置 `flex: 1` 和 `overflow: hidden`，以确保它能正确占据剩余空间且被 `ResizeObserver` 监听。
-
-2.  **支持组件 ref**：可以直接将 `ref` 绑定到 Vue 组件上，Hook 会自动获取其根 DOM 元素：
-    ```
-    <!-- 两种写法都支持 -->
-    <div ref="tableRef">...</div>
-    <YCard ref="tableRef">...</YCard>
-    ```
-
-3.  **高度传递**：计算出的 `tableHeight` 应直接传递给 `YTable` 或 `YEditTable` 的 `height` 属性。
-
-4.  **预设高度**：
-    - `withPagination`: 对应 `YTable` 内部的分页区域（默认 48px）
-    - `withToolbar`: 对应 `YTable` 顶部的工具栏（默认 48px）
-    - 如需自定义高度，使用 `paginationHeight` / `toolbarHeight` 覆盖默认值
-    - 如果使用非内置的自定义区域，建议将其放在 `tableAreaRef` 容器之外
-
-5.  **边界处理**：当容器高度极小时（如用户极端缩小窗口），Hook 会优先保证分页/工具栏可见，而非强制 `minHeight`，避免分页被遮挡。

package/template/.claude/skills/yss-ui/assets/docs/hooks/use-tree-height.md

@@ -1,115 +0,0 @@
----
-title: useTreeHeight
-description: 动态计算虚拟滚动树组件高度的 Hook
-toc: content
----
-
-# useTreeHeight
-
-动态计算虚拟滚动树组件的可用高度，支持响应式监听容器尺寸变化。
-
-## 核心思路
-
-**使用 flex 布局让树区域自动填充剩余空间**，Hook 直接监听树区域高度，无需手动计算 offset：
-
-```
-容器 (固定高度 + flex 布局)
-├── 头部（搜索框、下拉框等）
-├── 树区域 (flex: 1, ref 传给 hook) ← Hook 监听这里
-└── 底部（操作按钮等）
-```
-
-## 代码演示
-
-### 基础用法
-
-使用 `ref` 指向树区域，Hook 自动监听其高度变化。
-
-<code id="demo1-basic" src="./demos/useTreeHeight/demo1-basic/index.vue"></code>
-
-### 头部 + 树区域
-
-展示带搜索框头部的常见布局，树区域使用 `flex: 1` 自动填充。
-
-<code id="demo2-ytree" src="./demos/useTreeHeight/demo2-ytree/index.vue"></code>
-
-### 头部 + 树区域 + 底部
-
-展示更复杂的三段式布局：头部下拉框 + 树区域 + 底部操作按钮。
-
-<code id="demo3-offset" src="./demos/useTreeHeight/demo3-offset/index.vue"></code>
-
-## API
-
-```typescript
-const { treeHeight, recalculateHeight } = useTreeHeight(treeAreaRef, options?);
-```
-
-### Params
-
-| 参数        | 说明                                      | 类型                               | 默认值 |
-| ----------- | ----------------------------------------- | ---------------------------------- | ------ |
-| treeAreaRef | 树区域 DOM 引用（建议使用 flex:1 自动填充） | `Ref<HTMLDivElement \| undefined>` | -      |
-| options     | 配置选项                                  | `UseTreeHeightOptions`             | -      |
-
-### UseTreeHeightOptions
-
-| 参数        | 说明                                   | 类型     | 默认值 |
-| ----------- | -------------------------------------- | -------- | ------ |
-| minHeight   | 最小高度限制                           | `number` | `200`  |
-| defaultHeight | 初始默认高度                         | `number` | `400`  |
-| extraOffset | 额外偏移量（用于边框、padding 等微调） | `number` | `0`    |
-
-### UseTreeHeightReturn
-
-| 参数              | 说明             | 类型          |
-| ----------------- | ---------------- | ------------- |
-| treeHeight        | 响应式的树高度值 | `Ref<number>` |
-| recalculateHeight | 手动重新计算高度 | `() => void`  |
-
-## 最佳实践
-
-### 推荐布局结构
-
-```
-<template>
-  <div class="container" style="height: 400px; display: flex; flex-direction: column;">
-    <!-- 头部区域：固定高度 -->
-    <div class="header">下拉框、搜索框</div>
-
-    <!-- 树区域：flex: 1 自动填充，ref 传给 hook -->
-    <div ref="treeAreaRef" style="flex: 1; overflow: hidden;">
-      <YTree :height="treeHeight" :filterable="false" :tree-data="treeData" />
-    </div>
-
-    <!-- 底部区域：固定高度（可选） -->
-    <div class="footer">操作按钮</div>
-  </div>
-</template>
-```
-
-### 注意事项
-
-1. **容器需要固定高度**：确保最外层容器有明确的高度（如 `height: 400px` 或 `height: 100%`）。
-
-2. **树区域使用 flex: 1**：让树区域自动填充剩余空间，Hook 监听这个区域的高度。
-
-3. **YTree 自带搜索框处理**：
-   - 如果自定义了头部搜索框，建议设置 `:filterable="false"` 禁用 YTree 内置搜索。
-   - 如果需要使用 YTree 内置搜索框，可使用 `extraOffset: YTREE_SEARCH_HEIGHT`（48px）扣除内部搜索框高度。
-
-4. **响应式监听**：Hook 内部使用 `ResizeObserver` 监听容器尺寸变化，无需手动触发。
-
-5. **手动触发**：特殊场景可调用 `recalculateHeight()` 手动触发计算。
-
-## 导出常量
-
-```typescript
-import { useTreeHeight, YTREE_SEARCH_HEIGHT } from '@yss-ui/hooks';
-
-// YTREE_SEARCH_HEIGHT = 48，YTree 内置搜索框的固定高度
-const { treeHeight } = useTreeHeight(treeAreaRef, {
-  extraOffset: YTREE_SEARCH_HEIGHT, // 当 YTree 启用 filterable 时使用
-});
-```
-