@snack-uikit/locale 0.12.3-preview-efee8b3e.0 → 0.13.0

package/dist/esm/components/LocaleProvider/LocaleProvider.js

@@ -1,67 +1,28 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import merge from 'lodash.merge';
-import { createContext, useCallback, useContext, useMemo } from 'react';
+import { createContext, useMemo } from 'react';
 import { LOCALES } from '../../locales';
 export const DEFAULT_LANG = 'en_GB';
-function mergeLocaleWithExtension(extension) {
-    return merge({}, LOCALES, extension);
+export const LocaleContext = createContext({
+    lang: DEFAULT_LANG,
+    locales: LOCALES,
+    localesByLang: LOCALES.en_GB,
+});
+export function LocaleProvider({ lang: langProp, locales: localesProp, children }) {
+    const locales = useMemo(() => {
+        if (localesProp) {
+            return merge({}, LOCALES, localesProp);
+        }
+        return LOCALES;
+    }, [localesProp]);
+    const lang = useMemo(() => langProp.replace('-', '_'), [langProp]);
+    const localesByLang = useMemo(() => {
+        let localesObj = locales[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 = locales[DEFAULT_LANG];
+        }
+        return localesObj;
+    }, [lang, locales]);
+    return _jsx(LocaleContext.Provider, { value: { lang, locales, localesByLang }, children: children });
 }
-export function createLocaleContext({ extendedDictionary }) {
-    const locales = mergeLocaleWithExtension(extendedDictionary);
-    const LocaleContext = createContext({
-        lang: DEFAULT_LANG,
-        locales,
-        localesByLang: locales.en_GB,
-    });
-    function LocaleProvider({ lang: langProp, children }) {
-        const lang = useMemo(() => langProp.replace('-', '_'), [langProp]);
-        const localesByLang = useMemo(() => {
-            let localesObj = locales[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 = locales[DEFAULT_LANG];
-            }
-            return localesObj;
-        }, [lang]);
-        return _jsx(LocaleContext.Provider, { value: { lang, locales, localesByLang }, children: children });
-    }
-    function useLocale(componentName) {
-        const { localesByLang, lang } = useContext(LocaleContext);
-        const locales = useMemo(() => {
-            if (!componentName) {
-                return localesByLang;
-            }
-            return (localesByLang[componentName] || {});
-        }, [componentName, localesByLang]);
-        const getLocaleText = useCallback(key => {
-            let translation = '';
-            const complexKey = key.split('.');
-            if (complexKey.length === 1) {
-                translation = locales[key];
-            }
-            else {
-                translation = complexKey.reduce((acc, cur) => {
-                    if (typeof acc === 'string') {
-                        return acc;
-                    }
-                    return acc[cur];
-                }, locales);
-            }
-            if (!(translation === null || translation === void 0 ? void 0 : translation.length)) {
-                console.warn(`Snack-uikit: the '${key}' key is not found in the current locale '${lang}'.`);
-                return key;
-            }
-            return translation;
-        }, [lang, locales]);
-        return {
-            t: getLocaleText,
-            lang,
-        };
-    }
-    return {
-        LocaleContext,
-        LocaleProvider,
-        useLocale,
-    };
-}
-export const { LocaleProvider, useLocale } = createLocaleContext({});

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

@@ -0,0 +1,16 @@
+import { DottedTranslationKey, LocaleDictionary, LocaleLang } from '../../types';
+type LocaleComponentName = keyof LocaleDictionary;
+type GetLocaleText<T extends keyof LocaleDictionary | undefined = undefined> = (key: DottedTranslationKey<T>) => string;
+/**
+ * Inner hook to use translations
+ * @function helper
+ */
+export declare function useLocale(): {
+    t: GetLocaleText;
+    lang: LocaleLang;
+};
+export declare function useLocale<C extends LocaleComponentName = LocaleComponentName>(componentName: C): {
+    t: GetLocaleText<C>;
+    lang: LocaleLang;
+};
+export {};

package/dist/esm/components/LocaleProvider/hooks.js

@@ -0,0 +1,30 @@
+import { useCallback, useContext, useMemo } from 'react';
+import { LocaleContext } from './LocaleProvider';
+export function useLocale(componentName) {
+    const { localesByLang, lang } = useContext(LocaleContext);
+    const locales = useMemo(() => {
+        if (!componentName) {
+            return localesByLang;
+        }
+        return (localesByLang[componentName] || {});
+    }, [componentName, localesByLang]);
+    const getLocaleText = useCallback(key => {
+        let translation = '';
+        const complexKey = key.split('.');
+        if (complexKey.length === 1) {
+            translation = locales[key];
+        }
+        else {
+            translation = complexKey.reduce((acc, cur) => acc[cur], locales);
+        }
+        if (!(translation === null || translation === void 0 ? void 0 : translation.length)) {
+            console.warn(`Snack-uikit: the '${key}' key is not found in the current locale '${lang}'.`);
+            return key;
+        }
+        return translation;
+    }, [lang, locales]);
+    return {
+        t: getLocaleText,
+        lang,
+    };
+}

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

@@ -1 +1,2 @@
-export { type LocaleProviderProps, LocaleProvider, useLocale, createLocaleContext } from './LocaleProvider';
+export { type LocaleProviderProps, LocaleProvider } from './LocaleProvider';
+export { useLocale } from './hooks';

package/dist/esm/components/LocaleProvider/index.js

@@ -1 +1,2 @@
-export { LocaleProvider, useLocale, createLocaleContext } from './LocaleProvider';
+export { LocaleProvider } from './LocaleProvider';
+export { useLocale } from './hooks';

package/dist/esm/locales/en_GB.d.ts

@@ -65,4 +65,13 @@ export declare const en_GB: {
         hideFilters: string;
         showFilters: string;
     };
+    ToastUpload: {
+        title: {
+            loading: string;
+            error: string;
+            pause: string;
+            errorUploaded: string;
+            uploaded: string;
+        };
+    };
 };

package/dist/esm/locales/en_GB.js

@@ -65,4 +65,13 @@ export const en_GB = {
         hideFilters: 'Hide filters',
         showFilters: 'Show filters',
     },
+    ToastUpload: {
+        title: {
+            loading: 'Loading...',
+            error: 'Error loading...',
+            pause: 'Paused loading',
+            errorUploaded: 'Error uploaded',
+            uploaded: 'Uploaded',
+        },
+    },
 };

package/dist/esm/locales/index.d.ts

@@ -66,6 +66,15 @@ export declare const LOCALES: {
             hideFilters: string;
             showFilters: string;
         };
+        ToastUpload: {
+            title: {
+                loading: string;
+                error: string;
+                pause: string;
+                errorUploaded: string;
+                uploaded: string;
+            };
+        };
     };
     readonly ru_RU: {
         Table: {
@@ -134,5 +143,14 @@ export declare const LOCALES: {
             hideFilters: string;
             showFilters: string;
         };
+        ToastUpload: {
+            title: {
+                loading: string;
+                error: string;
+                pause: string;
+                errorUploaded: string;
+                uploaded: string;
+            };
+        };
     };
 };

package/dist/esm/locales/ru_RU.js

@@ -65,4 +65,13 @@ export const ru_RU = {
         hideFilters: 'Скрыть фильтры',
         showFilters: 'Показать фильтры',
     },
+    ToastUpload: {
+        title: {
+            loading: 'Загрузка...',
+            error: 'Ошибка загрузки...',
+            pause: 'Загрузка приостановлена',
+            errorUploaded: 'Ошибка при загрузке',
+            uploaded: 'Загружено',
+        },
+    },
 };

package/dist/esm/types.d.ts

@@ -1,12 +1,7 @@
 import { LOCALES } from './locales';
-import { PathsToProps } from './typeUtils';
+import { PartialDeep, PathsToProps } from './typeUtils';
 export type KnownLocaleLang = keyof typeof LOCALES;
-export type LocaleLang = KnownLocaleLang;
-export type TranslatedEntity = {
-    [key: string]: string | TranslatedEntity;
-};
-export type Dictionary = Record<string, TranslatedEntity>;
-export type LocaleDictionary<D extends Dictionary> = typeof LOCALES.en_GB & D;
-export type Locales<D extends Dictionary> = Record<LocaleLang, LocaleDictionary<D>>;
-export type DottedTranslationKey<D extends Dictionary, C extends keyof LocaleDictionary<D> | undefined = undefined> = C extends keyof LocaleDictionary<D> ? PathsToProps<LocaleDictionary<D>[C], string> : PathsToProps<LocaleDictionary<D>, string>;
-export type ExtendedDictionary<D> = Record<KnownLocaleLang, D>;
+export type LocaleLang = KnownLocaleLang | string;
+export type LocaleDictionary = typeof LOCALES.en_GB;
+export type OverrideLocales = PartialDeep<Record<LocaleLang, LocaleDictionary>>;
+export type DottedTranslationKey<C extends keyof LocaleDictionary | undefined = undefined> = C extends keyof LocaleDictionary ? PathsToProps<LocaleDictionary[C], string> : PathsToProps<LocaleDictionary, string>;

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "Locale",
-  "version": "0.12.3-preview-efee8b3e.0",
+  "version": "0.13.0",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -41,5 +41,5 @@
   "devDependencies": {
     "@types/lodash.merge": "4.6.9"
   },
-  "gitHead": "e92f39600ead583b808a1f1f145890efb62ea70b"
+  "gitHead": "b27699a7db8812f2d06c49346d1b4ab6d0d8c24e"
 }

package/src/components/LocaleProvider/LocaleProvider.tsx

@@ -1,134 +1,53 @@
 import merge from 'lodash.merge';
-import { createContext, ReactNode, useCallback, useContext, useMemo } from 'react';
+import { createContext, ReactNode, useMemo } from 'react';
 
 import { LOCALES } from '../../locales';
-import {
-  Dictionary,
-  DottedTranslationKey,
-  ExtendedDictionary,
-  KnownLocaleLang,
-  LocaleDictionary,
-  LocaleLang,
-  Locales,
-  TranslatedEntity,
-} from '../../types';
+import { KnownLocaleLang, LocaleDictionary, LocaleLang, OverrideLocales } from '../../types';
 
 export const DEFAULT_LANG = 'en_GB';
 
-export type LocaleContextType<D extends Dictionary> = {
+export type LocaleContextType = {
   lang: LocaleLang;
-  locales: Locales<D>;
-  localesByLang: LocaleDictionary<D>;
+  locales: OverrideLocales;
+  localesByLang: LocaleDictionary;
 };
 
-export type LocaleProviderProps<D extends Dictionary> = {
+export const LocaleContext = createContext<LocaleContextType>({
+  lang: DEFAULT_LANG,
+  locales: LOCALES,
+  localesByLang: LOCALES.en_GB,
+});
+
+export type LocaleProviderProps = {
   lang: LocaleLang;
-  locales?: Locales<D>;
+  locales?: OverrideLocales;
   children: ReactNode;
 };
 
-export type ContextOptions<D extends Dictionary> = {
-  extendedDictionary?: ExtendedDictionary<D>;
-};
-
-function mergeLocaleWithExtension<D extends Dictionary>(extension?: ExtendedDictionary<D>): Locales<D> {
-  return merge({}, LOCALES, extension);
-}
-
-type ValueOf<T> = T[keyof T];
-
-type LocaleComponentName<D extends Dictionary> = keyof LocaleDictionary<D>;
-
-type GetLocaleText<D extends Dictionary, T extends keyof LocaleDictionary<D> | undefined = undefined> = (
-  key: DottedTranslationKey<D, T>,
-) => string;
-
-export function createLocaleContext<D extends Dictionary>({ extendedDictionary }: ContextOptions<D>) {
-  const locales = mergeLocaleWithExtension(extendedDictionary);
-
-  const LocaleContext = createContext<LocaleContextType<D>>({
-    lang: DEFAULT_LANG,
-    locales,
-    localesByLang: locales.en_GB,
-  });
-
-  function LocaleProvider({ lang: langProp, children }: LocaleProviderProps<D>) {
-    const lang = useMemo(() => langProp.replace('-', '_') as LocaleLang, [langProp]);
-
-    const localesByLang = useMemo(() => {
-      let localesObj = locales[lang as KnownLocaleLang];
+export function LocaleProvider({ lang: langProp, locales: localesProp, children }: LocaleProviderProps) {
+  const locales = useMemo(() => {
+    if (localesProp) {
+      return merge({}, LOCALES, localesProp);
+    }
 
-      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`,
-        );
+    return LOCALES;
+  }, [localesProp]);
 
-        localesObj = locales[DEFAULT_LANG] as LocaleDictionary<D>;
-      }
+  const lang = useMemo(() => langProp.replace('-', '_') as LocaleLang, [langProp]);
 
-      return localesObj;
-    }, [lang]);
+  const localesByLang = useMemo(() => {
+    let localesObj = locales[lang as KnownLocaleLang];
 
-    return <LocaleContext.Provider value={{ lang, locales, localesByLang }}>{children}</LocaleContext.Provider>;
-  }
+    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`,
+      );
 
-  function useLocale(): { t: GetLocaleText<D>; lang: LocaleLang };
-  function useLocale<C extends LocaleComponentName<D> = LocaleComponentName<D>>(
-    componentName: C,
-  ): { t: GetLocaleText<D, C>; lang: LocaleLang };
-  function useLocale<C extends LocaleComponentName<D> = LocaleComponentName<D>>(componentName?: C) {
-    const { localesByLang, lang } = useContext<LocaleContextType<D>>(LocaleContext);
+      localesObj = locales[DEFAULT_LANG] as LocaleDictionary;
+    }
 
-    const locales = useMemo(() => {
-      if (!componentName) {
-        return localesByLang;
-      }
+    return localesObj;
+  }, [lang, locales]);
 
-      return (localesByLang[componentName] || {}) as LocaleDictionary<D>[C];
-    }, [componentName, localesByLang]);
-
-    const getLocaleText: GetLocaleText<D, C> = useCallback(
-      key => {
-        let translation = '';
-
-        const complexKey = key.split('.');
-
-        if (complexKey.length === 1) {
-          translation = locales[key as keyof typeof locales] as unknown as string;
-        } else {
-          translation = complexKey.reduce<
-            LocaleDictionary<D> | ValueOf<LocaleDictionary<D>> | TranslatedEntity | string
-          >((acc, cur) => {
-            if (typeof acc === 'string') {
-              return acc;
-            }
-
-            return acc[cur as keyof typeof acc];
-          }, locales) as string;
-        }
-
-        if (!translation?.length) {
-          console.warn(`Snack-uikit: the '${key}' key is not found in the current locale '${lang}'.`);
-
-          return key;
-        }
-
-        return translation;
-      },
-      [lang, locales],
-    );
-
-    return {
-      t: getLocaleText,
-      lang,
-    };
-  }
-
-  return {
-    LocaleContext,
-    LocaleProvider,
-    useLocale,
-  };
+  return <LocaleContext.Provider value={{ lang, locales, localesByLang }}>{children}</LocaleContext.Provider>;
 }
-
-export const { LocaleProvider, useLocale } = createLocaleContext({});

package/src/components/LocaleProvider/hooks.ts

@@ -0,0 +1,62 @@
+import { useCallback, useContext, useMemo } from 'react';
+
+import { DottedTranslationKey, LocaleDictionary, LocaleLang } from '../../types';
+import { LocaleContext, LocaleContextType } from './LocaleProvider';
+
+type ValueOf<T> = T[keyof T];
+
+type LocaleComponentName = keyof LocaleDictionary;
+
+type GetLocaleText<T extends keyof LocaleDictionary | undefined = undefined> = (key: DottedTranslationKey<T>) => string;
+
+/**
+ * Inner hook to use translations
+ * @function helper
+ */
+export function useLocale(): { t: GetLocaleText; lang: LocaleLang };
+export function useLocale<C extends LocaleComponentName = LocaleComponentName>(
+  componentName: C,
+): { t: GetLocaleText<C>; lang: LocaleLang };
+
+export function useLocale<C extends LocaleComponentName = LocaleComponentName>(componentName?: C) {
+  const { localesByLang, lang } = useContext<LocaleContextType>(LocaleContext);
+
+  const locales = useMemo(() => {
+    if (!componentName) {
+      return localesByLang;
+    }
+
+    return (localesByLang[componentName] || {}) as LocaleDictionary[C];
+  }, [componentName, localesByLang]);
+
+  const getLocaleText: GetLocaleText<C> = useCallback(
+    key => {
+      let translation = '';
+
+      const complexKey = key.split('.');
+
+      if (complexKey.length === 1) {
+        translation = locales[key as keyof typeof locales] as unknown as string;
+      } else {
+        translation = complexKey.reduce<LocaleDictionary | ValueOf<LocaleDictionary> | string>(
+          (acc, cur) => acc[cur as keyof typeof acc],
+          locales,
+        ) as string;
+      }
+
+      if (!translation?.length) {
+        console.warn(`Snack-uikit: the '${key}' key is not found in the current locale '${lang}'.`);
+
+        return key;
+      }
+
+      return translation;
+    },
+    [lang, locales],
+  );
+
+  return {
+    t: getLocaleText,
+    lang,
+  };
+}

package/src/components/LocaleProvider/index.ts

@@ -1 +1,3 @@
-export { type LocaleProviderProps, LocaleProvider, useLocale, createLocaleContext } from './LocaleProvider';
+export { type LocaleProviderProps, LocaleProvider } from './LocaleProvider';
+
+export { useLocale } from './hooks';

package/src/locales/en_GB.ts

@@ -1,5 +1,3 @@
-import { Dictionary } from '../types';
-
 export const en_GB = {
   Table: {
     searchPlaceholder: 'Search',
@@ -67,4 +65,13 @@ export const en_GB = {
     hideFilters: 'Hide filters',
     showFilters: 'Show filters',
   },
-} satisfies Dictionary;
+  ToastUpload: {
+    title: {
+      loading: 'Loading...',
+      error: 'Error loading...',
+      pause: 'Paused loading',
+      errorUploaded: 'Error uploaded',
+      uploaded: 'Uploaded',
+    },
+  },
+};

package/src/locales/ru_RU.ts

@@ -67,4 +67,13 @@ export const ru_RU: typeof en_GB = {
     hideFilters: 'Скрыть фильтры',
     showFilters: 'Показать фильтры',
   },
+  ToastUpload: {
+    title: {
+      loading: 'Загрузка...',
+      error: 'Ошибка загрузки...',
+      pause: 'Загрузка приостановлена',
+      errorUploaded: 'Ошибка при загрузке',
+      uploaded: 'Загружено',
+    },
+  },
 };

package/src/types.ts

@@ -1,25 +1,15 @@
 import { LOCALES } from './locales';
-import { PathsToProps } from './typeUtils';
+import { PartialDeep, PathsToProps } from './typeUtils';
 
 export type KnownLocaleLang = keyof typeof LOCALES;
 
-export type LocaleLang = KnownLocaleLang;
+export type LocaleLang = KnownLocaleLang | string;
 
-export type TranslatedEntity = {
-  [key: string]: string | TranslatedEntity;
-};
+export type LocaleDictionary = typeof LOCALES.en_GB;
 
-export type Dictionary = Record<string, TranslatedEntity>;
+// TODO: temporary changed type to fix typings mismatch for "locale" prop in LocaleProvider
+// export type OverrideLocales = PartialDeep<Record<KnownLocaleLang, LocaleDictionary>> | Record<string, LocaleDictionary>;
+export type OverrideLocales = PartialDeep<Record<LocaleLang, LocaleDictionary>>;
 
-export type LocaleDictionary<D extends Dictionary> = typeof LOCALES.en_GB & D;
-
-export type Locales<D extends Dictionary> = Record<LocaleLang, LocaleDictionary<D>>;
-
-export type DottedTranslationKey<
-  D extends Dictionary,
-  C extends keyof LocaleDictionary<D> | undefined = undefined,
-> = C extends keyof LocaleDictionary<D>
-  ? PathsToProps<LocaleDictionary<D>[C], string>
-  : PathsToProps<LocaleDictionary<D>, string>;
-
-export type ExtendedDictionary<D> = Record<KnownLocaleLang, D>;
+export type DottedTranslationKey<C extends keyof LocaleDictionary | undefined = undefined> =
+  C extends keyof LocaleDictionary ? PathsToProps<LocaleDictionary[C], string> : PathsToProps<LocaleDictionary, string>;

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

@@ -1,10 +0,0 @@
-import { ReactNode } from 'react';
-type SampleWrapperProps = {
-    children: ReactNode;
-};
-export declare function SampleWrapper({ children }: SampleWrapperProps): import("react/jsx-runtime").JSX.Element;
-export declare function OldDictionaryItemSample(): import("react/jsx-runtime").JSX.Element;
-export declare function NewDictionarySample(): import("react/jsx-runtime").JSX.Element;
-export declare function NewDictSimpleTranslationComponent(): import("react/jsx-runtime").JSX.Element;
-export declare function NewDictDeepTranslationComponent(): import("react/jsx-runtime").JSX.Element;
-export {};