locon 1.2.0 → 1.3.0

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.
Files changed (4) hide show
  1. package/README.md +11 -36
  2. package/dist/index.js +59 -159
  3. package/dist/index.mjs +16 -145
  4. package/package.json +1 -1
package/README.md CHANGED
@@ -14,18 +14,6 @@ function Example() {
14
14
  }
15
15
  ```
16
16
 
17
- For dynamic strings (variables), use `useLocon()` and `l()`:
18
-
19
- ```tsx
20
- import { Text } from 'react-native'
21
- import { useLocon } from 'locon'
22
-
23
- function Example({ userName }: { userName: string }) {
24
- const { l } = useLocon()
25
- return <Text>{l('hello')}, {userName}</Text>
26
- }
27
- ```
28
-
29
17
  ---
30
18
 
31
19
  ### Features
@@ -47,29 +35,19 @@ npm install locon
47
35
  yarn add locon
48
36
  ```
49
37
 
50
- **Peer dependencies**
51
-
52
- - `react >= 19.0.0`
53
- - `react-native >= 0.70.0`
54
- - `react-native-localize >= 3.0.0` (optional, recommended)
55
-
56
- **Optional: Enhanced language detection**
57
-
58
- For more accurate device language detection on iOS and Android, install `react-native-localize`:
38
+ **Important:** After installation, run pod install for iOS:
59
39
 
60
40
  ```bash
61
- npm install react-native-localize
62
- # or
63
- yarn add react-native-localize
41
+ cd ios && pod install
64
42
  ```
65
43
 
66
- Then run pod install for iOS:
44
+ **Peer dependencies**
67
45
 
68
- ```bash
69
- cd ios && pod install
70
- ```
46
+ - `react >= 19.0.0`
47
+ - `react-native >= 0.70.0`
48
+ - `react-native-localize >= 3.0.0` (installed automatically)
71
49
 
72
- If `react-native-localize` is not installed, `locon` will use fallback methods (native modules, `navigator.languages`, `Intl` API) to detect the system language. The library works fine without it, but `react-native-localize` provides the most accurate detection.
50
+ `react-native-localize` is used for accurate device language detection on iOS and Android.
73
51
 
74
52
  ---
75
53
 
@@ -135,13 +113,10 @@ export default App
135
113
  If `currentLocale` is not provided and `autodetect` is `true` (default),
136
114
  `locon` will:
137
115
 
138
- 1. Try to use `react-native-localize` to detect device locale on iOS/Android (if installed)
139
- 2. If `react-native-localize` is not available, use fallback methods in order:
140
- - Native modules (`SettingsManager` on iOS, `I18nManager` on Android/iOS)
141
- - `Intl.DateTimeFormat().resolvedOptions().locale`
142
- 3. Match the detected locale (including region) or just language code against your `assets`
143
- 4. If a match is found, use it as initial locale
144
- 5. Otherwise, fall back to `defaultLocale`
116
+ 1. Use `react-native-localize` to detect device locale on iOS/Android
117
+ 2. Match the detected locale (including region) or just language code against your `assets`
118
+ 3. If a match is found, use it as initial locale
119
+ 4. Otherwise, fall back to `defaultLocale`
145
120
 
146
121
  #### 3. Use the `useLocon()` hook
147
122
 
package/dist/index.js CHANGED
@@ -1,145 +1,45 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var react = require('react');
6
- var reactNative = require('react-native');
7
- var jsxRuntime = require('react/jsx-runtime');
8
-
9
- var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
10
- get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
11
- }) : x)(function(x) {
12
- if (typeof require !== "undefined") return require.apply(this, arguments);
13
- throw Error('Dynamic require of "' + x + '" is not supported');
14
- });
15
-
16
- // src/locon/utils/getSystemLanguage.ts
17
- function getSystemLanguage(availableLocales) {
18
- if (!availableLocales?.length) return null;
19
- console.log("[getSystemLanguage] === START ===");
20
- console.log("[getSystemLanguage] Available locales:", availableLocales);
21
- try {
22
- try {
23
- const RNLocalize = __require("react-native-localize");
24
- if (RNLocalize) {
25
- if (typeof RNLocalize.findBestLanguageTag === "function") {
26
- const best = RNLocalize.findBestLanguageTag(availableLocales);
27
- if (best?.languageTag) {
28
- const languageTag = best.languageTag;
29
- const languageCode = languageTag.split("-")[0]?.toLowerCase();
30
- if (availableLocales.includes(languageTag)) {
31
- return languageTag;
32
- }
33
- if (languageCode && availableLocales.includes(languageCode)) {
34
- console.log("[getSystemLanguage] \u2705 Found via findBestLanguageTag:", languageCode);
35
- return languageCode;
36
- }
37
- }
38
- }
39
- if (typeof RNLocalize.getLocales === "function") {
40
- const locales = RNLocalize.getLocales();
41
- console.log("[getSystemLanguage] System locales from getLocales():", JSON.stringify(locales, null, 2));
42
- for (const locale of locales) {
43
- const languageCode = locale.languageCode?.toLowerCase();
44
- console.log("[getSystemLanguage] Checking locale:", locale.languageCode, "->", languageCode);
45
- if (languageCode && availableLocales.includes(languageCode)) {
46
- console.log("[getSystemLanguage] \u2705 Found via getLocales languageCode:", languageCode);
47
- return languageCode;
48
- }
49
- if (locale.languageTag) {
50
- const tagCode = locale.languageTag.split("-")[0]?.toLowerCase();
51
- console.log("[getSystemLanguage] Checking languageTag:", locale.languageTag, "->", tagCode);
52
- if (tagCode && availableLocales.includes(tagCode)) {
53
- console.log("[getSystemLanguage] \u2705 Found via getLocales languageTag:", tagCode);
54
- return tagCode;
55
- }
56
- }
57
- }
58
- } else {
59
- console.log("[getSystemLanguage] \u26A0\uFE0F getLocales() is not available");
60
- }
61
- } else {
62
- console.log("[getSystemLanguage] \u26A0\uFE0F react-native-localize module not found or not linked");
63
- }
64
- } catch (localizeError) {
65
- console.log("[getSystemLanguage] \u274C react-native-localize error:", localizeError);
66
- }
67
- try {
68
- const reactNative = __require("react-native");
69
- const { NativeModules, Platform } = reactNative;
70
- if (Platform?.OS === "ios") {
71
- const SettingsManager = NativeModules?.SettingsManager;
72
- if (SettingsManager?.settings?.AppleLanguages) {
73
- const appleLanguages = SettingsManager.settings.AppleLanguages;
74
- console.log("[getSystemLanguage] iOS AppleLanguages:", appleLanguages);
75
- for (const lang of appleLanguages) {
76
- const languageCode = lang.split("-")[0]?.toLowerCase();
77
- if (languageCode) {
78
- const supportedLanguage = availableLocales.find((locale) => locale === languageCode);
79
- if (supportedLanguage) {
80
- console.log("[getSystemLanguage] \u2705 Found via iOS SettingsManager:", supportedLanguage);
81
- return supportedLanguage;
82
- }
83
- }
84
- }
85
- }
86
- const I18nManager = NativeModules?.I18nManager;
87
- if (I18nManager?.localeIdentifier) {
88
- const languageCode = I18nManager.localeIdentifier.split("-")[0]?.toLowerCase();
89
- if (languageCode) {
90
- const supportedLanguage = availableLocales.find((locale) => locale === languageCode);
91
- if (supportedLanguage) {
92
- return supportedLanguage;
93
- }
94
- }
95
- }
96
- } else if (Platform?.OS === "android") {
97
- const I18nManager = NativeModules?.I18nManager;
98
- if (I18nManager?.localeIdentifier) {
99
- const languageCode = I18nManager.localeIdentifier.split("-")[0]?.toLowerCase();
100
- if (languageCode) {
101
- const supportedLanguage = availableLocales.find((locale) => locale === languageCode);
102
- if (supportedLanguage) {
103
- return supportedLanguage;
104
- }
105
- }
106
- }
107
- }
108
- } catch (rnError) {
109
- }
110
- const systemLocale = Intl.DateTimeFormat().resolvedOptions().locale;
111
- console.log("[getSystemLanguage] Intl locale:", systemLocale);
112
- if (systemLocale) {
113
- const languageCode = systemLocale.split("-")[0]?.toLowerCase();
114
- if (languageCode) {
115
- const supportedLanguage = availableLocales.find((locale) => locale === languageCode);
116
- if (supportedLanguage) {
117
- console.log("[getSystemLanguage] \u2705 Found via Intl API:", supportedLanguage);
118
- return supportedLanguage;
119
- }
120
- }
121
- }
122
- console.log("[getSystemLanguage] \u274C No matching locale found, returning null");
123
- console.log("[getSystemLanguage] === END ===");
124
- return null;
125
- } catch (error) {
126
- console.log("Could not detect system language:", error);
127
- return null;
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
128
17
  }
129
- }
130
- function useLocon() {
131
- const locon = react.useContext(LoconContext);
132
- return locon;
133
- }
134
- var useLocon_default = useLocon;
135
- function LText({ children, assetKey, ...props }) {
136
- const { l } = useLocon_default();
137
- return /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { ...props, children: l(assetKey || children) });
138
- }
139
- var LText_default = LText;
140
- console.log("\u{1F680}\u{1F680}\u{1F680} [LOCON] LOCAL VERSION LOADED! \u{1F680}\u{1F680}\u{1F680}");
141
- console.log("[LOCON] This log means we are using the local source from ../../../locon/locon/src/locon");
142
- var LoconContext = react.createContext({
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+ var locon_exports = {};
30
+ __export(locon_exports, {
31
+ LText: () => import_LText.default,
32
+ LoconContext: () => LoconContext,
33
+ default: () => locon_default,
34
+ useLocon: () => import_useLocon.default
35
+ });
36
+ module.exports = __toCommonJS(locon_exports);
37
+ var import_jsx_runtime = require("react/jsx-runtime");
38
+ var import_react = require("react");
39
+ var import_getSystemLanguage = __toESM(require("./utils/getSystemLanguage"));
40
+ var import_LText = __toESM(require("./components/LText"));
41
+ var import_useLocon = __toESM(require("./hooks/useLocon"));
42
+ const LoconContext = (0, import_react.createContext)({
143
43
  assets: {},
144
44
  currentLocale: "en",
145
45
  defaultLocale: "en",
@@ -158,41 +58,40 @@ function Locon({
158
58
  projectLocale = "en",
159
59
  autodetect = true
160
60
  }) {
161
- const [currentLocale, setCurrentLocale] = react.useState(() => {
61
+ const [currentLocale, setCurrentLocale] = (0, import_react.useState)(() => {
162
62
  if (currentLocaleProps) {
163
63
  return currentLocaleProps;
164
64
  }
165
65
  if (autodetect) {
166
- const availableLocales = Object.keys(assets);
167
- const systemLang = getSystemLanguage(availableLocales);
168
- if (systemLang && assets[systemLang]) {
169
- return systemLang;
66
+ const systemLocale = (0, import_getSystemLanguage.default)(Object.keys(assets));
67
+ if (systemLocale && assets[systemLocale]) {
68
+ return systemLocale;
170
69
  }
171
70
  }
172
71
  return defaultLocale;
173
72
  });
174
- const getAssets = react.useCallback(() => {
73
+ const getAssets = (0, import_react.useCallback)(() => {
175
74
  const currentAssets = assets[currentLocale] ?? assets[defaultLocale];
176
75
  return currentAssets ?? {};
177
76
  }, [assets, currentLocale, defaultLocale]);
178
- const getAsset = react.useCallback(
77
+ const getAsset = (0, import_react.useCallback)(
179
78
  (assetKey) => {
180
79
  const assetsObj = getAssets();
181
80
  return assetsObj[assetKey] ?? "";
182
81
  },
183
82
  [getAssets]
184
83
  );
185
- const setCurrentLocaleHandler = react.useCallback(
84
+ const setCurrentLocaleHandler = (0, import_react.useCallback)(
186
85
  (locale) => {
187
86
  if (assets[locale]) {
188
87
  setCurrentLocale(locale);
189
88
  } else {
190
- console.warn(`Locale "${locale}" not found in assets.`);
89
+ console.warn(`[locon] Locale "${locale}" not found in assets.`);
191
90
  }
192
91
  },
193
92
  [assets]
194
93
  );
195
- const getAssetByValue = react.useCallback(
94
+ const getAssetByValue = (0, import_react.useCallback)(
196
95
  (assetValue, locale = projectLocale) => {
197
96
  const currentAssets = assets[locale];
198
97
  if (!currentAssets) {
@@ -203,7 +102,7 @@ function Locon({
203
102
  },
204
103
  [assets, getAsset, projectLocale]
205
104
  );
206
- const l = react.useCallback(
105
+ const l = (0, import_react.useCallback)(
207
106
  (assetKey) => {
208
107
  if (!assetKey) {
209
108
  return "";
@@ -213,7 +112,7 @@ function Locon({
213
112
  },
214
113
  [getAsset, getAssetByValue, defaultLocale]
215
114
  );
216
- const value = react.useMemo(
115
+ const value = (0, import_react.useMemo)(
217
116
  () => ({
218
117
  assets,
219
118
  currentLocale,
@@ -224,11 +123,12 @@ function Locon({
224
123
  }),
225
124
  [assets, currentLocale, defaultLocale, autodetect, l, setCurrentLocaleHandler]
226
125
  );
227
- return /* @__PURE__ */ jsxRuntime.jsx(LoconContext, { value, children });
126
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LoconContext, { value, children });
228
127
  }
229
128
  var locon_default = Locon;
230
-
231
- exports.LText = LText_default;
232
- exports.LoconContext = LoconContext;
233
- exports.default = locon_default;
234
- exports.useLocon = useLocon_default;
129
+ // Annotate the CommonJS export names for ESM import in node:
130
+ 0 && (module.exports = {
131
+ LText,
132
+ LoconContext,
133
+ useLocon
134
+ });
package/dist/index.mjs CHANGED
@@ -1,141 +1,7 @@
1
- import { createContext, useContext, useState, useCallback, useMemo } from 'react';
2
- import { Text } from 'react-native';
3
- import { jsx } from 'react/jsx-runtime';
4
-
5
- var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
6
- get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
7
- }) : x)(function(x) {
8
- if (typeof require !== "undefined") return require.apply(this, arguments);
9
- throw Error('Dynamic require of "' + x + '" is not supported');
10
- });
11
-
12
- // src/locon/utils/getSystemLanguage.ts
13
- function getSystemLanguage(availableLocales) {
14
- if (!availableLocales?.length) return null;
15
- console.log("[getSystemLanguage] === START ===");
16
- console.log("[getSystemLanguage] Available locales:", availableLocales);
17
- try {
18
- try {
19
- const RNLocalize = __require("react-native-localize");
20
- if (RNLocalize) {
21
- if (typeof RNLocalize.findBestLanguageTag === "function") {
22
- const best = RNLocalize.findBestLanguageTag(availableLocales);
23
- if (best?.languageTag) {
24
- const languageTag = best.languageTag;
25
- const languageCode = languageTag.split("-")[0]?.toLowerCase();
26
- if (availableLocales.includes(languageTag)) {
27
- return languageTag;
28
- }
29
- if (languageCode && availableLocales.includes(languageCode)) {
30
- console.log("[getSystemLanguage] \u2705 Found via findBestLanguageTag:", languageCode);
31
- return languageCode;
32
- }
33
- }
34
- }
35
- if (typeof RNLocalize.getLocales === "function") {
36
- const locales = RNLocalize.getLocales();
37
- console.log("[getSystemLanguage] System locales from getLocales():", JSON.stringify(locales, null, 2));
38
- for (const locale of locales) {
39
- const languageCode = locale.languageCode?.toLowerCase();
40
- console.log("[getSystemLanguage] Checking locale:", locale.languageCode, "->", languageCode);
41
- if (languageCode && availableLocales.includes(languageCode)) {
42
- console.log("[getSystemLanguage] \u2705 Found via getLocales languageCode:", languageCode);
43
- return languageCode;
44
- }
45
- if (locale.languageTag) {
46
- const tagCode = locale.languageTag.split("-")[0]?.toLowerCase();
47
- console.log("[getSystemLanguage] Checking languageTag:", locale.languageTag, "->", tagCode);
48
- if (tagCode && availableLocales.includes(tagCode)) {
49
- console.log("[getSystemLanguage] \u2705 Found via getLocales languageTag:", tagCode);
50
- return tagCode;
51
- }
52
- }
53
- }
54
- } else {
55
- console.log("[getSystemLanguage] \u26A0\uFE0F getLocales() is not available");
56
- }
57
- } else {
58
- console.log("[getSystemLanguage] \u26A0\uFE0F react-native-localize module not found or not linked");
59
- }
60
- } catch (localizeError) {
61
- console.log("[getSystemLanguage] \u274C react-native-localize error:", localizeError);
62
- }
63
- try {
64
- const reactNative = __require("react-native");
65
- const { NativeModules, Platform } = reactNative;
66
- if (Platform?.OS === "ios") {
67
- const SettingsManager = NativeModules?.SettingsManager;
68
- if (SettingsManager?.settings?.AppleLanguages) {
69
- const appleLanguages = SettingsManager.settings.AppleLanguages;
70
- console.log("[getSystemLanguage] iOS AppleLanguages:", appleLanguages);
71
- for (const lang of appleLanguages) {
72
- const languageCode = lang.split("-")[0]?.toLowerCase();
73
- if (languageCode) {
74
- const supportedLanguage = availableLocales.find((locale) => locale === languageCode);
75
- if (supportedLanguage) {
76
- console.log("[getSystemLanguage] \u2705 Found via iOS SettingsManager:", supportedLanguage);
77
- return supportedLanguage;
78
- }
79
- }
80
- }
81
- }
82
- const I18nManager = NativeModules?.I18nManager;
83
- if (I18nManager?.localeIdentifier) {
84
- const languageCode = I18nManager.localeIdentifier.split("-")[0]?.toLowerCase();
85
- if (languageCode) {
86
- const supportedLanguage = availableLocales.find((locale) => locale === languageCode);
87
- if (supportedLanguage) {
88
- return supportedLanguage;
89
- }
90
- }
91
- }
92
- } else if (Platform?.OS === "android") {
93
- const I18nManager = NativeModules?.I18nManager;
94
- if (I18nManager?.localeIdentifier) {
95
- const languageCode = I18nManager.localeIdentifier.split("-")[0]?.toLowerCase();
96
- if (languageCode) {
97
- const supportedLanguage = availableLocales.find((locale) => locale === languageCode);
98
- if (supportedLanguage) {
99
- return supportedLanguage;
100
- }
101
- }
102
- }
103
- }
104
- } catch (rnError) {
105
- }
106
- const systemLocale = Intl.DateTimeFormat().resolvedOptions().locale;
107
- console.log("[getSystemLanguage] Intl locale:", systemLocale);
108
- if (systemLocale) {
109
- const languageCode = systemLocale.split("-")[0]?.toLowerCase();
110
- if (languageCode) {
111
- const supportedLanguage = availableLocales.find((locale) => locale === languageCode);
112
- if (supportedLanguage) {
113
- console.log("[getSystemLanguage] \u2705 Found via Intl API:", supportedLanguage);
114
- return supportedLanguage;
115
- }
116
- }
117
- }
118
- console.log("[getSystemLanguage] \u274C No matching locale found, returning null");
119
- console.log("[getSystemLanguage] === END ===");
120
- return null;
121
- } catch (error) {
122
- console.log("Could not detect system language:", error);
123
- return null;
124
- }
125
- }
126
- function useLocon() {
127
- const locon = useContext(LoconContext);
128
- return locon;
129
- }
130
- var useLocon_default = useLocon;
131
- function LText({ children, assetKey, ...props }) {
132
- const { l } = useLocon_default();
133
- return /* @__PURE__ */ jsx(Text, { ...props, children: l(assetKey || children) });
134
- }
135
- var LText_default = LText;
136
- console.log("\u{1F680}\u{1F680}\u{1F680} [LOCON] LOCAL VERSION LOADED! \u{1F680}\u{1F680}\u{1F680}");
137
- console.log("[LOCON] This log means we are using the local source from ../../../locon/locon/src/locon");
138
- var LoconContext = createContext({
1
+ import { jsx } from "react/jsx-runtime";
2
+ import { createContext, useCallback, useMemo, useState } from "react";
3
+ import getSystemLanguage from "./utils/getSystemLanguage";
4
+ const LoconContext = createContext({
139
5
  assets: {},
140
6
  currentLocale: "en",
141
7
  defaultLocale: "en",
@@ -159,10 +25,9 @@ function Locon({
159
25
  return currentLocaleProps;
160
26
  }
161
27
  if (autodetect) {
162
- const availableLocales = Object.keys(assets);
163
- const systemLang = getSystemLanguage(availableLocales);
164
- if (systemLang && assets[systemLang]) {
165
- return systemLang;
28
+ const systemLocale = getSystemLanguage(Object.keys(assets));
29
+ if (systemLocale && assets[systemLocale]) {
30
+ return systemLocale;
166
31
  }
167
32
  }
168
33
  return defaultLocale;
@@ -183,7 +48,7 @@ function Locon({
183
48
  if (assets[locale]) {
184
49
  setCurrentLocale(locale);
185
50
  } else {
186
- console.warn(`Locale "${locale}" not found in assets.`);
51
+ console.warn(`[locon] Locale "${locale}" not found in assets.`);
187
52
  }
188
53
  },
189
54
  [assets]
@@ -223,5 +88,11 @@ function Locon({
223
88
  return /* @__PURE__ */ jsx(LoconContext, { value, children });
224
89
  }
225
90
  var locon_default = Locon;
226
-
227
- export { LText_default as LText, LoconContext, locon_default as default, useLocon_default as useLocon };
91
+ import { default as default2 } from "./components/LText";
92
+ import { default as default3 } from "./hooks/useLocon";
93
+ export {
94
+ default2 as LText,
95
+ LoconContext,
96
+ locon_default as default,
97
+ default3 as useLocon
98
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "locon",
3
- "version": "1.2.0",
3
+ "version": "1.3.0",
4
4
  "description": "locon is a simple and lightweight library for React Native that provides a simple way to manage translations in your app.",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",