feat(i18n): 统一国际化系统架构,支持插件独立翻译 (#301)

* feat(i18n): 统一国际化系统架构,支持插件独立翻译

## 主要改动

### 核心架构
- 增强 LocaleService,支持插件命名空间翻译扩展
- 新增 editor-runtime/i18n 模块,提供 createPluginLocale/createPluginTranslator
- 新增 editor-core/tokens.ts,定义 LocaleServiceToken 等服务令牌
- 改进 PluginAPI 类型安全,使用 ServiceToken<T> 替代 any

### 编辑器本地化
- 扩展 en.ts/zh.ts 翻译文件,覆盖所有 UI 组件
- 新增 es.ts 西班牙语支持
- 重构 40+ 组件使用 useLocale() hook

### 插件本地化系统
- behavior-tree-editor: 新增 locales/ 和 useBTLocale hook
- material-editor: 新增 locales/ 和 useMaterialLocale hook
- particle-editor: 新增 locales/ 和 useParticleLocale hook
- tilemap-editor: 新增 locales/ 和 useTilemapLocale hook
- ui-editor: 新增 locales/ 和 useUILocale hook

### 类型安全改进
- 修复 Debug 工具使用公共接口替代 as any
- 修复 ChunkStreamingSystem 添加 forEachChunk 公共方法
- 修复 blueprint-editor 移除不必要的向后兼容代码

* fix(behavior-tree-editor): 使用 ServiceToken 模式修复服务解析

- 创建 BehaviorTreeServiceToken 遵循"谁定义接口,谁导出Token"原则
- 使用 ServiceToken.id (symbol) 注册服务到 ServiceContainer
- 更新 PluginSDKRegistry.resolveService 支持 ServiceToken 检测
- BehaviorTreeEditorPanel 现在使用类型安全的 PluginAPI.resolve

* fix(behavior-tree-editor): 使用 ServiceContainer.resolve 获取类注册的服务

* fix: 修复多个包的依赖和类型问题

- core: EntityDataCollector.getEntityDetails 使用 HierarchySystem 获取父实体
- ui-editor: 添加 @esengine/editor-runtime 依赖
- tilemap-editor: 添加 @esengine/editor-runtime 依赖
- particle-editor: 添加 @esengine/editor-runtime 依赖
This commit is contained in:
YHH
2025-12-09 18:04:03 +08:00
committed by GitHub
parent 995fa2d514
commit 1b0d38edce
103 changed files with 8015 additions and 1633 deletions

View File

@@ -1,7 +1,36 @@
import { useState, useEffect, useCallback, useMemo } from 'react';
import { Core } from '@esengine/ecs-framework';
import { LocaleService, type Locale } from '@esengine/editor-core';
import { LocaleService, type TranslationParams, type LocaleInfo, type Locale } from '@esengine/editor-core';
// Re-export Locale type for convenience | 重新导出 Locale 类型以便使用
export type { Locale } from '@esengine/editor-core';
/**
* React Hook for internationalization
* React 国际化 Hook
*
* 提供翻译函数、语言切换和语言变化监听。
* Provides translation function, locale switching and locale change listening.
*
* @example
* ```tsx
* function MyComponent() {
* const { t, locale, changeLocale, supportedLocales } = useLocale();
*
* return (
* <div>
* <h1>{t('app.title')}</h1>
* <p>{t('scene.savedSuccess', { name: 'MyScene' })}</p>
* <select value={locale} onChange={(e) => changeLocale(e.target.value as Locale)}>
* {supportedLocales.map((loc) => (
* <option key={loc.code} value={loc.code}>{loc.nativeName}</option>
* ))}
* </select>
* </div>
* );
* }
* ```
*/
export function useLocale() {
const localeService = useMemo(() => Core.services.resolve(LocaleService), []);
const [locale, setLocale] = useState<Locale>(() => localeService.getCurrentLocale());
@@ -14,17 +43,44 @@ export function useLocale() {
return unsubscribe;
}, [localeService]);
const t = useCallback((key: string, fallback?: string) => {
return localeService.t(key, fallback);
}, [localeService]);
/**
* 翻译函数
* Translation function
*
* @param key - 翻译键 | Translation key
* @param params - 可选参数,用于替换 {{key}} | Optional params for {{key}} substitution
* @param fallback - 回退文本 | Fallback text
*/
const t = useCallback(
(key: string, params?: TranslationParams, fallback?: string) => {
return localeService.t(key, params, fallback);
},
[localeService]
);
const changeLocale = useCallback((newLocale: Locale) => {
localeService.setLocale(newLocale);
/**
* 切换语言
* Change locale
*/
const changeLocale = useCallback(
(newLocale: Locale) => {
localeService.setLocale(newLocale);
},
[localeService]
);
/**
* 获取支持的语言列表
* Get supported locales
*/
const supportedLocales: readonly LocaleInfo[] = useMemo(() => {
return localeService.getSupportedLocales();
}, [localeService]);
return {
locale,
t,
changeLocale
changeLocale,
supportedLocales
};
}