zen-gitsync 2.7.16 → 2.8.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zen-gitsync",
-  "version": "2.7.16",
+  "version": "2.8.2",
   "description": "一个 git 提交的工具",
   "main": "index.js",
   "type": "module",

package/scripts/README_COLOR_CONVERTER.md

@@ -0,0 +1,196 @@
+# 颜色值转换工具使用说明
+
+## 功能说明
+
+该脚本将项目中硬编码的十六进制颜色值转换为标准的 CSS 变量引用。
+
+## 颜色映射规则
+
+基于项目中的 `src/ui/client/src/styles/variables.scss` 定义：
+
+### 主色调
+- `#409eff` → `var(--color-primary)`
+- `#5a67d8`, `#66b1ff` → `var(--color-primary-light)`
+- `#337ecc` → `var(--color-primary-dark)`
+
+### 成功色
+- `#67c23a` → `var(--color-success)`
+- `#10b981` → `var(--color-success-light)`
+
+### 警告色
+- `#e6a23c` → `var(--color-warning)`
+- `#f59e0b` → `var(--color-warning-light)`
+
+### 危险色
+- `#f56c6c` → `var(--color-danger)`
+- `#ef4444` → `var(--color-danger-light)`
+- `#dc2626` → `var(--color-danger-dark)`
+
+### 信息色
+- `#909399` → `var(--color-info)`
+- `#8b5cf6` → `var(--color-info-light)`
+
+### 文字颜色
+- `#303133` → `var(--text-primary)`
+- `#606266` → `var(--text-secondary)`
+- `#909399` → `var(--text-tertiary)`
+- `#c0c4cc`, `#a8abb2` → `var(--text-placeholder)`
+
+### Git 状态颜色
+- `#10b981` → `var(--git-status-added)`
+- `#f59e0b` → `var(--git-status-modified)`
+- `#ef4444` → `var(--git-status-deleted)`
+- `#8b5cf6` → `var(--git-status-untracked)`
+
+## 使用方法
+
+### 预览模式（推荐先运行）
+
+```bash
+# 预览将要进行的更改，不修改文件
+node scripts/convert-colors-to-vars.cjs --dry-run
+```
+
+### 实际应用
+
+```bash
+# 应用更改到文件
+node scripts/convert-colors-to-vars.cjs
+```
+
+## 转换示例
+
+**转换前：**
+```vue
+<style>
+.button {
+  background: #409eff;
+  color: #ffffff;
+  border: 1px solid #66b1ff;
+}
+
+.success-button {
+  background: #67c23a;
+}
+
+.text {
+  color: #303133;
+}
+</style>
+```
+
+**转换后：**
+```vue
+<style>
+.button {
+  background: var(--color-primary);
+  color: var(--color-white);
+  border: 1px solid var(--color-primary-light);
+}
+
+.success-button {
+  background: var(--color-success);
+}
+
+.text {
+  color: var(--text-primary);
+}
+</style>
+```
+
+## 支持的文件类型
+
+- `.vue` - Vue 单文件组件
+- `.scss` - Sass 样式文件
+- `.css` - 纯 CSS 文件
+
+## 跳过的文件
+
+脚本会自动跳过以下文件（这些文件定义了变量本身）：
+- `variables.scss`
+- `dark-theme.scss`
+
+同时自动跳过以下目录：
+- `node_modules`
+- `.git`
+- `dist`
+
+## 输出报告
+
+执行完成后会显示详细的统计报告：
+
+```
+📊 转换统计报告
+============================================================
+总文件数: 150
+修改文件数: 42
+总替换次数: 289
+
+📋 替换详情:
+  #409eff => var(--color-primary): 78 次
+  #67c23a => var(--color-success): 45 次
+  #f56c6c => var(--color-danger): 32 次
+  ...
+
+⚠️  未映射的颜色（需要手动检查）:
+  #f8faff
+  #eef4ff
+  ...
+```
+
+## 注意事项
+
+1. **备份建议**：运行脚本前建议先使用 `--dry-run` 参数预览更改
+2. **Git 提交**：建议在运行前提交当前代码，方便回滚
+3. **未映射颜色**：脚本会列出未映射的颜色，需要手动检查这些颜色是否需要添加到映射表
+4. **特殊颜色**：某些渐变色或特殊效果的颜色可能需要保留原值
+5. **rgba 颜色**：当前脚本仅处理十六进制颜色值，rgba 格式需要手动处理
+
+## 优势
+
+使用 CSS 变量替代硬编码颜色的好处：
+
+1. **统一管理**：所有颜色在 `variables.scss` 中统一定义
+2. **主题切换**：轻松实现深色主题等样式变体
+3. **易于维护**：修改变量值即可全局更新
+4. **语义化**：变量名更具可读性（如 `--color-success` vs `#67c23a`）
+5. **一致性**：确保整个项目使用统一的配色方案
+
+## 扩展映射表
+
+如果发现新的颜色值需要映射，编辑脚本中的 `COLOR_MAP` 对象：
+
+```javascript
+const COLOR_MAP = {
+  // 添加新的映射
+  '#your-color': 'var(--your-variable)',
+  // ...
+};
+```
+
+## 回滚方法
+
+如果需要回滚更改：
+
+```bash
+# 如果还未提交
+git checkout -- src/
+
+# 如果已提交
+git revert <commit-hash>
+```
+
+## 与其他脚本配合
+
+该脚本可以与其他样式标准化脚本配合使用：
+
+```bash
+# 1. 转换间距值
+node scripts/convert-spacing-to-vars.cjs
+
+# 2. 转换圆角和阴影
+node scripts/convert-to-standard-vars.js
+
+# 3. 转换颜色值
+node scripts/convert-colors-to-vars.cjs
+```

package/scripts/README_FONTSIZE_CONVERTER.md

@@ -0,0 +1,278 @@
+# 字体大小转换工具使用说明
+
+## 功能说明
+
+该脚本将项目中硬编码的 `font-size` 值转换为标准的 CSS 变量引用。
+
+## 字体大小映射规则
+
+基于项目中的 `src/ui/client/src/styles/variables.scss` 定义：
+
+### 标准字体大小
+
+| 原值 | 映射变量 | 说明 |
+|------|---------|------|
+| `10px` | `var(--font-size-xs)` | 超小字体 |
+| `12px` | `var(--font-size-sm)` | 小字体 |
+| `13px` | `var(--font-size-sm)` | 映射到小字体 |
+| `14px` | `var(--font-size-base)` | 基础字体 |
+| `15px` | `var(--font-size-base)` | 映射到基础字体 |
+| `16px` | `var(--font-size-md)` | 中等字体 |
+| `18px` | `var(--font-size-lg)` | 大字体 |
+| `20px` | `var(--font-size-xl)` | 超大字体 |
+| `22px` | `var(--font-size-2xl)` | 2倍大字体 |
+| `24px` | `var(--font-size-3xl)` | 3倍大字体 |
+
+### rem 单位支持
+
+| 原值 | 映射变量 | 等效 px |
+|------|---------|---------|
+| `0.625rem` | `var(--font-size-xs)` | 10px |
+| `0.75rem` | `var(--font-size-sm)` | 12px |
+| `0.875rem` | `var(--font-size-base)` | 14px |
+| `1rem` | `var(--font-size-md)` | 16px |
+| `1.125rem` | `var(--font-size-lg)` | 18px |
+| `1.25rem` | `var(--font-size-xl)` | 20px |
+| `1.375rem` | `var(--font-size-2xl)` | 22px |
+| `1.5rem` | `var(--font-size-3xl)` | 24px |
+
+## 使用方法
+
+### 预览模式（推荐先运行）
+
+```bash
+# 预览将要进行的更改，不修改文件
+node scripts/convert-fontsize-to-vars.cjs --dry-run
+```
+
+### 实际应用
+
+```bash
+# 应用更改到文件
+node scripts/convert-fontsize-to-vars.cjs
+```
+
+## 转换示例
+
+**转换前：**
+```vue
+<style>
+.title {
+  font-size: 20px;
+}
+
+.subtitle {
+  font-size: 16px;
+}
+
+.body-text {
+  font-size: 14px;
+}
+
+.small-text {
+  font-size: 12px;
+}
+
+.code {
+  font-size: 13px;
+}
+</style>
+```
+
+**转换后：**
+```vue
+<style>
+.title {
+  font-size: var(--font-size-xl);
+}
+
+.subtitle {
+  font-size: var(--font-size-md);
+}
+
+.body-text {
+  
+}
+
+.small-text {
+  font-size: var(--font-size-sm);
+}
+
+.code {
+  font-size: var(--font-size-sm);
+}
+</style>
+```
+
+## 特殊说明
+
+### 近似值映射
+
+脚本会将接近标准尺寸的值映射到最接近的标准尺寸：
+
+- `13px` → `var(--font-size-sm)` (12px)
+- `15px` → `var(--font-size-base)` (14px)
+
+这样做的目的是统一项目中的字体大小，减少碎片化。
+
+### 保留特殊值
+
+以下情况的字体大小会被保留（不会转换）：
+
+1. **非标准尺寸**：如 `11px`、`17px`、`19px` 等
+2. **计算值**：如 `calc(14px + 2px)`
+3. **变量值**：已经使用 CSS 变量的值
+
+## 支持的文件类型
+
+- `.vue` - Vue 单文件组件
+- `.scss` - Sass 样式文件
+- `.css` - 纯 CSS 文件
+
+## 跳过的文件
+
+脚本会自动跳过以下文件：
+- `variables.scss` - 变量定义文件
+- `dark-theme.scss` - 主题文件
+
+同时自动跳过以下目录：
+- `node_modules`
+- `.git`
+- `dist`
+
+## 输出报告
+
+执行完成后会显示详细的统计报告：
+
+```
+📊 转换统计报告
+============================================================
+总文件数: 150
+修改文件数: 38
+总替换次数: 156
+
+📋 替换详情:
+  font-size: 14px => var(--font-size-base): 42 次
+  font-size: 16px => var(--font-size-md): 35 次
+  font-size: 12px => var(--font-size-sm): 28 次
+  font-size: 13px => var(--font-size-sm): 18 次
+  ...
+
+⚠️  未映射的字体大小（需要手动检查）:
+  11px
+  17px
+  ...
+
+💡 建议：
+   1. 检查这些值是否是特殊尺寸，需要保留
+   2. 如果需要映射，可以将其添加到 FONT_SIZE_MAP 中
+   3. 或考虑调整为最接近的标准尺寸
+```
+
+## 优势
+
+使用 CSS 变量替代硬编码字体大小的好处：
+
+1. **统一管理**：所有字体大小在 `variables.scss` 中统一定义
+2. **响应式设计**：可以基于视口大小动态调整所有字体
+3. **易于维护**：修改变量值即可全局更新字体大小
+4. **语义化**：变量名更具可读性（如 `--font-size-base` vs `14px`）
+5. **一致性**：确保整个项目使用统一的字体大小体系
+6. **可访问性**：便于实现字体缩放功能
+
+## 与其他脚本配合
+
+该脚本可以与其他样式标准化脚本配合使用：
+
+```bash
+# 1. 转换间距值
+node scripts/convert-spacing-to-vars.cjs
+
+# 2. 转换圆角和阴影
+node scripts/convert-to-standard-vars.js
+
+# 3. 转换颜色值
+node scripts/convert-colors-to-vars.cjs
+
+# 4. 转换字体大小
+node scripts/convert-fontsize-to-vars.cjs
+```
+
+## 注意事项
+
+1. **备份建议**：运行脚本前建议先使用 `--dry-run` 参数预览更改
+2. **Git 提交**：建议在运行前提交当前代码，方便回滚
+3. **视觉检查**：转换后应检查页面显示，确保视觉效果符合预期
+4. **响应式考虑**：某些特殊场景可能需要保留精确的像素值
+5. **行内样式**：脚本仅处理 CSS 样式，不处理内联样式中的 font-size
+
+## 扩展映射表
+
+如果发现新的字体大小需要映射，编辑脚本中的 `FONT_SIZE_MAP` 对象：
+
+```javascript
+const FONT_SIZE_MAP = {
+  // 添加新的映射
+  '26px': 'var(--font-size-4xl)',
+  // ...
+};
+```
+
+同时需要在 `variables.scss` 中定义对应的变量。
+
+## 回滚方法
+
+如果需要回滚更改：
+
+```bash
+# 如果还未提交
+git checkout -- src/
+
+# 如果已提交
+git revert <commit-hash>
+```
+
+## 实际案例
+
+### 案例 1：CommandConsole.vue
+
+**转换前：**
+```scss
+.prompt {
+  font-size: 13px;
+  font-weight: 500;
+}
+```
+
+**转换后：**
+```scss
+.prompt {
+  font-size: var(--font-size-sm);
+  font-weight: 500;
+}
+```
+
+### 案例 2：CommitForm.vue
+
+**转换前：**
+```scss
+.commit-message-input {
+  font-size: 15px;
+  font-weight: 500;
+}
+```
+
+**转换后：**
+```scss
+.commit-message-input {
+  
+  font-weight: 500;
+}
+```
+
+## 最佳实践
+
+1. **优先使用标准尺寸**：尽量使用预定义的 8 个标准尺寸
+2. **语义化命名**：根据用途选择合适的变量名
+3. **保持一致**：相同级别的元素使用相同的字体大小变量
+4. **文档化**：在团队中明确各个字体大小变量的使用场景

package/scripts/README_SPACING_CONVERTER.md

@@ -0,0 +1,126 @@
+# 间距值转换工具使用说明
+
+## 功能说明
+
+该脚本将项目中 `padding`、`margin`、`gap` 属性中的 px 值转换为标准的 CSS 变量引用。
+
+## 标准间距映射规则
+
+根据项目中的 CSS 变量定义（`src/ui/client/src/styles/variables.scss`）：
+
+| 原始值 | 转换后 | CSS变量定义 |
+|--------|--------|-------------|
+| 2px    | var(--spacing-xs) | 2px |
+| 4px    | var(--spacing-sm) | 4px |
+| 8px    | var(--spacing-base) | 8px |
+| 12px   | var(--spacing-md) | 12px |
+| 16px   | var(--spacing-lg) | 16px |
+| 20px   | var(--spacing-xl) | 20px |
+| 24px   | var(--spacing-2xl) | 24px |
+| 32px   | var(--spacing-3xl) | 32px |
+
+### 保留的特殊值
+
+以下值不会被转换，保持原样：
+- **1px** - 通常用于边框
+- **3px, 5px** - 特殊设计值
+- **6px, 10px** - 常用于紧凑布局
+- **18px** - 通常与字体相关
+- **40px 及其他** - 特殊大间距值
+
+## 使用方法
+
+### 基本用法
+
+```bash
+# 在项目根目录执行
+node scripts/convert-spacing-to-vars.js
+```
+
+### 转换示例
+
+**转换前：**
+```css
+.example {
+  padding: 12px 16px;
+  margin: 8px;
+  gap: 16px;
+}
+```
+
+**转换后：**
+```css
+.example {
+  padding: var(--spacing-md) var(--spacing-lg);
+  margin: var(--spacing-base);
+  gap: var(--spacing-lg);
+}
+```
+
+**保留特殊值示例：**
+```css
+.example {
+  padding: 6px var(--spacing-md);  /* 6px 保持不变 */
+  margin: 1px;                      /* 1px 保持不变（边框用途）*/
+  gap: var(--spacing-base);        /* 8px 被转换 */
+}
+```
+
+## 支持的文件类型
+
+- `.vue` - Vue 单文件组件
+- `.scss` - Sass 样式文件
+- `.css` - 纯 CSS 文件
+
+## 扫描范围
+
+脚本会扫描 `src` 目录下的所有目标文件，自动跳过：
+- `node_modules` 目录
+- `.git` 目录
+- `dist` 目录
+
+## 输出报告
+
+执行完成后会显示统计报告：
+
+```
+📊 转换统计报告
+============================================================
+总文件数: 150
+修改文件数: 45
+总替换次数: 234
+
+📋 替换详情:
+  12px => var(--spacing-md): 89 次
+  16px => var(--spacing-lg): 67 次
+  8px => var(--spacing-base): 45 次
+  ...
+```
+
+## 注意事项
+
+1. **备份建议**：运行脚本前建议先提交或备份当前代码
+2. **检查结果**：转换完成后请检查 Git diff，确认转换符合预期
+3. **测试验证**：转换后请运行项目测试，确保样式显示正常
+4. **混合值处理**：脚本能正确处理混合值，如 `padding: 6px var(--spacing-md)`
+
+## 优势
+
+使用 CSS 变量的好处：
+
+1. **统一管理**：所有间距在 `variables.scss` 中统一定义
+2. **易于维护**：修改变量值即可全局更新
+3. **主题支持**：方便实现深色主题等样式变体
+4. **语义化**：变量名更具可读性（如 `--spacing-md` vs `12px`）
+
+## 回滚方法
+
+如果需要回滚更改：
+
+```bash
+# 如果还未提交
+git checkout -- src/
+
+# 如果已提交
+git revert <commit-hash>
+```