lokal-react 1.3.2 → 1.3.6

package/dist/index.d.mts

@@ -0,0 +1,144 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React, { ReactNode } from 'react';
+import { LocaleData } from 'lokal-core';
+export { LocaleData } from 'lokal-core';
+
+type TranslateFunction = <K extends string>(key: K, params?: Record<string, string | number>) => string;
+type PluralCategory = 'zero' | 'one' | 'two' | 'few' | 'many' | 'other';
+interface PluralParams {
+    count: number;
+    [key: string]: string | number;
+}
+type GenderCategory = 'male' | 'female' | 'other';
+interface GenderParams {
+    gender: GenderCategory;
+    [key: string]: string | number;
+}
+interface ExtendedTranslateFunction {
+    <K extends string>(key: K, params?: Record<string, string | number>): string;
+    plural: <K extends string>(key: K, params: PluralParams) => string;
+    gender: <K extends string>(key: K, params: GenderParams) => string;
+    choice: <K extends string>(key: K, params: {
+        value: string | number;
+    }) => string;
+}
+interface StorageInterface {
+    getItem(key: string): Promise<string | null>;
+    setItem(key: string, value: string): Promise<void>;
+}
+interface DateFormatOptions {
+    year?: 'numeric' | '2-digit';
+    month?: 'numeric' | '2-digit' | 'long' | 'short' | 'narrow';
+    day?: 'numeric' | '2-digit';
+    hour?: 'numeric' | '2-digit';
+    minute?: 'numeric' | '2-digit';
+    second?: 'numeric' | '2-digit';
+    timeZoneName?: 'short' | 'long';
+}
+interface NumberFormatOptions {
+    style?: 'decimal' | 'currency' | 'percent' | 'unit';
+    currency?: string;
+    currencyDisplay?: 'symbol' | 'code' | 'name';
+    minimumFractionDigits?: number;
+    maximumFractionDigits?: number;
+    useGrouping?: boolean;
+    unit?: string;
+    unitDisplay?: 'long' | 'short' | 'narrow';
+}
+interface LokalContextValue {
+    locale: string;
+    setLocale: (locale: string) => void;
+    locales: string[];
+    t: ExtendedTranslateFunction;
+    translations: LocaleData;
+    isLoading: boolean;
+    formatDate: (date: Date | string, options?: DateFormatOptions) => string;
+    formatNumber: (num: number, options?: NumberFormatOptions) => string;
+}
+interface LokalProviderProps {
+    children: ReactNode;
+    locale?: string;
+    locales?: string[];
+    translations?: LocaleData;
+    storage?: StorageInterface;
+    namespace?: string;
+    defaultLocale?: string;
+    onLocaleChange?: (locale: string) => void;
+    initialLocale?: string;
+    initialTranslations?: LocaleData;
+    fallbackLocale?: string;
+}
+declare function LokalProvider({ children, locale: initialLocale, locales, translations: initialTranslations, storage, namespace, defaultLocale, onLocaleChange, initialLocale: ssrInitialLocale, initialTranslations: ssrInitialTranslations, fallbackLocale, }: LokalProviderProps): react_jsx_runtime.JSX.Element;
+/**
+ * Hook to access the full Lokal context
+ */
+declare function useLokal(): LokalContextValue;
+/**
+ * Hook to access only the translation function
+ */
+declare function useTranslate(): ExtendedTranslateFunction;
+/**
+ * Hook to access locale and setter
+ */
+declare function useLocale(): {
+    locale: string;
+    setLocale: (locale: string) => void;
+    locales: string[];
+};
+/**
+ * Hook to access date/number formatters
+ */
+declare function useFormatters(): {
+    formatDate: (date: Date | string, options?: DateFormatOptions) => string;
+    formatNumber: (num: number, options?: NumberFormatOptions) => string;
+};
+/**
+ * Hook to check if translations are loading
+ */
+declare function useIsLoading(): boolean;
+interface TComponentProps {
+    children: string;
+    params?: Record<string, string | number>;
+    plural?: number;
+    gender?: GenderCategory;
+    className?: string;
+    as?: React.ElementType;
+}
+/**
+ * T Component - Translate content directly in JSX
+ * Usage: <T>hello_world</T> or <T params={{name: 'John'}}>greeting</T>
+ */
+declare function T({ children, params, plural, gender, className, as: Component }: TComponentProps): react_jsx_runtime.JSX.Element;
+/**
+ * Hook for lazy-loaded translations (useful for code splitting)
+ */
+declare function useLazyTranslations(namespace: string): {
+    t: (key: string, params?: Record<string, string | number>) => string;
+    isLoading: boolean;
+};
+/**
+ * Hook to handle SSR hydration
+ * Returns true until client-side hydration is complete
+ */
+declare function useHydrated(): boolean;
+/**
+ * Hook to get translations only after hydration
+ * Prevents hydration mismatches
+ */
+declare function useSafeTranslations(): {
+    t: ExtendedTranslateFunction;
+    isHydrated: boolean;
+};
+
+/**
+ * Create a standalone translation function
+ * Useful for non-React contexts or when you want to avoid hooks
+ */
+declare function createTranslate(translations: LocaleData, locale?: string): ExtendedTranslateFunction;
+/**
+ * Hook to create a standalone translate function from context
+ * This is useful when you want to pass translation function to non-React code
+ */
+declare function useStandaloneTranslate(): ExtendedTranslateFunction;
+
+export { type DateFormatOptions, type ExtendedTranslateFunction, type GenderCategory, type GenderParams, type LokalContextValue, LokalProvider, type LokalProviderProps, type NumberFormatOptions, type PluralCategory, type PluralParams, type StorageInterface, T, type TranslateFunction, createTranslate, useFormatters, useHydrated, useIsLoading, useLazyTranslations, useLocale, useLokal, useSafeTranslations, useStandaloneTranslate, useTranslate };

package/dist/index.d.ts

@@ -0,0 +1,144 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React, { ReactNode } from 'react';
+import { LocaleData } from 'lokal-core';
+export { LocaleData } from 'lokal-core';
+
+type TranslateFunction = <K extends string>(key: K, params?: Record<string, string | number>) => string;
+type PluralCategory = 'zero' | 'one' | 'two' | 'few' | 'many' | 'other';
+interface PluralParams {
+    count: number;
+    [key: string]: string | number;
+}
+type GenderCategory = 'male' | 'female' | 'other';
+interface GenderParams {
+    gender: GenderCategory;
+    [key: string]: string | number;
+}
+interface ExtendedTranslateFunction {
+    <K extends string>(key: K, params?: Record<string, string | number>): string;
+    plural: <K extends string>(key: K, params: PluralParams) => string;
+    gender: <K extends string>(key: K, params: GenderParams) => string;
+    choice: <K extends string>(key: K, params: {
+        value: string | number;
+    }) => string;
+}
+interface StorageInterface {
+    getItem(key: string): Promise<string | null>;
+    setItem(key: string, value: string): Promise<void>;
+}
+interface DateFormatOptions {
+    year?: 'numeric' | '2-digit';
+    month?: 'numeric' | '2-digit' | 'long' | 'short' | 'narrow';
+    day?: 'numeric' | '2-digit';
+    hour?: 'numeric' | '2-digit';
+    minute?: 'numeric' | '2-digit';
+    second?: 'numeric' | '2-digit';
+    timeZoneName?: 'short' | 'long';
+}
+interface NumberFormatOptions {
+    style?: 'decimal' | 'currency' | 'percent' | 'unit';
+    currency?: string;
+    currencyDisplay?: 'symbol' | 'code' | 'name';
+    minimumFractionDigits?: number;
+    maximumFractionDigits?: number;
+    useGrouping?: boolean;
+    unit?: string;
+    unitDisplay?: 'long' | 'short' | 'narrow';
+}
+interface LokalContextValue {
+    locale: string;
+    setLocale: (locale: string) => void;
+    locales: string[];
+    t: ExtendedTranslateFunction;
+    translations: LocaleData;
+    isLoading: boolean;
+    formatDate: (date: Date | string, options?: DateFormatOptions) => string;
+    formatNumber: (num: number, options?: NumberFormatOptions) => string;
+}
+interface LokalProviderProps {
+    children: ReactNode;
+    locale?: string;
+    locales?: string[];
+    translations?: LocaleData;
+    storage?: StorageInterface;
+    namespace?: string;
+    defaultLocale?: string;
+    onLocaleChange?: (locale: string) => void;
+    initialLocale?: string;
+    initialTranslations?: LocaleData;
+    fallbackLocale?: string;
+}
+declare function LokalProvider({ children, locale: initialLocale, locales, translations: initialTranslations, storage, namespace, defaultLocale, onLocaleChange, initialLocale: ssrInitialLocale, initialTranslations: ssrInitialTranslations, fallbackLocale, }: LokalProviderProps): react_jsx_runtime.JSX.Element;
+/**
+ * Hook to access the full Lokal context
+ */
+declare function useLokal(): LokalContextValue;
+/**
+ * Hook to access only the translation function
+ */
+declare function useTranslate(): ExtendedTranslateFunction;
+/**
+ * Hook to access locale and setter
+ */
+declare function useLocale(): {
+    locale: string;
+    setLocale: (locale: string) => void;
+    locales: string[];
+};
+/**
+ * Hook to access date/number formatters
+ */
+declare function useFormatters(): {
+    formatDate: (date: Date | string, options?: DateFormatOptions) => string;
+    formatNumber: (num: number, options?: NumberFormatOptions) => string;
+};
+/**
+ * Hook to check if translations are loading
+ */
+declare function useIsLoading(): boolean;
+interface TComponentProps {
+    children: string;
+    params?: Record<string, string | number>;
+    plural?: number;
+    gender?: GenderCategory;
+    className?: string;
+    as?: React.ElementType;
+}
+/**
+ * T Component - Translate content directly in JSX
+ * Usage: <T>hello_world</T> or <T params={{name: 'John'}}>greeting</T>
+ */
+declare function T({ children, params, plural, gender, className, as: Component }: TComponentProps): react_jsx_runtime.JSX.Element;
+/**
+ * Hook for lazy-loaded translations (useful for code splitting)
+ */
+declare function useLazyTranslations(namespace: string): {
+    t: (key: string, params?: Record<string, string | number>) => string;
+    isLoading: boolean;
+};
+/**
+ * Hook to handle SSR hydration
+ * Returns true until client-side hydration is complete
+ */
+declare function useHydrated(): boolean;
+/**
+ * Hook to get translations only after hydration
+ * Prevents hydration mismatches
+ */
+declare function useSafeTranslations(): {
+    t: ExtendedTranslateFunction;
+    isHydrated: boolean;
+};
+
+/**
+ * Create a standalone translation function
+ * Useful for non-React contexts or when you want to avoid hooks
+ */
+declare function createTranslate(translations: LocaleData, locale?: string): ExtendedTranslateFunction;
+/**
+ * Hook to create a standalone translate function from context
+ * This is useful when you want to pass translation function to non-React code
+ */
+declare function useStandaloneTranslate(): ExtendedTranslateFunction;
+
+export { type DateFormatOptions, type ExtendedTranslateFunction, type GenderCategory, type GenderParams, type LokalContextValue, LokalProvider, type LokalProviderProps, type NumberFormatOptions, type PluralCategory, type PluralParams, type StorageInterface, T, type TranslateFunction, createTranslate, useFormatters, useHydrated, useIsLoading, useLazyTranslations, useLocale, useLokal, useSafeTranslations, useStandaloneTranslate, useTranslate };