@sheet-i18n/react-client 1.5.0-canary.0 → 1.5.0-canary.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +38 -29
- package/dist/index.d.ts +38 -29
- package/dist/index.js +62 -30
- package/dist/index.mjs +63 -31
- package/package.json +2 -2
package/dist/index.d.mts
CHANGED
|
@@ -1,7 +1,32 @@
|
|
|
1
|
-
import { MessageDescriptor, IntlShape } from 'react-intl';
|
|
2
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
3
1
|
import { I18nStore } from '@sheet-i18n/react-core';
|
|
4
2
|
import { ObserverManager } from '@sheet-i18n/shared-utils';
|
|
3
|
+
import { MessageDescriptor, IntlShape } from 'react-intl';
|
|
4
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
5
|
+
|
|
6
|
+
interface IStorageService<V extends string> {
|
|
7
|
+
getItem(key: string): V;
|
|
8
|
+
setItem(key: string, value: V): boolean;
|
|
9
|
+
removeItem(key: string): boolean;
|
|
10
|
+
clear(): boolean;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* locale storage manager
|
|
14
|
+
* implements ILocaleStorageManager (injected StorageService)
|
|
15
|
+
*/
|
|
16
|
+
interface ILocaleStorageManager<TSupportedLocales extends readonly string[]> {
|
|
17
|
+
getLocale(): TSupportedLocales[number];
|
|
18
|
+
setLocale(locale: TSupportedLocales[number]): void;
|
|
19
|
+
}
|
|
20
|
+
declare class LocaleStorageManager<TSupportedLocales extends readonly string[], TLocaleSet extends Partial<Record<TSupportedLocales[number], Record<string, any>>>, TTypeSafe extends boolean = false> implements ILocaleStorageManager<TSupportedLocales> {
|
|
21
|
+
private readonly storageService;
|
|
22
|
+
private readonly i18nStore;
|
|
23
|
+
private readonly localeStorageKey;
|
|
24
|
+
observerManager: ObserverManager<TSupportedLocales[number]>;
|
|
25
|
+
constructor(storageService: IStorageService<TSupportedLocales[number]>, i18nStore: I18nStore<TSupportedLocales, TLocaleSet, TTypeSafe>, localeStorageKey?: string);
|
|
26
|
+
private initializeCurrentLocale;
|
|
27
|
+
getLocale: () => TSupportedLocales[number];
|
|
28
|
+
setLocale: (locale: TSupportedLocales[number]) => void;
|
|
29
|
+
}
|
|
5
30
|
|
|
6
31
|
type UseIntlParams<D = MessageDescriptor> = Parameters<IntlShape['$t']> extends [D, ...infer R] ? [...R, Omit<D, 'id'>] : never;
|
|
7
32
|
type ExtendedUseIntlParams<D = MessageDescriptor> = UseIntlParams<D> extends [infer A, infer B, ...infer Rest] ? A extends Record<string, infer V> ? [Record<string, V | React.ReactNode>, B, ...Rest] : [A, B, ...Rest] : UseIntlParams<D>;
|
|
@@ -40,42 +65,26 @@ type IntlProviderProps<TSupportedLocales extends readonly string[], TLocaleSet e
|
|
|
40
65
|
children: React.ReactNode;
|
|
41
66
|
};
|
|
42
67
|
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
removeItem(key: string): boolean;
|
|
47
|
-
clear(): boolean;
|
|
48
|
-
}
|
|
49
|
-
/**
|
|
50
|
-
* locale storage manager
|
|
51
|
-
* implements ILocaleStorageManager (injected StorageService)
|
|
52
|
-
*/
|
|
53
|
-
interface ILocaleStorageManager<TSupportedLocales extends readonly string[]> {
|
|
54
|
-
getLocale(): TSupportedLocales[number];
|
|
55
|
-
setLocale(locale: TSupportedLocales[number]): void;
|
|
56
|
-
}
|
|
57
|
-
declare class LocaleStorageManager<TSupportedLocales extends readonly string[], TLocaleSet extends Partial<Record<TSupportedLocales[number], Record<string, any>>>, TTypeSafe extends boolean = false> implements ILocaleStorageManager<TSupportedLocales> {
|
|
58
|
-
private readonly storageService;
|
|
59
|
-
private readonly i18nStore;
|
|
60
|
-
private readonly localeStorageKey;
|
|
61
|
-
observerManager: ObserverManager<TSupportedLocales[number]>;
|
|
62
|
-
constructor(storageService: IStorageService<TSupportedLocales[number]>, i18nStore: I18nStore<TSupportedLocales, TLocaleSet, TTypeSafe>, localeStorageKey?: string);
|
|
63
|
-
private initializeCurrentLocale;
|
|
64
|
-
getLocale: () => TSupportedLocales[number];
|
|
65
|
-
setLocale: (locale: TSupportedLocales[number]) => void;
|
|
66
|
-
}
|
|
68
|
+
declare function useLocaleStorage<TSupportedLocales extends readonly string[], TLocaleSet extends Partial<Record<TSupportedLocales[number], Record<string, any>>>, TTypeSafe extends boolean = false>(localeStorageManager: LocaleStorageManager<TSupportedLocales, TLocaleSet, TTypeSafe>): {
|
|
69
|
+
locale: TSupportedLocales[number];
|
|
70
|
+
};
|
|
67
71
|
|
|
68
|
-
|
|
72
|
+
interface StorageBasedIntlProviderProps<TSupportedLocales extends readonly string[], TLocaleSet extends Partial<Record<TSupportedLocales[number], Record<string, any>>>, TTypeSafe extends boolean = false> {
|
|
73
|
+
i18nStore: I18nStore<TSupportedLocales, TLocaleSet, TTypeSafe>;
|
|
74
|
+
storageManager: LocaleStorageManager<TSupportedLocales, TLocaleSet, TTypeSafe>;
|
|
75
|
+
children: React.ReactNode;
|
|
76
|
+
}
|
|
69
77
|
|
|
70
78
|
declare function createI18nContext<TSupportedLocales extends readonly string[], TLocaleSet extends Partial<Record<TSupportedLocales[number], Record<string, any>>>, TTypeSafe extends boolean = false>(i18nStore: I18nStore<TSupportedLocales, TLocaleSet, TTypeSafe>): {
|
|
71
79
|
IntlProvider: ({ currentLocale, children, }: Omit<IntlProviderProps<TSupportedLocales, TLocaleSet>, "currentLocale" | "i18nStore"> & {
|
|
72
80
|
currentLocale?: string;
|
|
73
81
|
children?: React.ReactNode;
|
|
74
82
|
}) => react_jsx_runtime.JSX.Element;
|
|
83
|
+
StorageBasedIntlProvider: ({ storageManager, children, }: Omit<StorageBasedIntlProviderProps<TSupportedLocales, TLocaleSet, TTypeSafe>, "i18nStore">) => react_jsx_runtime.JSX.Element;
|
|
75
84
|
useTranslation: <TSheetTitle extends TTypeSafe extends true ? keyof TLocaleSet[TSupportedLocales[number]] extends never ? string : keyof TLocaleSet[TSupportedLocales[number]] : string>(sheetTitle: TSheetTitle) => UseTranslationReturn<TSupportedLocales, TLocaleSet, TTypeSafe, TSheetTitle>;
|
|
76
85
|
getTranslation: <TSheetTitle extends TTypeSafe extends true ? keyof TLocaleSet[TSupportedLocales[number]] extends never ? string : keyof TLocaleSet[TSupportedLocales[number]] : string>(sheetTitle: TSheetTitle) => GetTranslationReturn<TSupportedLocales, TLocaleSet, TTypeSafe, TSheetTitle>;
|
|
77
|
-
getLocaleStorageManager: (
|
|
86
|
+
getLocaleStorageManager: (storageService?: IStorageService<string>) => LocaleStorageManager<TSupportedLocales, TLocaleSet, TTypeSafe>;
|
|
78
87
|
useLocaleStorage: typeof useLocaleStorage;
|
|
79
88
|
};
|
|
80
89
|
|
|
81
|
-
export { createI18nContext };
|
|
90
|
+
export { type IStorageService, createI18nContext };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,32 @@
|
|
|
1
|
-
import { MessageDescriptor, IntlShape } from 'react-intl';
|
|
2
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
3
1
|
import { I18nStore } from '@sheet-i18n/react-core';
|
|
4
2
|
import { ObserverManager } from '@sheet-i18n/shared-utils';
|
|
3
|
+
import { MessageDescriptor, IntlShape } from 'react-intl';
|
|
4
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
5
|
+
|
|
6
|
+
interface IStorageService<V extends string> {
|
|
7
|
+
getItem(key: string): V;
|
|
8
|
+
setItem(key: string, value: V): boolean;
|
|
9
|
+
removeItem(key: string): boolean;
|
|
10
|
+
clear(): boolean;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* locale storage manager
|
|
14
|
+
* implements ILocaleStorageManager (injected StorageService)
|
|
15
|
+
*/
|
|
16
|
+
interface ILocaleStorageManager<TSupportedLocales extends readonly string[]> {
|
|
17
|
+
getLocale(): TSupportedLocales[number];
|
|
18
|
+
setLocale(locale: TSupportedLocales[number]): void;
|
|
19
|
+
}
|
|
20
|
+
declare class LocaleStorageManager<TSupportedLocales extends readonly string[], TLocaleSet extends Partial<Record<TSupportedLocales[number], Record<string, any>>>, TTypeSafe extends boolean = false> implements ILocaleStorageManager<TSupportedLocales> {
|
|
21
|
+
private readonly storageService;
|
|
22
|
+
private readonly i18nStore;
|
|
23
|
+
private readonly localeStorageKey;
|
|
24
|
+
observerManager: ObserverManager<TSupportedLocales[number]>;
|
|
25
|
+
constructor(storageService: IStorageService<TSupportedLocales[number]>, i18nStore: I18nStore<TSupportedLocales, TLocaleSet, TTypeSafe>, localeStorageKey?: string);
|
|
26
|
+
private initializeCurrentLocale;
|
|
27
|
+
getLocale: () => TSupportedLocales[number];
|
|
28
|
+
setLocale: (locale: TSupportedLocales[number]) => void;
|
|
29
|
+
}
|
|
5
30
|
|
|
6
31
|
type UseIntlParams<D = MessageDescriptor> = Parameters<IntlShape['$t']> extends [D, ...infer R] ? [...R, Omit<D, 'id'>] : never;
|
|
7
32
|
type ExtendedUseIntlParams<D = MessageDescriptor> = UseIntlParams<D> extends [infer A, infer B, ...infer Rest] ? A extends Record<string, infer V> ? [Record<string, V | React.ReactNode>, B, ...Rest] : [A, B, ...Rest] : UseIntlParams<D>;
|
|
@@ -40,42 +65,26 @@ type IntlProviderProps<TSupportedLocales extends readonly string[], TLocaleSet e
|
|
|
40
65
|
children: React.ReactNode;
|
|
41
66
|
};
|
|
42
67
|
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
removeItem(key: string): boolean;
|
|
47
|
-
clear(): boolean;
|
|
48
|
-
}
|
|
49
|
-
/**
|
|
50
|
-
* locale storage manager
|
|
51
|
-
* implements ILocaleStorageManager (injected StorageService)
|
|
52
|
-
*/
|
|
53
|
-
interface ILocaleStorageManager<TSupportedLocales extends readonly string[]> {
|
|
54
|
-
getLocale(): TSupportedLocales[number];
|
|
55
|
-
setLocale(locale: TSupportedLocales[number]): void;
|
|
56
|
-
}
|
|
57
|
-
declare class LocaleStorageManager<TSupportedLocales extends readonly string[], TLocaleSet extends Partial<Record<TSupportedLocales[number], Record<string, any>>>, TTypeSafe extends boolean = false> implements ILocaleStorageManager<TSupportedLocales> {
|
|
58
|
-
private readonly storageService;
|
|
59
|
-
private readonly i18nStore;
|
|
60
|
-
private readonly localeStorageKey;
|
|
61
|
-
observerManager: ObserverManager<TSupportedLocales[number]>;
|
|
62
|
-
constructor(storageService: IStorageService<TSupportedLocales[number]>, i18nStore: I18nStore<TSupportedLocales, TLocaleSet, TTypeSafe>, localeStorageKey?: string);
|
|
63
|
-
private initializeCurrentLocale;
|
|
64
|
-
getLocale: () => TSupportedLocales[number];
|
|
65
|
-
setLocale: (locale: TSupportedLocales[number]) => void;
|
|
66
|
-
}
|
|
68
|
+
declare function useLocaleStorage<TSupportedLocales extends readonly string[], TLocaleSet extends Partial<Record<TSupportedLocales[number], Record<string, any>>>, TTypeSafe extends boolean = false>(localeStorageManager: LocaleStorageManager<TSupportedLocales, TLocaleSet, TTypeSafe>): {
|
|
69
|
+
locale: TSupportedLocales[number];
|
|
70
|
+
};
|
|
67
71
|
|
|
68
|
-
|
|
72
|
+
interface StorageBasedIntlProviderProps<TSupportedLocales extends readonly string[], TLocaleSet extends Partial<Record<TSupportedLocales[number], Record<string, any>>>, TTypeSafe extends boolean = false> {
|
|
73
|
+
i18nStore: I18nStore<TSupportedLocales, TLocaleSet, TTypeSafe>;
|
|
74
|
+
storageManager: LocaleStorageManager<TSupportedLocales, TLocaleSet, TTypeSafe>;
|
|
75
|
+
children: React.ReactNode;
|
|
76
|
+
}
|
|
69
77
|
|
|
70
78
|
declare function createI18nContext<TSupportedLocales extends readonly string[], TLocaleSet extends Partial<Record<TSupportedLocales[number], Record<string, any>>>, TTypeSafe extends boolean = false>(i18nStore: I18nStore<TSupportedLocales, TLocaleSet, TTypeSafe>): {
|
|
71
79
|
IntlProvider: ({ currentLocale, children, }: Omit<IntlProviderProps<TSupportedLocales, TLocaleSet>, "currentLocale" | "i18nStore"> & {
|
|
72
80
|
currentLocale?: string;
|
|
73
81
|
children?: React.ReactNode;
|
|
74
82
|
}) => react_jsx_runtime.JSX.Element;
|
|
83
|
+
StorageBasedIntlProvider: ({ storageManager, children, }: Omit<StorageBasedIntlProviderProps<TSupportedLocales, TLocaleSet, TTypeSafe>, "i18nStore">) => react_jsx_runtime.JSX.Element;
|
|
75
84
|
useTranslation: <TSheetTitle extends TTypeSafe extends true ? keyof TLocaleSet[TSupportedLocales[number]] extends never ? string : keyof TLocaleSet[TSupportedLocales[number]] : string>(sheetTitle: TSheetTitle) => UseTranslationReturn<TSupportedLocales, TLocaleSet, TTypeSafe, TSheetTitle>;
|
|
76
85
|
getTranslation: <TSheetTitle extends TTypeSafe extends true ? keyof TLocaleSet[TSupportedLocales[number]] extends never ? string : keyof TLocaleSet[TSupportedLocales[number]] : string>(sheetTitle: TSheetTitle) => GetTranslationReturn<TSupportedLocales, TLocaleSet, TTypeSafe, TSheetTitle>;
|
|
77
|
-
getLocaleStorageManager: (
|
|
86
|
+
getLocaleStorageManager: (storageService?: IStorageService<string>) => LocaleStorageManager<TSupportedLocales, TLocaleSet, TTypeSafe>;
|
|
78
87
|
useLocaleStorage: typeof useLocaleStorage;
|
|
79
88
|
};
|
|
80
89
|
|
|
81
|
-
export { createI18nContext };
|
|
90
|
+
export { type IStorageService, createI18nContext };
|
package/dist/index.js
CHANGED
|
@@ -46,11 +46,11 @@ module.exports = __toCommonJS(src_exports);
|
|
|
46
46
|
var import_shared_utils5 = require("@sheet-i18n/shared-utils");
|
|
47
47
|
var import_react_core = require("@sheet-i18n/react-core");
|
|
48
48
|
|
|
49
|
-
// src/IntlProvider.tsx
|
|
49
|
+
// src/Provider/IntlProvider.tsx
|
|
50
50
|
var import_react_intl2 = require("react-intl");
|
|
51
51
|
var import_react2 = require("react");
|
|
52
52
|
|
|
53
|
-
// src/useDynamicLocale.ts
|
|
53
|
+
// src/hooks/useDynamicLocale.ts
|
|
54
54
|
var import_shared_utils2 = require("@sheet-i18n/shared-utils");
|
|
55
55
|
var import_react = require("react");
|
|
56
56
|
|
|
@@ -122,7 +122,7 @@ var IntlInstanceCache = class _IntlInstanceCache {
|
|
|
122
122
|
};
|
|
123
123
|
var intlInstanceCache = IntlInstanceCache.init();
|
|
124
124
|
|
|
125
|
-
// src/useDynamicLocale.ts
|
|
125
|
+
// src/hooks/useDynamicLocale.ts
|
|
126
126
|
function useDynamicLocale(useDynamicLocaleProps) {
|
|
127
127
|
const { i18nStore } = useDynamicLocaleProps != null ? useDynamicLocaleProps : {};
|
|
128
128
|
const currentLocale = i18nStore == null ? void 0 : i18nStore.getCurrentLocale();
|
|
@@ -154,7 +154,7 @@ ${err}`);
|
|
|
154
154
|
};
|
|
155
155
|
}
|
|
156
156
|
|
|
157
|
-
// src/IntlProvider.tsx
|
|
157
|
+
// src/Provider/IntlProvider.tsx
|
|
158
158
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
159
159
|
function IntlProvider({
|
|
160
160
|
i18nStore,
|
|
@@ -247,7 +247,7 @@ var TranslationService = class {
|
|
|
247
247
|
}
|
|
248
248
|
};
|
|
249
249
|
|
|
250
|
-
// src/useTranslation.ts
|
|
250
|
+
// src/hooks/useTranslation.ts
|
|
251
251
|
function useTranslation({
|
|
252
252
|
sheetTitle,
|
|
253
253
|
i18nStore
|
|
@@ -274,7 +274,7 @@ var InvalidI18nContextStateError = class extends import_errors.CustomError {
|
|
|
274
274
|
var IsNotInstanceOfI18nStoreError = class extends import_errors.CustomError {
|
|
275
275
|
};
|
|
276
276
|
|
|
277
|
-
// src/getTranslation.ts
|
|
277
|
+
// src/hooks/getTranslation.ts
|
|
278
278
|
function getTranslation({
|
|
279
279
|
sheetTitle,
|
|
280
280
|
i18nStore
|
|
@@ -318,9 +318,9 @@ function getTranslation({
|
|
|
318
318
|
return { t };
|
|
319
319
|
}
|
|
320
320
|
|
|
321
|
-
// src/Service/
|
|
321
|
+
// src/Service/StorageService.ts
|
|
322
322
|
var import_shared_utils4 = require("@sheet-i18n/shared-utils");
|
|
323
|
-
var
|
|
323
|
+
var StorageService = class {
|
|
324
324
|
constructor(storage) {
|
|
325
325
|
this.storage = null;
|
|
326
326
|
this.isClientSide = typeof window !== "undefined";
|
|
@@ -418,11 +418,10 @@ var LocaleStorageManager = class {
|
|
|
418
418
|
this.observerManager = new import_shared_utils4.ObserverManager();
|
|
419
419
|
this.initializeCurrentLocale = () => {
|
|
420
420
|
var _a, _b;
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
);
|
|
421
|
+
const storedLocale = this.storageService.getItem(this.localeStorageKey);
|
|
422
|
+
if (!storedLocale || storedLocale === "") {
|
|
423
|
+
const defaultLocale = this.i18nStore.currentLocale || this.i18nStore.defaultLocale;
|
|
424
|
+
this.storageService.setItem(this.localeStorageKey, defaultLocale);
|
|
426
425
|
}
|
|
427
426
|
(_b = (_a = this.i18nStore) == null ? void 0 : _a.observerManager) == null ? void 0 : _b.addListener({
|
|
428
427
|
listenerId: this.localeStorageKey,
|
|
@@ -433,40 +432,66 @@ var LocaleStorageManager = class {
|
|
|
433
432
|
};
|
|
434
433
|
this.getLocale = () => {
|
|
435
434
|
const stored = this.storageService.getItem(this.localeStorageKey);
|
|
436
|
-
|
|
435
|
+
if (!stored || stored === "") {
|
|
436
|
+
return this.i18nStore.defaultLocale;
|
|
437
|
+
}
|
|
438
|
+
return stored;
|
|
437
439
|
};
|
|
438
440
|
this.setLocale = (locale) => {
|
|
439
441
|
this.storageService.setItem(this.localeStorageKey, locale);
|
|
442
|
+
this.i18nStore.setCurrentLocale(locale);
|
|
440
443
|
this.observerManager.notify(locale);
|
|
441
444
|
};
|
|
442
445
|
this.initializeCurrentLocale();
|
|
443
446
|
}
|
|
444
447
|
};
|
|
448
|
+
var getLocaleStorageManager = (i18nStore, storage) => {
|
|
449
|
+
const localeStorageService = new StorageService(storage);
|
|
450
|
+
const localeStorageManager = new LocaleStorageManager(
|
|
451
|
+
localeStorageService,
|
|
452
|
+
i18nStore
|
|
453
|
+
);
|
|
454
|
+
return localeStorageManager;
|
|
455
|
+
};
|
|
445
456
|
|
|
446
|
-
// src/useLocaleStorage.ts
|
|
457
|
+
// src/hooks/useLocaleStorage.ts
|
|
447
458
|
var import_react3 = require("react");
|
|
448
|
-
var LISTENER_ID = "LOCALE_STORAGE_LISTENER_ID";
|
|
449
459
|
function useLocaleStorage(localeStorageManager) {
|
|
450
460
|
var _a;
|
|
451
461
|
const [locale, setLocale] = (0, import_react3.useState)((_a = localeStorageManager == null ? void 0 : localeStorageManager.getLocale) == null ? void 0 : _a.call(localeStorageManager));
|
|
462
|
+
const listenerIdRef = (0, import_react3.useRef)(
|
|
463
|
+
`LOCALE_STORAGE_LISTENER_${Math.random().toString(36).substring(2, 11)}`
|
|
464
|
+
);
|
|
452
465
|
(0, import_react3.useEffect)(() => {
|
|
453
466
|
var _a2;
|
|
467
|
+
const listenerId = listenerIdRef.current;
|
|
454
468
|
(_a2 = localeStorageManager == null ? void 0 : localeStorageManager.observerManager) == null ? void 0 : _a2.addListener({
|
|
455
|
-
listenerId
|
|
469
|
+
listenerId,
|
|
456
470
|
listener: (newLocale) => {
|
|
457
471
|
setLocale(newLocale);
|
|
458
472
|
}
|
|
459
473
|
});
|
|
460
474
|
return () => {
|
|
461
475
|
var _a3;
|
|
462
|
-
(_a3 = localeStorageManager == null ? void 0 : localeStorageManager.observerManager) == null ? void 0 : _a3.removeListener(
|
|
476
|
+
(_a3 = localeStorageManager == null ? void 0 : localeStorageManager.observerManager) == null ? void 0 : _a3.removeListener(listenerId);
|
|
463
477
|
};
|
|
464
|
-
}, []);
|
|
465
|
-
return locale;
|
|
478
|
+
}, [localeStorageManager]);
|
|
479
|
+
return { locale };
|
|
466
480
|
}
|
|
467
481
|
|
|
468
|
-
// src/
|
|
482
|
+
// src/Provider/StorageBasedIntlProvider.tsx
|
|
469
483
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
484
|
+
function StorageBasedIntlProvider({
|
|
485
|
+
i18nStore,
|
|
486
|
+
storageManager,
|
|
487
|
+
children
|
|
488
|
+
}) {
|
|
489
|
+
const { locale } = useLocaleStorage(storageManager);
|
|
490
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(IntlProvider, { currentLocale: locale, i18nStore, children });
|
|
491
|
+
}
|
|
492
|
+
|
|
493
|
+
// src/createI18nContext.tsx
|
|
494
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
470
495
|
function createI18nContext(i18nStore) {
|
|
471
496
|
if (import_shared_utils5.validator.isNullish(i18nStore)) {
|
|
472
497
|
throw new InvalidI18nContextStateError(
|
|
@@ -481,7 +506,7 @@ function createI18nContext(i18nStore) {
|
|
|
481
506
|
const IntlProviderImpl = ({
|
|
482
507
|
currentLocale,
|
|
483
508
|
children
|
|
484
|
-
}) => /* @__PURE__ */ (0,
|
|
509
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
485
510
|
IntlProvider,
|
|
486
511
|
{
|
|
487
512
|
currentLocale,
|
|
@@ -489,21 +514,28 @@ function createI18nContext(i18nStore) {
|
|
|
489
514
|
children
|
|
490
515
|
}
|
|
491
516
|
);
|
|
517
|
+
const StorageBasedIntlProviderImpl = ({
|
|
518
|
+
storageManager,
|
|
519
|
+
children
|
|
520
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
521
|
+
StorageBasedIntlProvider,
|
|
522
|
+
{
|
|
523
|
+
i18nStore,
|
|
524
|
+
storageManager,
|
|
525
|
+
children
|
|
526
|
+
}
|
|
527
|
+
);
|
|
492
528
|
const useTranslationImpl = (sheetTitle) => useTranslation({ sheetTitle, i18nStore });
|
|
493
529
|
const getTranslationImpl = (sheetTitle) => getTranslation({ sheetTitle, i18nStore });
|
|
494
|
-
const
|
|
495
|
-
|
|
496
|
-
const localeStorageManager = new LocaleStorageManager(
|
|
497
|
-
localStorageService,
|
|
498
|
-
i18nStore
|
|
499
|
-
);
|
|
500
|
-
return localeStorageManager;
|
|
530
|
+
const getLocaleStorageManagerImpl = (storageService) => {
|
|
531
|
+
return getLocaleStorageManager(i18nStore, storageService);
|
|
501
532
|
};
|
|
502
533
|
return {
|
|
503
534
|
IntlProvider: IntlProviderImpl,
|
|
535
|
+
StorageBasedIntlProvider: StorageBasedIntlProviderImpl,
|
|
504
536
|
useTranslation: useTranslationImpl,
|
|
505
537
|
getTranslation: getTranslationImpl,
|
|
506
|
-
getLocaleStorageManager,
|
|
538
|
+
getLocaleStorageManager: getLocaleStorageManagerImpl,
|
|
507
539
|
useLocaleStorage
|
|
508
540
|
};
|
|
509
541
|
}
|
package/dist/index.mjs
CHANGED
|
@@ -23,11 +23,11 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
23
23
|
import { validator as validator4 } from "@sheet-i18n/shared-utils";
|
|
24
24
|
import { I18nStore } from "@sheet-i18n/react-core";
|
|
25
25
|
|
|
26
|
-
// src/IntlProvider.tsx
|
|
26
|
+
// src/Provider/IntlProvider.tsx
|
|
27
27
|
import { IntlProvider as ReactIntlProvider } from "react-intl";
|
|
28
28
|
import { useEffect } from "react";
|
|
29
29
|
|
|
30
|
-
// src/useDynamicLocale.ts
|
|
30
|
+
// src/hooks/useDynamicLocale.ts
|
|
31
31
|
import { validator as validator2 } from "@sheet-i18n/shared-utils";
|
|
32
32
|
import { useLayoutEffect, useState } from "react";
|
|
33
33
|
|
|
@@ -99,7 +99,7 @@ var IntlInstanceCache = class _IntlInstanceCache {
|
|
|
99
99
|
};
|
|
100
100
|
var intlInstanceCache = IntlInstanceCache.init();
|
|
101
101
|
|
|
102
|
-
// src/useDynamicLocale.ts
|
|
102
|
+
// src/hooks/useDynamicLocale.ts
|
|
103
103
|
function useDynamicLocale(useDynamicLocaleProps) {
|
|
104
104
|
const { i18nStore } = useDynamicLocaleProps != null ? useDynamicLocaleProps : {};
|
|
105
105
|
const currentLocale = i18nStore == null ? void 0 : i18nStore.getCurrentLocale();
|
|
@@ -131,7 +131,7 @@ ${err}`);
|
|
|
131
131
|
};
|
|
132
132
|
}
|
|
133
133
|
|
|
134
|
-
// src/IntlProvider.tsx
|
|
134
|
+
// src/Provider/IntlProvider.tsx
|
|
135
135
|
import { jsx } from "react/jsx-runtime";
|
|
136
136
|
function IntlProvider({
|
|
137
137
|
i18nStore,
|
|
@@ -224,7 +224,7 @@ var TranslationService = class {
|
|
|
224
224
|
}
|
|
225
225
|
};
|
|
226
226
|
|
|
227
|
-
// src/useTranslation.ts
|
|
227
|
+
// src/hooks/useTranslation.ts
|
|
228
228
|
function useTranslation({
|
|
229
229
|
sheetTitle,
|
|
230
230
|
i18nStore
|
|
@@ -251,7 +251,7 @@ var InvalidI18nContextStateError = class extends CustomError {
|
|
|
251
251
|
var IsNotInstanceOfI18nStoreError = class extends CustomError {
|
|
252
252
|
};
|
|
253
253
|
|
|
254
|
-
// src/getTranslation.ts
|
|
254
|
+
// src/hooks/getTranslation.ts
|
|
255
255
|
function getTranslation({
|
|
256
256
|
sheetTitle,
|
|
257
257
|
i18nStore
|
|
@@ -295,9 +295,9 @@ function getTranslation({
|
|
|
295
295
|
return { t };
|
|
296
296
|
}
|
|
297
297
|
|
|
298
|
-
// src/Service/
|
|
298
|
+
// src/Service/StorageService.ts
|
|
299
299
|
import { ObserverManager } from "@sheet-i18n/shared-utils";
|
|
300
|
-
var
|
|
300
|
+
var StorageService = class {
|
|
301
301
|
constructor(storage) {
|
|
302
302
|
this.storage = null;
|
|
303
303
|
this.isClientSide = typeof window !== "undefined";
|
|
@@ -395,11 +395,10 @@ var LocaleStorageManager = class {
|
|
|
395
395
|
this.observerManager = new ObserverManager();
|
|
396
396
|
this.initializeCurrentLocale = () => {
|
|
397
397
|
var _a, _b;
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
);
|
|
398
|
+
const storedLocale = this.storageService.getItem(this.localeStorageKey);
|
|
399
|
+
if (!storedLocale || storedLocale === "") {
|
|
400
|
+
const defaultLocale = this.i18nStore.currentLocale || this.i18nStore.defaultLocale;
|
|
401
|
+
this.storageService.setItem(this.localeStorageKey, defaultLocale);
|
|
403
402
|
}
|
|
404
403
|
(_b = (_a = this.i18nStore) == null ? void 0 : _a.observerManager) == null ? void 0 : _b.addListener({
|
|
405
404
|
listenerId: this.localeStorageKey,
|
|
@@ -410,40 +409,66 @@ var LocaleStorageManager = class {
|
|
|
410
409
|
};
|
|
411
410
|
this.getLocale = () => {
|
|
412
411
|
const stored = this.storageService.getItem(this.localeStorageKey);
|
|
413
|
-
|
|
412
|
+
if (!stored || stored === "") {
|
|
413
|
+
return this.i18nStore.defaultLocale;
|
|
414
|
+
}
|
|
415
|
+
return stored;
|
|
414
416
|
};
|
|
415
417
|
this.setLocale = (locale) => {
|
|
416
418
|
this.storageService.setItem(this.localeStorageKey, locale);
|
|
419
|
+
this.i18nStore.setCurrentLocale(locale);
|
|
417
420
|
this.observerManager.notify(locale);
|
|
418
421
|
};
|
|
419
422
|
this.initializeCurrentLocale();
|
|
420
423
|
}
|
|
421
424
|
};
|
|
425
|
+
var getLocaleStorageManager = (i18nStore, storage) => {
|
|
426
|
+
const localeStorageService = new StorageService(storage);
|
|
427
|
+
const localeStorageManager = new LocaleStorageManager(
|
|
428
|
+
localeStorageService,
|
|
429
|
+
i18nStore
|
|
430
|
+
);
|
|
431
|
+
return localeStorageManager;
|
|
432
|
+
};
|
|
422
433
|
|
|
423
|
-
// src/useLocaleStorage.ts
|
|
424
|
-
import { useEffect as useEffect2, useState as useState2 } from "react";
|
|
425
|
-
var LISTENER_ID = "LOCALE_STORAGE_LISTENER_ID";
|
|
434
|
+
// src/hooks/useLocaleStorage.ts
|
|
435
|
+
import { useEffect as useEffect2, useState as useState2, useRef } from "react";
|
|
426
436
|
function useLocaleStorage(localeStorageManager) {
|
|
427
437
|
var _a;
|
|
428
438
|
const [locale, setLocale] = useState2((_a = localeStorageManager == null ? void 0 : localeStorageManager.getLocale) == null ? void 0 : _a.call(localeStorageManager));
|
|
439
|
+
const listenerIdRef = useRef(
|
|
440
|
+
`LOCALE_STORAGE_LISTENER_${Math.random().toString(36).substring(2, 11)}`
|
|
441
|
+
);
|
|
429
442
|
useEffect2(() => {
|
|
430
443
|
var _a2;
|
|
444
|
+
const listenerId = listenerIdRef.current;
|
|
431
445
|
(_a2 = localeStorageManager == null ? void 0 : localeStorageManager.observerManager) == null ? void 0 : _a2.addListener({
|
|
432
|
-
listenerId
|
|
446
|
+
listenerId,
|
|
433
447
|
listener: (newLocale) => {
|
|
434
448
|
setLocale(newLocale);
|
|
435
449
|
}
|
|
436
450
|
});
|
|
437
451
|
return () => {
|
|
438
452
|
var _a3;
|
|
439
|
-
(_a3 = localeStorageManager == null ? void 0 : localeStorageManager.observerManager) == null ? void 0 : _a3.removeListener(
|
|
453
|
+
(_a3 = localeStorageManager == null ? void 0 : localeStorageManager.observerManager) == null ? void 0 : _a3.removeListener(listenerId);
|
|
440
454
|
};
|
|
441
|
-
}, []);
|
|
442
|
-
return locale;
|
|
455
|
+
}, [localeStorageManager]);
|
|
456
|
+
return { locale };
|
|
443
457
|
}
|
|
444
458
|
|
|
445
|
-
// src/
|
|
459
|
+
// src/Provider/StorageBasedIntlProvider.tsx
|
|
446
460
|
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
461
|
+
function StorageBasedIntlProvider({
|
|
462
|
+
i18nStore,
|
|
463
|
+
storageManager,
|
|
464
|
+
children
|
|
465
|
+
}) {
|
|
466
|
+
const { locale } = useLocaleStorage(storageManager);
|
|
467
|
+
return /* @__PURE__ */ jsx2(IntlProvider, { currentLocale: locale, i18nStore, children });
|
|
468
|
+
}
|
|
469
|
+
|
|
470
|
+
// src/createI18nContext.tsx
|
|
471
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
447
472
|
function createI18nContext(i18nStore) {
|
|
448
473
|
if (validator4.isNullish(i18nStore)) {
|
|
449
474
|
throw new InvalidI18nContextStateError(
|
|
@@ -458,7 +483,7 @@ function createI18nContext(i18nStore) {
|
|
|
458
483
|
const IntlProviderImpl = ({
|
|
459
484
|
currentLocale,
|
|
460
485
|
children
|
|
461
|
-
}) => /* @__PURE__ */
|
|
486
|
+
}) => /* @__PURE__ */ jsx3(
|
|
462
487
|
IntlProvider,
|
|
463
488
|
{
|
|
464
489
|
currentLocale,
|
|
@@ -466,21 +491,28 @@ function createI18nContext(i18nStore) {
|
|
|
466
491
|
children
|
|
467
492
|
}
|
|
468
493
|
);
|
|
494
|
+
const StorageBasedIntlProviderImpl = ({
|
|
495
|
+
storageManager,
|
|
496
|
+
children
|
|
497
|
+
}) => /* @__PURE__ */ jsx3(
|
|
498
|
+
StorageBasedIntlProvider,
|
|
499
|
+
{
|
|
500
|
+
i18nStore,
|
|
501
|
+
storageManager,
|
|
502
|
+
children
|
|
503
|
+
}
|
|
504
|
+
);
|
|
469
505
|
const useTranslationImpl = (sheetTitle) => useTranslation({ sheetTitle, i18nStore });
|
|
470
506
|
const getTranslationImpl = (sheetTitle) => getTranslation({ sheetTitle, i18nStore });
|
|
471
|
-
const
|
|
472
|
-
|
|
473
|
-
const localeStorageManager = new LocaleStorageManager(
|
|
474
|
-
localStorageService,
|
|
475
|
-
i18nStore
|
|
476
|
-
);
|
|
477
|
-
return localeStorageManager;
|
|
507
|
+
const getLocaleStorageManagerImpl = (storageService) => {
|
|
508
|
+
return getLocaleStorageManager(i18nStore, storageService);
|
|
478
509
|
};
|
|
479
510
|
return {
|
|
480
511
|
IntlProvider: IntlProviderImpl,
|
|
512
|
+
StorageBasedIntlProvider: StorageBasedIntlProviderImpl,
|
|
481
513
|
useTranslation: useTranslationImpl,
|
|
482
514
|
getTranslation: getTranslationImpl,
|
|
483
|
-
getLocaleStorageManager,
|
|
515
|
+
getLocaleStorageManager: getLocaleStorageManagerImpl,
|
|
484
516
|
useLocaleStorage
|
|
485
517
|
};
|
|
486
518
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sheet-i18n/react-client",
|
|
3
|
-
"version": "1.5.0-canary.
|
|
3
|
+
"version": "1.5.0-canary.2",
|
|
4
4
|
"description": "a client package for react modules used by sheet-i18n",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"module": "./dist/index.mjs",
|
|
@@ -25,8 +25,8 @@
|
|
|
25
25
|
},
|
|
26
26
|
"license": "ISC",
|
|
27
27
|
"dependencies": {
|
|
28
|
-
"@sheet-i18n/shared-utils": "1.8.0-canary.0",
|
|
29
28
|
"@sheet-i18n/errors": "1.8.0-canary.0",
|
|
29
|
+
"@sheet-i18n/shared-utils": "1.8.0-canary.0",
|
|
30
30
|
"@sheet-i18n/react-core": "1.5.0-canary.0"
|
|
31
31
|
},
|
|
32
32
|
"devDependencies": {
|