@intlayer/docs 5.7.7 → 5.8.0-canary.0

package/docs/zh/CI_CD.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-05-20
-updatedAt: 2025-06-29
+updatedAt: 2025-08-13
 title: CI/CD 集成
 description: 了解如何将 Intlayer 集成到您的 CI/CD 流水线中，实现内容管理和部署的自动化。
 keywords:
@@ -19,11 +19,11 @@ slugs:
 
 # 在 CI/CD 流水线中自动生成翻译
 
-Intlayer 允许自动生成内容声明文件的翻译。根据您的工作流程，有多种实现方式。
+Intlayer 允许自动生成内容声明文件的翻译。根据您的工作流程，有多种方式可以实现这一点。
 
 ## 使用 CMS
 
-使用 Intlayer，您可以采用一种工作流程，其中本地只声明单一语言环境，而所有翻译内容均通过 CMS 远程管理。这使得内容和翻译可以完全脱离代码库，提供给内容编辑者更大的灵活性，并支持热内容重载（无需重新构建应用即可应用更改）。
+使用 Intlayer，您可以采用一种工作流程，只在本地声明单一语言环境，而所有翻译内容则通过 CMS 远程管理。这使内容和翻译完全脱离代码库，为内容编辑者提供更大的灵活性，并支持热内容重载（无需重建应用即可应用更改）。
 
 ### 示例配置
 
@@ -45,7 +45,7 @@ const config: IntlayerConfig = {
     clientSecret: process.env.INTLAYER_CLIENT_SECRET,
   },
   ai: {
-    applicationContext: "This is a test application", // 有助于确保一致的翻译生成
+    applicationContext: "这是一个测试应用程序", // 有助于确保一致的翻译生成
   },
 };
 
@@ -77,7 +77,7 @@ const config: IntlayerConfig = {
     provider: "openai",
     apiKey: process.env.OPENAI_API_KEY, // 使用您自己的 API 密钥
 
-    applicationContext: "这是一个测试应用", // 有助于确保翻译生成的一致性
+    applicationContext: "这是一个测试应用程序", // 有助于确保翻译生成的一致性
   },
 };
 
@@ -85,7 +85,7 @@ export default config;
 ```
 
 ```bash fileName=".husky/pre-push"
-npx intlayer build                          # 确保字典是最新的
+npx intlayer build                          # 确保词典是最新的
 npx intlayer fill --unpushed --mode fill    # 仅填充缺失内容，不更新已有内容
 ```
 
@@ -105,68 +105,94 @@ npx intlayer fill --base-dir ./app2 --unpushed --mode fill
 
 ## 使用 GitHub Actions
 
-Intlayer 提供了一个 CLI 命令用于自动填充和审查字典内容。您可以使用 GitHub Actions 将其集成到您的 CI/CD 工作流中。
+Intlayer 提供了一个 CLI 命令，用于自动填充和审查词典内容。您可以将其集成到使用 GitHub Actions 的 CI/CD 工作流中。
 
 ```yaml fileName=".github/workflows/intlayer-translate.yml"
 name: Intlayer 自动填充
+# 触发此工作流的条件
 on:
-  push:
-    branches: [ main ]
-    paths:
-      - 'src/**'
   pull_request:
-    branches: [ main ]
-    paths:
-      - 'src/**'
-  workflow_dispatch: {}
+    branches:
+      - "main"
+
+permissions:
+  contents: write
+  pull-requests: write
 
 concurrency:
-  group: 'autofill-${{ github.ref }}'
+  group: "autofill-${{ github.ref }}"
   cancel-in-progress: true
 
 jobs:
   autofill:
     runs-on: ubuntu-latest
     env:
-      INTLAYER_CLIENT_ID: ${{ secrets.INTLAYER_CLIENT_ID }}
-      INTLAYER_CLIENT_SECRET: ${{ secrets.INTLAYER_CLIENT_SECRET }}
-      OPENAI_API_KEY: ${{ secrets.OPENAI_API_KEY }}
+      # OpenAI
+      AI_MODEL: openai
+      AI_PROVIDER: gpt-5-mini
+      AI_API_KEY: ${{ secrets.AI_API_KEY }}
 
     steps:
+      # 第一步：从仓库获取最新代码
       - name: ⬇️ 签出仓库
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
         with:
-          persist-credentials: true
+          persist-credentials: true # 保留凭据以创建拉取请求
+          fetch-depth: 0 # 获取完整的 git 历史以进行差异分析
 
+      # 步骤 2：设置 Node.js 环境
       - name: 🟢 设置 Node.js
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
-          node-version: 20
+          node-version: 20 # 使用 Node.js 20 LTS 以保证稳定性
 
+      # 步骤 3：安装项目依赖
       - name: 📦 安装依赖
-        run: npm ci
+        run: npm install
+
+      # 步骤 4：全局安装 Intlayer CLI 以管理翻译
+      - name: 📦 安装 Intlayer
+        run: npm install -g intlayer-cli
 
+      # 步骤 5：构建 Intlayer 项目以生成翻译文件
       - name: ⚙️ 构建 Intlayer 项目
         run: npx intlayer build
 
+      # 步骤 6：使用 AI 自动填充缺失的翻译
       - name: 🤖 自动填充缺失的翻译
-        run: npx intlayer fill --git-diff --mode fill
-
-      - name: 📤 创建或更新翻译拉取请求
-        uses: peter-evans/create-pull-request@v4
-        with:
-          commit-message: chore: 自动填充缺失的翻译 [skip ci]
-          branch: auto-translations
-          title: chore: 更新缺失的翻译
-          labels: translation, automated
+        run: npx intlayer fill --git-diff --mode fill --provider $AI_PROVIDER --model $AI_MODEL --api-key $AI_API_KEY
+
+      # 第7步：检查是否有更改并提交
+      - name: � 检查更改
+        id: check-changes
+        run: |
+          if [ -n "$(git status --porcelain)" ]; then
+            echo "has-changes=true" >> $GITHUB_OUTPUT
+          else
+            echo "has-changes=false" >> $GITHUB_OUTPUT
+          fi
+
+      # 第8步：如果存在更改，则提交并推送
+      - name: 📤 提交并推送更改
+        if: steps.check-changes.outputs.has-changes == 'true'
+        run: |
+          git config --local user.email "action@github.com"
+          git config --local user.name "GitHub Action"
+          git add .
+          git commit -m "chore: 自动填充缺失的翻译 [skip ci]"
+          git push origin HEAD:${{ github.head_ref }}
 ```
 
-> 与 Husky 相同，在 monorepo 的情况下，您可以使用 `--base-dir` 参数来顺序处理每个应用。
+要设置环境变量，请前往 GitHub → 设置 → Secrets and variables → Actions 并添加密钥（API_KEY）。
+
+> 与 Husky 相同，在单一仓库（monorepo）的情况下，可以使用 `--base-dir` 参数依次处理每个应用。
 
-> 默认情况下，`--git-diff` 参数会过滤包含从基线（默认 `origin/main`）到当前分支（默认：`HEAD`）的更改的字典。
+> 默认情况下，`--git-diff` 参数会筛选包含从基线（默认 `origin/main`）到当前分支（默认 `HEAD`）的更改的字典。
 
 > 有关 Intlayer CLI 命令及其用法的更多信息，请参阅 [CLI 文档](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/intlayer_cli.md)。
 
 ## 文档历史
 
-- 5.5.10 - 2025-06-29：初始化历史
+| 版本   | 日期       | 变更           |
+| ------ | ---------- | -------------- |
+| 5.5.10 | 2025-06-29 | 初始化历史记录 |

package/docs/zh/formatters.md

@@ -0,0 +1,239 @@
+---
+createdAt: 2024-08-13
+updatedAt: 2025-08-20
+title: 格式化工具
+description: 基于 Intl 的本地化格式化工具，用于数字、百分比、货币、日期、相对时间、单位和紧凑表示。包含缓存的 Intl 辅助工具。
+keywords:
+  - 格式化工具
+  - Intl
+  - 数字
+  - 货币
+  - 百分比
+  - 日期
+  - 相对时间
+  - 单位
+  - 紧凑表示
+  - 国际化
+slugs:
+  - doc
+  - formatters
+---
+
+# Intlayer 格式化工具
+
+## 概述
+
+Intlayer 提供了一组基于原生 `Intl` API 构建的轻量级辅助工具，以及一个缓存的 `Intl` 包装器，以避免重复构造重量级的格式化器。这些工具完全支持本地化，可直接从主 `intlayer` 包中使用。
+
+### 导入
+
+```ts
+import {
+  Intl,
+  number,
+  percentage,
+  currency,
+  date,
+  relativeTime,
+  units,
+  compact,
+} from "intlayer";
+```
+
+如果您使用 React，也提供了 hooks；请参见 `react-intlayer/format`。
+
+## 缓存的 Intl
+
+导出的 `Intl` 是对全局 `Intl` 的一个轻量缓存包装器。它会缓存 `NumberFormat`、`DateTimeFormat`、`RelativeTimeFormat` 的实例，避免重复构建相同的格式化器。
+
+由于格式化器的构造相对昂贵，这种缓存机制在不改变行为的前提下提升了性能。该包装器暴露与原生 `Intl` 相同的 API，因此用法完全一致。
+
+- 缓存是按进程进行的，对调用者透明。
+
+> 如果环境中不支持 `Intl.DisplayNames`，则会打印一次仅限开发环境的警告（建议使用 polyfill）。
+
+示例：
+
+```ts
+import { Intl } from "intlayer";
+
+const numberFormat = new Intl.NumberFormat("en-GB", {
+  style: "currency",
+  currency: "GBP",
+});
+numberFormat.format(1234.5); // "£1,234.50"
+```
+
+## 格式化器
+
+以下所有辅助函数均从 `intlayer` 导出。
+
+### `number(value, options?)`
+
+使用基于区域设置的分组和小数格式化数字值。
+
+- **value**: `number | string`
+- **options**: `Intl.NumberFormatOptions & { locale?: LocalesValues }`
+
+示例：
+
+```ts
+import { number } from "intlayer";
+
+number(123456.789); // "123,456.789"（在 en-US 中）
+number("1000000", { locale: "fr" }); // "1 000 000"
+number(1234.5, { minimumFractionDigits: 2 }); // "1,234.50"
+```
+
+### `percentage(value, options?)`
+
+将数字格式化为百分比字符串。
+
+行为：大于1的值被解释为完整的百分比并进行归一化（例如，`25` → `25%`，`0.25` → `25%`）。
+
+- **value**: `number | string`
+- **options**: `Intl.NumberFormatOptions & { locale?: LocalesValues }`
+
+示例：
+
+```ts
+import { percentage } from "intlayer";
+
+percentage(0.25); // "25%"
+percentage(25); // "25%"
+percentage(0.237, { minimumFractionDigits: 1 }); // "23.7%"
+```
+
+### `currency(value, options?)`
+
+将值格式化为本地化货币。默认使用带有两位小数的 `USD`。
+
+- **value**: `number | string`
+- **options**: `Intl.NumberFormatOptions & { locale?: LocalesValues }`
+  - 常用字段：`currency`（例如 `"EUR"`），`currencyDisplay`（`"symbol" | "code" | "name"`）
+
+示例：
+
+```ts
+import { currency } from "intlayer";
+
+currency(1234.5, { currency: "EUR" }); // "€1,234.50"
+currency("5000", { locale: "fr", currency: "CAD", currencyDisplay: "code" }); // "5 000,00 CAD"
+```
+
+### `date(date, optionsOrPreset?)`
+
+使用 `Intl.DateTimeFormat` 格式化日期/时间值。
+
+- **date**: `Date | string | number`
+- **optionsOrPreset**: `Intl.DateTimeFormatOptions & { locale?: LocalesValues }` 或预设之一：
+  - 预设值: `"short" | "long" | "dateOnly" | "timeOnly" | "full"`
+
+示例：
+
+```ts
+import { date } from "intlayer";
+
+date(new Date(), "short"); // 例如 "08/02/25, 14:30"
+date("2025-08-02T14:30:00Z", { locale: "fr", month: "long", day: "numeric" }); // "2 août"
+```
+
+### `relativeTime(from, to = new Date(), options?)`
+
+使用 `Intl.RelativeTimeFormat` 格式化两个时间点之间的相对时间。
+
+- 传入 "now" 作为第一个参数，目标时间作为第二个参数，以获得自然的表达方式。
+- **from**: `Date | string | number`
+- **to**: `Date | string | number`（默认为 `new Date()`）
+- **options**: `{ locale?: LocalesValues; unit?: Intl.RelativeTimeFormatUnit; numeric?: Intl.RelativeTimeFormatNumeric; style?: Intl.RelativeTimeFormatStyle }`
+  - 默认的 `unit` 是 `"second"`。
+
+示例：
+
+```ts
+import { relativeTime } from "intlayer";
+
+const now = new Date();
+const in3Days = new Date(now.getTime() + 3 * 864e5);
+relativeTime(now, in3Days, { unit: "day" }); // "in 3 days"
+
+const twoHoursAgo = new Date(now.getTime() - 2 * 3600e3);
+relativeTime(now, twoHoursAgo, { unit: "hour", numeric: "auto" }); // "2 hours ago"
+```
+
+### `units(value, options?)`
+
+使用 `Intl.NumberFormat` 并设置 `style: 'unit'` 将数值格式化为本地化的单位字符串。
+
+- **value**: `number | string`
+- **options**: `Intl.NumberFormatOptions & { locale?: LocalesValues }`
+  - 常用字段：`unit`（例如 `"kilometer"`、`"byte"`），`unitDisplay`（`"short" | "narrow" | "long"`）
+  - 默认值：`unit: 'day'`，`unitDisplay: 'short'`，`useGrouping: false`
+
+示例：
+
+```ts
+import { units } from "intlayer";
+
+units(5, { unit: "kilometer", unitDisplay: "long", locale: "en-GB" }); // "5 kilometers"
+units(1024, { unit: "byte", unitDisplay: "narrow" }); // "1,024B"（依赖于区域设置）
+```
+
+### `compact(value, options?)`
+
+使用紧凑表示法格式化数字（例如 `1.2K`，`1M`）。
+
+- **value**: `number | string`
+  /// **options**: `Intl.NumberFormatOptions & { locale?: LocalesValues }`（底层使用 `notation: 'compact'`）
+
+示例：
+
+```ts
+import { compact } from "intlayer";
+
+compact(1200); // "1.2K"
+compact("1000000", { locale: "fr", compactDisplay: "long" }); // "1 million"
+```
+
+## 说明
+
+- 所有辅助函数均接受 `string` 类型输入；内部会强制转换为数字或日期。
+- 如果未提供 locale，则默认使用您配置的 `internationalization.defaultLocale`。
+- 这些工具是轻量封装；如需高级格式化，请直接传递标准的 `Intl` 选项。
+
+## 入口点及重新导出（`@index.ts`）
+
+格式化函数位于核心包中，并从更高级别的包中重新导出，以保持跨运行时的导入简洁：
+
+示例：
+
+```ts
+// 应用代码（推荐）
+import { number, currency, date, Intl } from "intlayer";
+```
+
+### React
+
+客户端组件：
+
+```ts
+import { useNumber, useCurrency, useDate } from "react-intlayer/format";
+// 或者在 Next.js 应用中
+import { useNumber, useCurrency, useDate } from "next-intlayer/client/format";
+```
+
+服务端组件（或 React 服务器运行时）：
+
+```ts
+import { useNumber, useCurrency, useDate } from "intlayer/server/format";
+// 或者在 Next.js 应用中
+import { useNumber, useCurrency, useDate } from "next-intlayer/server/format";
+```
+
+> 这些钩子会考虑来自 `IntlayerProvider` 或 `IntlayerServerProvider` 的 locale
+
+## 文档历史
+
+| 版本  | 日期       | 变更内容           |
+| ----- | ---------- | ------------------ |
+| 5.8.0 | 2025-08-18 | 添加格式化工具文档 |