@rdyl/react-i18n-connect 0.0.8 → 0.1.0

package/CHANGELOG.md

@@ -1,4 +1,4 @@
-## 0.0.8 (2025-06-09)
+# 0.1.0 (2025-09-04)
 
 
 

package/README.md

@@ -8,13 +8,16 @@ $ yarn add @rdyl/react-i18n-connect
 
 ## Getting started
 
-1. 配置tsconfig.json
-```json
-{
-  "compilerOptions": {
-    "types": [
-      "@rdyl/react-i18n-connect/types/type.d.ts"
-    ],
-  },
-}
+1. App 入口文件添加
+```tsx
+<I18nConnect initial={"zh-CN"} locales={{...}}>
+  ...
+</I18nConnect>
+```
+
+2. 使用
+```tsx
+ const {t} =  useI18n()
+
+ t('key')
 ```

package/dist/index.js

@@ -32,64 +32,68 @@ var __importStar = (this && this.__importStar) || (function () {
         return result;
     };
 })();
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useI18n = void 0;
 var react_1 = __importStar(require("react"));
 var utils_1 = require("./utils");
 var I18nCtx = (0, react_1.createContext)({});
 var I18nConnect = function (_a) {
-    var children = _a.children, _b = _a.initial, initial = _b === void 0 ? "" : _b, _c = _a.locales, __locales__ = _c === void 0 ? {} : _c, onAfterChange = _a.onAfterChange, onBeforeChange = _a.onBeforeChange, onLoad = _a.onLoad;
-    var _d = (0, react_1.useState)(initial), lang = _d[0], _setLang = _d[1];
-    var _e = (0, react_1.useState)({}), loaded = _e[0], setLoaded = _e[1];
-    var options = (0, react_1.useMemo)(function () {
-        return Object.keys(__locales__).map(function (name) {
-            return {
-                name: name,
-                label: __locales__[name]["$"] || name,
-            };
-        });
-    }, [__locales__]);
+    var children = _a.children, _b = _a.initial, initial = _b === void 0 ? "" : _b, _c = _a.locales, __locales__ = _c === void 0 ? {} : _c, onAfterChange = _a.onAfterChange, onBeforeChange = _a.onBeforeChange, onLoadLocales = _a.onLoadLocales, onLoadInitial = _a.onLoadInitial;
+    var _d = (0, react_1.useState)(!onLoadInitial), ready = _d[0], setReady = _d[1];
+    var _e = (0, react_1.useState)(initial), lang = _e[0], _setLang = _e[1];
+    var _f = (0, react_1.useState)({}), loaded = _f[0], setLoaded = _f[1];
     var records = (0, react_1.useMemo)(function () {
         // 异步加载
-        if (onLoad) {
+        if (onLoadLocales) {
             return loaded;
         }
         var current = __locales__[lang] || {};
         return current;
-    }, [lang, loaded, onLoad]);
+    }, [lang, loaded, onLoadLocales]);
     var t = (0, react_1.useCallback)((0, utils_1.ParserI18nFn)(records), [records]);
     var setLang = (0, react_1.useCallback)(function (e) {
         var cb = function () {
             _setLang(e);
-            onAfterChange && onAfterChange(e);
+            onAfterChange && onAfterChange(e, t);
         };
         if (onBeforeChange) {
-            if (!!onBeforeChange(e)) {
-                cb();
-            }
+            Promise.resolve(onBeforeChange(e)).then(function (res) {
+                if (res) {
+                    cb();
+                }
+            });
         }
         else {
             cb();
         }
-    }, [onBeforeChange, onAfterChange]);
+    }, [onBeforeChange, onAfterChange, t]);
     (0, react_1.useEffect)(function () {
-        if (onLoad) {
+        if (onLoadLocales) {
             setLoaded({});
-            onLoad(lang).then(setLoaded);
+            onLoadLocales(lang).then(setLoaded);
         }
-    }, [lang, onLoad]);
+    }, [lang, onLoadLocales]);
     (0, react_1.useEffect)(function () {
-        window.$t = t;
-    }, [t]);
+        if (onLoadInitial) {
+            onLoadInitial()
+                .then(setLang)
+                .finally(function () {
+                setReady(true);
+            });
+        }
+    }, []);
     return (react_1.default.createElement(I18nCtx.Provider, { value: {
             __locales__: __locales__,
             records: records,
-            options: options,
             lang: lang,
             t: t,
             setLang: setLang,
-        } }, children));
+        } }, ready && children));
 };
 var useI18n = function () { return (0, react_1.useContext)(I18nCtx); };
 exports.useI18n = useI18n;
+__exportStar(require("./utils"), exports);
 exports.default = I18nConnect;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rdyl/react-i18n-connect",
-  "version": "0.0.8",
+  "version": "0.1.0",
   "license": "MIT",
   "main": "dist/index.js",
   "types": "types/index.d.ts",

package/types/index.d.ts

@@ -1,17 +1,12 @@
 import { FC, PropsWithChildren } from "react";
+import { GenI18nTokenFn, I18nConfig, I18nConnectValue, I18nTokenValue } from "./utils";
 declare const I18nConnect: FC<PropsWithChildren<I18nConnectProps>>;
-export interface I18nConnectValue {
-    __locales__: Record<string, Record<string, TRValue>>;
-    lang: string;
-    options: I18nLangOption[];
-    records: Record<string, TRValue>;
-    setLang(name: string): void;
-    t: TR;
-}
-type I18nConnectProps = Partial<I18nConfig> & {
-    onLoad?(t: string): Promise<Record<string, TRValue>>;
-    onAfterChange?(t: string): void;
-    onBeforeChange?(t: string): unknown;
+export type I18nConnectProps = Partial<I18nConfig> & {
+    onLoadInitial?(): Promise<string>;
+    onLoadLocales?(lang: string): Promise<Record<string, I18nTokenValue>>;
+    onAfterChange?(lang: string, t: GenI18nTokenFn): void;
+    onBeforeChange?(lang: string): boolean | Promise<boolean>;
 };
 export declare const useI18n: () => I18nConnectValue;
+export * from "./utils";
 export default I18nConnect;

package/types/type.d.ts

@@ -4,11 +4,6 @@ interface I18nConfig {
   initial: string;
 }
 
-interface I18nLangOption {
-  name: string;
-  label: string;
-}
-
 type TRValue = string | number | boolean;
 
 type TR = (k: string, o?: Record<string, unknown>) => string;

package/types/utils.d.ts

@@ -1 +1,14 @@
-export declare function ParserI18nFn(data: Record<string, TRValue>): (k: string, named?: Record<string, unknown>) => string;
+export declare function ParserI18nFn(data: Record<string, I18nTokenValue>): (k: string, named?: Record<string, unknown>) => string;
+export type I18nTokenValue = string | number | boolean;
+export interface I18nConfig {
+    locales: Record<string, Record<string, I18nTokenValue>>;
+    initial: string;
+}
+export type GenI18nTokenFn = (k: string, o?: Record<string, unknown>) => string;
+export interface I18nConnectValue {
+    __locales__: Record<string, Record<string, I18nTokenValue>>;
+    lang: string;
+    records: Record<string, I18nTokenValue>;
+    setLang(name: string): void;
+    t: GenI18nTokenFn;
+}