@snack-uikit/locale 0.1.0 → 0.1.1

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 0.1.1 (2024-02-07)
+
+
+### Bug Fixes
+
+* **FF-4166:** fallback locales for wrong lang, change typings, transform lang prop to correct format ([d581233](https://github.com/cloud-ru-tech/snack-uikit/commit/d581233bf551e7582f78b412187bd8cabcb72adb))
+
+
+
+
+
 # 0.1.0 (2024-02-06)
 
 

package/README.md

@@ -7,7 +7,7 @@
 
 You need to wrap your app into `<LocaleProvider>` to make translations work.
 
-If you don't do it then **default** (en_US) translations will be applied if applicable.
+If you don't do it then **default** (en_GB) translations will be applied if applicable.
 
 Also you can pass custom translations or replace/modify existing.
 
@@ -22,7 +22,7 @@ But when passing a custom language, you will have to specify all translations.
 import { LocaleProvider, OverrideLocales } from '@snack-uikit/locale';
 
 const customTraslations: OverrideLocales = {
-  en_US: {
+  en_GB: {
     Table: {
       searchPlaceholder: 'custom',
     },
@@ -35,7 +35,7 @@ const customTraslations: OverrideLocales = {
   },
 };
 
-const lang = 'en_US'; // or 'ru_RU' or 'custom_LANG'
+const lang = 'en_GB'; // or 'ru_RU' or 'custom_LANG'
 
   // ...
   <LocaleProvider lang={lang} locales={customTranslations}>
@@ -53,7 +53,7 @@ const lang = 'en_US'; // or 'ru_RU' or 'custom_LANG'
 ### Props
 | name | type | default value | description |
 |------|------|---------------|-------------|
-| lang | ``${string}_${string}`` | en_US |  |
+| lang* | `string` | - |  |
 | locales | `OverrideLocales` | - |  |
 ## useLocale
 `helper` 

package/dist/components/LocaleProvider/LocaleProvider.d.ts

@@ -1,5 +1,6 @@
 import { ReactNode } from 'react';
 import { LocaleLang, OverrideLocales } from '../../types';
+export declare const DEFAULT_LANG = "en_GB";
 export type LocaleContextType = {
     lang: LocaleLang;
     locales: OverrideLocales;
@@ -10,4 +11,4 @@ export type LocaleProviderProps = {
     locales?: OverrideLocales;
     children: ReactNode;
 };
-export declare function LocaleProvider({ lang, locales: localesProp, children }: LocaleProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function LocaleProvider({ lang: langProp, locales: localesProp, children }: LocaleProviderProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/LocaleProvider/LocaleProvider.js

@@ -2,16 +2,18 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import merge from 'lodash.merge';
 import { createContext, useMemo } from 'react';
 import { LOCALES } from '../../locales';
+export const DEFAULT_LANG = 'en_GB';
 export const LocaleContext = createContext({
-    lang: 'en_US',
+    lang: DEFAULT_LANG,
     locales: LOCALES,
 });
-export function LocaleProvider({ lang = 'en_US', locales: localesProp, children }) {
+export function LocaleProvider({ lang: langProp = DEFAULT_LANG, locales: localesProp, children }) {
     const locales = useMemo(() => {
         if (localesProp) {
             return merge({}, LOCALES, localesProp);
         }
         return LOCALES;
     }, [localesProp]);
+    const lang = useMemo(() => langProp.replace('-', '_'), [langProp]);
     return _jsx(LocaleContext.Provider, { value: { lang, locales }, children: children });
 }

package/dist/components/LocaleProvider/hooks.js

@@ -1,9 +1,13 @@
 import { useContext, useMemo } from 'react';
-import { LocaleContext } from './LocaleProvider';
+import { DEFAULT_LANG, LocaleContext } from './LocaleProvider';
 export function useLocale(componentName) {
     const { locales: ctxLocales, lang } = useContext(LocaleContext);
     const locales = useMemo(() => {
-        const localesObj = ctxLocales[lang] || {};
+        let localesObj = ctxLocales[lang];
+        if (!localesObj) {
+            console.warn(`Snack-uikit: localization for lang ${lang} was not found. Make sure you are using correct lang or passed proper locales to LocaleProvider. For now default language (${DEFAULT_LANG}) will be used`);
+            localesObj = ctxLocales[DEFAULT_LANG];
+        }
         if (!componentName) {
             return localesObj;
         }

package/dist/locales/{en_US.d.ts → en_GB.d.ts}

@@ -1,4 +1,4 @@
-export declare const en_US: {
+export declare const en_GB: {
     Table: {
         searchPlaceholder: string;
         noData: {

package/dist/locales/{en_US.js → en_GB.js}

@@ -1,4 +1,4 @@
-export const en_US = {
+export const en_GB = {
     Table: {
         searchPlaceholder: 'Search',
         noData: {

package/dist/locales/index.d.ts

@@ -1,5 +1,5 @@
 export declare const LOCALES: {
-    readonly en_US: {
+    readonly en_GB: {
         Table: {
             searchPlaceholder: string;
             noData: {

package/dist/locales/index.js

@@ -1,6 +1,6 @@
-import { en_US } from './en_US';
+import { en_GB } from './en_GB';
 import { ru_RU } from './ru_RU';
 export const LOCALES = {
-    en_US,
+    en_GB,
     ru_RU,
 };

package/dist/types.d.ts

@@ -1,8 +1,6 @@
 import { LOCALES } from './locales';
 import { PartialDeep } from './typeUtils';
 export type KnownLocaleLang = keyof typeof LOCALES;
-type CustomLang = `${string}_${string}`;
-export type LocaleLang = KnownLocaleLang | CustomLang;
-export type LocaleDictionary = typeof LOCALES.en_US;
-export type OverrideLocales = PartialDeep<Record<KnownLocaleLang, LocaleDictionary>> | Record<CustomLang, LocaleDictionary>;
-export {};
+export type LocaleLang = KnownLocaleLang | string;
+export type LocaleDictionary = typeof LOCALES.en_GB;
+export type OverrideLocales = PartialDeep<Record<KnownLocaleLang, LocaleDictionary>> | Record<string, LocaleDictionary>;

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "Locale",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -37,5 +37,5 @@
   "devDependencies": {
     "@types/lodash.merge": "4.6.9"
   },
-  "gitHead": "e38849932e4595cfeaf19733fcd296ffcfc7322e"
+  "gitHead": "0e3f0ca15d2f0903a25bfa72bd95da9a414bddc2"
 }

package/src/components/LocaleProvider/LocaleProvider.tsx

@@ -4,13 +4,15 @@ import { createContext, ReactNode, useMemo } from 'react';
 import { LOCALES } from '../../locales';
 import { LocaleLang, OverrideLocales } from '../../types';
 
+export const DEFAULT_LANG = 'en_GB';
+
 export type LocaleContextType = {
   lang: LocaleLang;
   locales: OverrideLocales;
 };
 
 export const LocaleContext = createContext<LocaleContextType>({
-  lang: 'en_US',
+  lang: DEFAULT_LANG,
   locales: LOCALES,
 });
 
@@ -20,7 +22,7 @@ export type LocaleProviderProps = {
   children: ReactNode;
 };
 
-export function LocaleProvider({ lang = 'en_US', locales: localesProp, children }: LocaleProviderProps) {
+export function LocaleProvider({ lang: langProp = DEFAULT_LANG, locales: localesProp, children }: LocaleProviderProps) {
   const locales = useMemo(() => {
     if (localesProp) {
       return merge({}, LOCALES, localesProp);
@@ -29,5 +31,7 @@ export function LocaleProvider({ lang = 'en_US', locales: localesProp, children
     return LOCALES;
   }, [localesProp]);
 
+  const lang = useMemo(() => langProp.replace('-', '_') as LocaleLang, [langProp]);
+
   return <LocaleContext.Provider value={{ lang, locales }}>{children}</LocaleContext.Provider>;
 }

package/src/components/LocaleProvider/hooks.ts

@@ -1,7 +1,7 @@
 import { useContext, useMemo } from 'react';
 
 import { KnownLocaleLang, LocaleDictionary, LocaleLang } from '../../types';
-import { LocaleContext, LocaleContextType } from './LocaleProvider';
+import { DEFAULT_LANG, LocaleContext, LocaleContextType } from './LocaleProvider';
 
 type LocaleComponentName = keyof LocaleDictionary;
 
@@ -18,7 +18,15 @@ export function useLocale<C extends LocaleComponentName = LocaleComponentName>(c
   const { locales: ctxLocales, lang } = useContext<LocaleContextType>(LocaleContext);
 
   const locales = useMemo(() => {
-    const localesObj = ctxLocales[lang as KnownLocaleLang] || {};
+    let localesObj = ctxLocales[lang as KnownLocaleLang];
+
+    if (!localesObj) {
+      console.warn(
+        `Snack-uikit: localization for lang ${lang} was not found. Make sure you are using correct lang or passed proper locales to LocaleProvider. For now default language (${DEFAULT_LANG}) will be used`,
+      );
+
+      localesObj = ctxLocales[DEFAULT_LANG] as LocaleDictionary;
+    }
 
     if (!componentName) {
       return localesObj as LocaleDictionary;

package/src/locales/{en_US.ts → en_GB.ts}

@@ -1,4 +1,4 @@
-export const en_US = {
+export const en_GB = {
   Table: {
     searchPlaceholder: 'Search',
     noData: {

package/src/locales/index.ts

@@ -1,7 +1,7 @@
-import { en_US } from './en_US';
+import { en_GB } from './en_GB';
 import { ru_RU } from './ru_RU';
 
 export const LOCALES = {
-  en_US,
+  en_GB,
   ru_RU,
 } as const;

package/src/types.ts

@@ -3,12 +3,8 @@ import { PartialDeep } from './typeUtils';
 
 export type KnownLocaleLang = keyof typeof LOCALES;
 
-type CustomLang = `${string}_${string}`;
+export type LocaleLang = KnownLocaleLang | string;
 
-export type LocaleLang = KnownLocaleLang | CustomLang;
+export type LocaleDictionary = typeof LOCALES.en_GB;
 
-export type LocaleDictionary = typeof LOCALES.en_US;
-
-export type OverrideLocales =
-  | PartialDeep<Record<KnownLocaleLang, LocaleDictionary>>
-  | Record<CustomLang, LocaleDictionary>;
+export type OverrideLocales = PartialDeep<Record<KnownLocaleLang, LocaleDictionary>> | Record<string, LocaleDictionary>;