alambre 1.0.2 → 1.0.3

package/README.md

@@ -1 +1,104 @@
-# alambre
+# alambre
+
+`alambre` is a React Native utility library focused on reusable modules, small UI helpers, and navigation/testing playgrounds.
+
+This repository includes a working test app (`tests/`) where modules and components are exercised in real screens.
+
+## Current Scope
+
+- Module factories to keep feature logic encapsulated:
+	- `createConfigProvider`
+	- `createLangProvider`
+	- `createLightDarkProvider`
+	- `createApiProvider` (powered by TanStack Query)
+	- `NavigatorProvider`
+	- `ToastProvider`
+- Navigation test flow with nested pages (`home`, `configuration`, `advance`, `play`, `toast`)
+- Toast provider integration with queue and custom toast component support
+- Theme switching (light/dark) with persisted storage
+- API playground in tests:
+	- typed route catalog
+	- generated query/mutation hooks from route definitions
+	- route execution demo and structured response rendering
+
+## Project Structure (high level)
+
+- `src/modules/`: module system and domain modules
+- `src/components/`: base UI components and animations
+- `tests/providers/`: test providers for config/lang/theme/api/toast
+- `tests/views/`: test screens grouped by domain
+- `tests/navigator/`: test app navigation config and root test screen
+- `App.tsx`: wires providers and test screens together
+
+## Module Architecture
+
+The project uses a class-based module architecture that separates state logic from React rendering.
+
+### Core pieces
+
+- `BaseModule<TState>`:
+	- Owns module state.
+	- Exposes `getState()` for reads.
+	- Exposes `subscribe()` to notify observers on state changes.
+	- Exposes protected `setState()` to update state and broadcast updates.
+	- Supports optional async initialization via `init()`.
+	- Supports cleanup via `dispose()`.
+- `createModuleProvider(...)`:
+	- Adapts a `BaseModule` instance to React Context.
+	- Creates one module instance per provider lifecycle.
+	- Subscribes React state to module updates.
+	- Runs `module.init()` on mount.
+	- Calls `unsubscribe()` and `module.dispose()` on unmount.
+
+### Data flow
+
+1. A provider creates one module instance.
+2. React initializes local state with `module.getState()`.
+3. Provider subscribes with `module.subscribe(setState)`.
+4. Module methods call `setState(...)`.
+5. All subscribers are notified and React re-renders.
+6. On unmount, provider unsubscribes and disposes module resources.
+
+This keeps state transitions centralized in classes while preserving React's declarative rendering.
+
+## Domain Modules
+
+- `config`:
+	- Persists and updates simple string config fields.
+	- Exposes `config` and `saveField`.
+- `lang`:
+	- Persists selected language key.
+	- Exposes `lang`, `currentLang`, and `changeLang`.
+- `theme`:
+	- Persists current theme name (`light` or `dark`).
+	- Exposes `theme`, `currThemeName`, `toggleTheme`, and `setThemeName`.
+- `api`:
+	- Generates typed routes and query/mutation hooks.
+	- Wraps TanStack Query setup and request helpers.
+- `navigator`:
+	- Stores page stack and scroll state.
+	- Exposes navigation actions and current page metadata.
+- `toast`:
+	- Handles toast queue, timers, and lifecycle.
+	- Renders a required client `ToastComponent`.
+
+## Quick Start
+
+Install dependencies:
+
+```bash
+npm install
+```
+
+Run the test app:
+
+```bash
+npm run android
+```
+
+Other useful scripts:
+
+```bash
+npm run lint
+npm run build
+```

package/dist/components/base/SafeAreaView.d.ts

@@ -1,3 +1,3 @@
 import type { DefaultReact } from '../../types';
-declare const _default: ({ children, ...props }: DefaultReact.SafeAreaViewProps) => import("react").JSX.Element;
+declare const _default: ({ children, style, ...props }: DefaultReact.SafeAreaViewProps) => import("react").JSX.Element;
 export default _default;

package/dist/components/base/SafeAreaView.js

@@ -1,6 +1,6 @@
 import { SafeAreaView } from 'react-native-safe-area-context';
-export default ({ children, ...props }) => {
-    return (<SafeAreaView {...props}>
+export default ({ children, style, ...props }) => {
+    return (<SafeAreaView style={[{ flex: 1 }, style]} {...props}>
       {children}
     </SafeAreaView>);
 };

package/dist/index.d.ts

@@ -1,9 +1,9 @@
 export { SafeAreaView, SubTitle, Text, Title, View, } from './components/base';
 export type { DefaultReact, AnimadoTypes, ActionTypes, NavigatorTypes, } from './types';
-export { createLightDarkProvider, createConfigProvider, createLangProvider, NavigatorProvider, useNavigator, ToastProvider, useToast, } from './providers';
+export { createLightDarkProvider, createConfigProvider, createLangProvider, createApiProvider, NavigatorProvider, useNavigator, ToastProvider, useToast, } from './modules';
 export * as AlambreIcons from './components/icons';
 export * as Buttons from './components/base/input/buttons';
 export { default as AnimadoView } from './components/animations/animado/AnimadoView';
 export { default as AnimadoText } from './components/animations/animado/AnimadoText';
 export { default as ToggleLightDark } from './components/animations/ToggleLightDark';
-export { default as NavigatorBody } from './components/navigator/NavigatorBody';
+export { NavigatorBody } from './modules/navigator';

package/dist/index.js

@@ -1,7 +1,7 @@
 // Base Components
 export { SafeAreaView, SubTitle, Text, Title, View, } from './components/base';
-// Providers
-export { createLightDarkProvider, createConfigProvider, createLangProvider, NavigatorProvider, useNavigator, ToastProvider, useToast, } from './providers';
+// Modules
+export { createLightDarkProvider, createConfigProvider, createLangProvider, createApiProvider, NavigatorProvider, useNavigator, ToastProvider, useToast, } from './modules';
 // Icons
 export * as AlambreIcons from './components/icons';
 // Buttons.
@@ -10,4 +10,4 @@ export * as Buttons from './components/base/input/buttons';
 export { default as AnimadoView } from './components/animations/animado/AnimadoView';
 export { default as AnimadoText } from './components/animations/animado/AnimadoText';
 export { default as ToggleLightDark } from './components/animations/ToggleLightDark';
-export { default as NavigatorBody } from './components/navigator/NavigatorBody';
+export { NavigatorBody } from './modules/navigator';

package/dist/modules/api/api-provider.d.ts

@@ -0,0 +1,20 @@
+import { type ReactNode } from 'react';
+import { type QueryKey, type UseMutationOptions, type UseMutationResult, type UseQueryOptions, type UseQueryResult } from '@tanstack/react-query';
+import type { ApiContextValue, ApiEndpoint, CreateApiProviderOptions, RouteCatalog } from './api-types';
+declare const createApiProvider: ({ baseUrl, getHeaders, createQueryClient, }: CreateApiProviderOptions) => {
+    ApiProvider: ({ children }: {
+        children: ReactNode;
+    }) => import("react").JSX.Element;
+    useApi: () => ApiContextValue;
+    createRoute: <TResponse, TVariables = void>(route: ApiEndpoint<TResponse, TVariables>) => ApiEndpoint<TResponse, TVariables>;
+    createRoutes: <TRoutes extends RouteCatalog>(routes: TRoutes) => TRoutes;
+    createQueryHook: <TResponse, TVariables = void>(endpoint: ApiEndpoint<TResponse, TVariables>) => (variables: TVariables, options?: Omit<UseQueryOptions<TResponse, Error, TResponse, QueryKey>, "queryKey" | "queryFn">) => UseQueryResult<TResponse, Error>;
+    createQueryHookFromRoute: <TResponse, TVariables = void>(route: ApiEndpoint<TResponse, TVariables>) => (variables: TVariables, options?: Omit<UseQueryOptions<TResponse, Error, TResponse, readonly unknown[]>, "queryKey" | "queryFn"> | undefined) => UseQueryResult<TResponse, Error>;
+    createMutationHook: <TResponse, TVariables>(endpoint: ApiEndpoint<TResponse, TVariables>, settings?: {
+        invalidateKeys?: QueryKey[];
+    }) => (options?: Omit<UseMutationOptions<TResponse, Error, TVariables>, "mutationFn">) => UseMutationResult<TResponse, Error, TVariables>;
+    createMutationHookFromRoute: <TResponse, TVariables>(route: ApiEndpoint<TResponse, TVariables>, settings?: {
+        invalidateKeys?: QueryKey[];
+    }) => (options?: Omit<UseMutationOptions<TResponse, Error, TVariables, unknown>, "mutationFn"> | undefined) => UseMutationResult<TResponse, Error, TVariables>;
+};
+export default createApiProvider;

package/dist/modules/api/api-provider.js

@@ -0,0 +1,124 @@
+/* global fetch */
+import { createContext, useContext, useMemo, } from 'react';
+import { QueryClient, QueryClientProvider, useMutation, useQuery, useQueryClient, } from '@tanstack/react-query';
+import { buildUrl, resolveValue } from './api-utils';
+const createApiProvider = ({ baseUrl, getHeaders, createQueryClient, }) => {
+    const ApiContext = createContext(undefined);
+    const ApiProvider = ({ children }) => {
+        const queryClient = useMemo(() => { var _a; return (_a = createQueryClient === null || createQueryClient === void 0 ? void 0 : createQueryClient()) !== null && _a !== void 0 ? _a : new QueryClient(); }, []);
+        const request = async ({ method, path, query, body, headers, transform, }) => {
+            const authHeaders = await (getHeaders === null || getHeaders === void 0 ? void 0 : getHeaders());
+            const url = buildUrl(baseUrl, path, query);
+            const response = await fetch(url, {
+                method,
+                headers: {
+                    Accept: 'application/json',
+                    'Content-Type': 'application/json',
+                    ...authHeaders,
+                    ...headers,
+                },
+                body: body === undefined ? undefined : JSON.stringify(body),
+            });
+            const rawText = await response.text();
+            let rawData = undefined;
+            if (rawText.length) {
+                try {
+                    rawData = JSON.parse(rawText);
+                }
+                catch {
+                    rawData = rawText;
+                }
+            }
+            if (!response.ok) {
+                const message = typeof rawData === 'object' && rawData && 'message' in rawData
+                    ? String(rawData.message)
+                    : `Request failed (${response.status})`;
+                throw new Error(message);
+            }
+            if (transform)
+                return transform(rawData);
+            return rawData;
+        };
+        return (<QueryClientProvider client={queryClient}>
+        <ApiContext.Provider value={{ request }}>
+          {children}
+        </ApiContext.Provider>
+      </QueryClientProvider>);
+    };
+    const useApi = () => {
+        const ctx = useContext(ApiContext);
+        if (!ctx) {
+            throw new Error('useApi must be used within ApiProvider');
+        }
+        return ctx;
+    };
+    const createQueryHook = (endpoint) => {
+        return (variables, options) => {
+            const { request } = useApi();
+            const queryKey = resolveValue(typeof endpoint.key === 'function'
+                ? () => endpoint.key(variables)
+                : endpoint.key);
+            return useQuery({
+                queryKey,
+                queryFn: () => {
+                    var _a, _b, _c, _d;
+                    return request({
+                        method: (_a = endpoint.method) !== null && _a !== void 0 ? _a : 'GET',
+                        path: typeof endpoint.path === 'function'
+                            ? endpoint.path(variables)
+                            : endpoint.path,
+                        query: (_b = endpoint.query) === null || _b === void 0 ? void 0 : _b.call(endpoint, variables),
+                        body: (_c = endpoint.body) === null || _c === void 0 ? void 0 : _c.call(endpoint, variables),
+                        headers: (_d = endpoint.headers) === null || _d === void 0 ? void 0 : _d.call(endpoint, variables),
+                        transform: endpoint.transform,
+                    });
+                },
+                ...options,
+            });
+        };
+    };
+    const createRoute = (route) => route;
+    const createRoutes = (routes) => routes;
+    const createQueryHookFromRoute = (route) => createQueryHook(route);
+    const createMutationHook = (endpoint, settings) => {
+        return (options) => {
+            const { request } = useApi();
+            const queryClient = useQueryClient();
+            return useMutation({
+                mutationFn: (variables) => {
+                    var _a, _b, _c, _d;
+                    return request({
+                        method: (_a = endpoint.method) !== null && _a !== void 0 ? _a : 'POST',
+                        path: typeof endpoint.path === 'function'
+                            ? endpoint.path(variables)
+                            : endpoint.path,
+                        query: (_b = endpoint.query) === null || _b === void 0 ? void 0 : _b.call(endpoint, variables),
+                        body: (_c = endpoint.body) === null || _c === void 0 ? void 0 : _c.call(endpoint, variables),
+                        headers: (_d = endpoint.headers) === null || _d === void 0 ? void 0 : _d.call(endpoint, variables),
+                        transform: endpoint.transform,
+                    });
+                },
+                ...options,
+                onSuccess: async (data, variables, onMutateResult, context) => {
+                    var _a, _b;
+                    if ((_a = settings === null || settings === void 0 ? void 0 : settings.invalidateKeys) === null || _a === void 0 ? void 0 : _a.length) {
+                        await Promise.all(settings.invalidateKeys.map((key) => queryClient.invalidateQueries({ queryKey: key })));
+                    }
+                    await ((_b = options === null || options === void 0 ? void 0 : options.onSuccess) === null || _b === void 0 ? void 0 : _b.call(options, data, variables, onMutateResult, context));
+                },
+            });
+        };
+    };
+    const createMutationHookFromRoute = (route, settings) => createMutationHook(route, settings);
+    return {
+        ApiProvider,
+        useApi,
+        createRoute,
+        createRoutes,
+        createQueryHook,
+        createQueryHookFromRoute,
+        createMutationHook,
+        createMutationHookFromRoute,
+    };
+};
+export default createApiProvider;

package/dist/modules/api/api-types.d.ts

@@ -0,0 +1,33 @@
+import type { QueryClient, QueryKey } from '@tanstack/react-query';
+export type HttpMethod = 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE';
+export type QueryParams = Record<string, string | number | boolean | null | undefined>;
+export type RequestHeaders = Record<string, string>;
+export type ApiRequestInput = {
+    method: HttpMethod;
+    path: string;
+    query?: QueryParams;
+    body?: unknown;
+    headers?: RequestHeaders;
+};
+export type CreateApiProviderOptions = {
+    baseUrl: string;
+    getHeaders?: () => Promise<RequestHeaders | undefined> | RequestHeaders | undefined;
+    createQueryClient?: () => QueryClient;
+};
+export type ApiEndpoint<TResponse, TVariables = void> = {
+    key: QueryKey | ((variables: TVariables) => QueryKey);
+    method?: HttpMethod;
+    path: string | ((variables: TVariables) => string);
+    query?: (variables: TVariables) => QueryParams | undefined;
+    body?: (variables: TVariables) => unknown;
+    headers?: (variables: TVariables) => RequestHeaders | undefined;
+    transform?: (raw: unknown) => TResponse;
+};
+export type InferRouteResponse<TRoute> = TRoute extends ApiEndpoint<infer TResponse, unknown> ? TResponse : never;
+export type InferRouteVariables<TRoute> = TRoute extends ApiEndpoint<unknown, infer TVariables> ? TVariables : never;
+export type RouteCatalog = Record<string, ApiEndpoint<unknown, never>>;
+export type ApiContextValue = {
+    request: <TResponse>(input: ApiRequestInput & {
+        transform?: (raw: unknown) => TResponse;
+    }) => Promise<TResponse>;
+};

package/dist/modules/api/api-types.js

@@ -0,0 +1 @@
+export {};

package/dist/modules/api/api-utils.d.ts

@@ -0,0 +1,3 @@
+import type { QueryParams } from './api-types';
+export declare const buildUrl: (baseUrl: string, path: string, query?: QueryParams) => string;
+export declare const resolveValue: <T>(value: T | (() => T)) => T;

package/dist/modules/api/api-utils.js

@@ -0,0 +1,23 @@
+export const buildUrl = (baseUrl, path, query) => {
+    const normalizedBase = baseUrl.endsWith('/')
+        ? baseUrl.slice(0, -1)
+        : baseUrl;
+    const normalizedPath = path.startsWith('/')
+        ? path
+        : `/${path}`;
+    if (!query)
+        return `${normalizedBase}${normalizedPath}`;
+    const queryString = Object.entries(query)
+        .filter(([, value]) => value !== undefined && value !== null)
+        .map(([key, value]) => `${encodeURIComponent(key)}=${encodeURIComponent(String(value))}`)
+        .join('&');
+    if (!queryString)
+        return `${normalizedBase}${normalizedPath}`;
+    return `${normalizedBase}${normalizedPath}?${queryString}`;
+};
+export const resolveValue = (value) => {
+    if (typeof value === 'function') {
+        return value();
+    }
+    return value;
+};

package/dist/modules/api/index.d.ts

@@ -0,0 +1,2 @@
+export { default as createApiProvider } from './api-provider';
+export type { ApiEndpoint, ApiContextValue, ApiRequestInput, CreateApiProviderOptions, HttpMethod, InferRouteResponse, InferRouteVariables, RouteCatalog, QueryParams, RequestHeaders, } from './api-types';

package/dist/modules/api/index.js

@@ -0,0 +1 @@
+export { default as createApiProvider } from './api-provider';

package/dist/modules/base-module.d.ts

@@ -0,0 +1,12 @@
+type Listener<TState> = (nextState: TState) => void;
+export default class BaseModule<TState> {
+    private state;
+    private readonly listeners;
+    constructor(initialState: TState);
+    getState(): TState;
+    subscribe(listener: Listener<TState>): () => void;
+    protected setState(nextState: TState | ((prevState: TState) => TState)): void;
+    init(): Promise<void>;
+    dispose(): void;
+}
+export {};

package/dist/modules/base-module.js

@@ -0,0 +1,33 @@
+export default class BaseModule {
+    constructor(initialState) {
+        // Track all subscribers that react to state changes.
+        this.listeners = new Set();
+        this.state = initialState;
+    }
+    getState() {
+        return this.state;
+    }
+    subscribe(listener) {
+        // Register subscriber and return an unsubscribe function.
+        this.listeners.add(listener);
+        return () => {
+            this.listeners.delete(listener);
+        };
+    }
+    setState(nextState) {
+        // Support direct values and updater functions.
+        this.state = typeof nextState === 'function'
+            ? nextState(this.state)
+            : nextState;
+        // Notify every subscriber with the latest state snapshot.
+        this.listeners.forEach((listener) => listener(this.state));
+    }
+    async init() {
+        // Allow subclasses to override async initialization logic.
+        return Promise.resolve();
+    }
+    dispose() {
+        // Release subscribers to avoid leaks when provider unmounts.
+        this.listeners.clear();
+    }
+}

package/dist/modules/config/config-module.d.ts

@@ -0,0 +1,10 @@
+import type { ActionTypes } from '../../types';
+import BaseModule from '../base-module';
+import type { ConfigState } from './config-types';
+export default class ConfigModule<T extends Record<string, string>> extends BaseModule<ConfigState<T>> {
+    private readonly baseConfig;
+    private readonly storage;
+    constructor(baseConfig: T, storage: ActionTypes.Storage);
+    init(): Promise<void>;
+    saveField(field: keyof T, value: string): Promise<void>;
+}

package/dist/modules/config/config-module.js

@@ -0,0 +1,25 @@
+import BaseModule from '../base-module';
+export default class ConfigModule extends BaseModule {
+    constructor(baseConfig, storage) {
+        super({ config: baseConfig });
+        this.baseConfig = baseConfig;
+        this.storage = storage;
+    }
+    async init() {
+        const nextConfig = { ...this.baseConfig };
+        for (const key of Object.keys(this.baseConfig)) {
+            const saved = await this.storage.get(key);
+            nextConfig[key] = (saved !== null && saved !== void 0 ? saved : this.baseConfig[key]);
+        }
+        this.setState({ config: nextConfig });
+    }
+    async saveField(field, value) {
+        this.setState((prev) => ({
+            config: {
+                ...prev.config,
+                [field]: value,
+            },
+        }));
+        await this.storage.set(field, value);
+    }
+}

package/dist/modules/config/config-provider.d.ts

@@ -0,0 +1,7 @@
+import type { ActionTypes } from '../../types';
+import type { UseConfigType } from './config-types';
+declare const createConfigProvider: <T extends Record<string, string>>(baseConfig: T, storage: ActionTypes.Storage) => {
+    ConfigProvider: ({ children, ...props }: import("../../types/default-react").ViewProps) => import("react").JSX.Element;
+    useConfig: () => UseConfigType<T>;
+};
+export default createConfigProvider;

package/dist/modules/config/config-provider.js

@@ -0,0 +1,17 @@
+import createModuleProvider from '../module-provider';
+import ConfigModule from './config-module';
+const createConfigProvider = (baseConfig, storage) => {
+    const { Provider, useValue, } = createModuleProvider({
+        createModule: () => new ConfigModule(baseConfig, storage),
+        mapContextValue: (module, state) => ({
+            config: state.config,
+            saveField: module.saveField.bind(module),
+        }),
+        missingProviderError: 'useConfig must be used within ConfigProvider',
+    });
+    return {
+        ConfigProvider: Provider,
+        useConfig: useValue,
+    };
+};
+export default createConfigProvider;

package/dist/modules/config/config-types.d.ts

@@ -0,0 +1,7 @@
+export type ConfigState<T extends Record<string, string>> = {
+    config: T;
+};
+export type UseConfigType<T extends Record<string, string>> = {
+    config: T;
+    saveField: (field: keyof T, value: string) => Promise<void>;
+};

package/dist/modules/config/config-types.js

@@ -0,0 +1 @@
+export {};

package/dist/modules/config/index.d.ts

@@ -0,0 +1,3 @@
+export { default as ConfigModule } from './config-module';
+export { default as createConfigProvider } from './config-provider';
+export type { ConfigState, UseConfigType } from './config-types';

package/dist/modules/config/index.js

@@ -0,0 +1,2 @@
+export { default as ConfigModule } from './config-module';
+export { default as createConfigProvider } from './config-provider';

package/dist/modules/index.d.ts

@@ -0,0 +1,9 @@
+export { default as BaseModule } from './base-module';
+export { default as createModuleProvider } from './module-provider';
+export { default as createLightDarkProvider } from './theme/theme-provider';
+export { default as createConfigProvider } from './config/config-provider';
+export { default as createLangProvider } from './lang/lang-provider';
+export { createApiProvider } from './api';
+export { NavigatorProvider, useNavigator } from './navigator';
+export { ToastProvider, useToast, DefaultToastBody } from './toast';
+export type { ToastComponentProps } from './toast/toast-types';

package/dist/modules/index.js

@@ -0,0 +1,8 @@
+export { default as BaseModule } from './base-module';
+export { default as createModuleProvider } from './module-provider';
+export { default as createLightDarkProvider } from './theme/theme-provider';
+export { default as createConfigProvider } from './config/config-provider';
+export { default as createLangProvider } from './lang/lang-provider';
+export { createApiProvider } from './api';
+export { NavigatorProvider, useNavigator } from './navigator';
+export { ToastProvider, useToast, DefaultToastBody } from './toast';

package/dist/modules/lang/index.d.ts

@@ -0,0 +1,3 @@
+export { default as LangModule } from './lang-module';
+export { default as createLangProvider } from './lang-provider';
+export type { LangState, Langs, UseLangType } from './lang-types';

package/dist/modules/lang/index.js

@@ -0,0 +1,2 @@
+export { default as LangModule } from './lang-module';
+export { default as createLangProvider } from './lang-provider';

package/dist/modules/lang/lang-module.d.ts

@@ -0,0 +1,11 @@
+import type { ActionTypes } from '../../types';
+import BaseModule from '../base-module';
+import type { Langs, LangState } from './lang-types';
+export default class LangModule<T extends Langs> extends BaseModule<LangState<T>> {
+    private readonly langs;
+    private readonly storage;
+    private readonly firstLangKey;
+    constructor(langs: T, storage: ActionTypes.Storage);
+    init(): Promise<void>;
+    changeLang(lang: keyof T): Promise<void>;
+}

package/dist/modules/lang/lang-module.js

@@ -0,0 +1,27 @@
+import BaseModule from '../base-module';
+const langKey = 'currentLanguage';
+export default class LangModule extends BaseModule {
+    constructor(langs, storage) {
+        const firstLangKey = Object.keys(langs).shift();
+        if (!firstLangKey) {
+            throw new Error('createLangProvider requires at least one language');
+        }
+        super({ currentLang: firstLangKey });
+        this.langs = langs;
+        this.storage = storage;
+        this.firstLangKey = firstLangKey;
+    }
+    async init() {
+        const stored = await this.storage.get(langKey);
+        if (!stored)
+            return;
+        if (!(stored in this.langs))
+            return;
+        this.setState({ currentLang: stored });
+    }
+    async changeLang(lang) {
+        const target = this.langs[lang] ? lang : this.firstLangKey;
+        this.setState({ currentLang: target });
+        await this.storage.set(langKey, String(target));
+    }
+}

package/dist/modules/lang/lang-provider.d.ts

@@ -0,0 +1,7 @@
+import type { ActionTypes } from '../../types';
+import type { Langs, UseLangType } from './lang-types';
+declare const createLangProvider: <T extends Langs>(langs: T, storage: ActionTypes.Storage) => {
+    LangProvider: ({ children, ...props }: import("../../types/default-react").ViewProps) => import("react").JSX.Element;
+    useLang: () => UseLangType<T>;
+};
+export default createLangProvider;

package/dist/modules/lang/lang-provider.js

@@ -0,0 +1,18 @@
+import createModuleProvider from '../module-provider';
+import LangModule from './lang-module';
+const createLangProvider = (langs, storage) => {
+    const { Provider, useValue, } = createModuleProvider({
+        createModule: () => new LangModule(langs, storage),
+        mapContextValue: (module, state) => ({
+            lang: langs[state.currentLang],
+            currentLang: state.currentLang,
+            changeLang: module.changeLang.bind(module),
+        }),
+        missingProviderError: 'useLang must be used within a LangProvider',
+    });
+    return {
+        LangProvider: Provider,
+        useLang: useValue,
+    };
+};
+export default createLangProvider;

package/dist/modules/lang/lang-types.d.ts

@@ -0,0 +1,9 @@
+export type Langs = Record<string, object>;
+export type LangState<T extends Langs> = {
+    currentLang: keyof T;
+};
+export type UseLangType<T extends Langs> = {
+    lang: T[keyof T];
+    currentLang: keyof T;
+    changeLang: (newLangKey: keyof T) => Promise<void>;
+};

package/dist/modules/lang/lang-types.js

@@ -0,0 +1 @@
+export {};

package/dist/modules/module-provider.d.ts

@@ -0,0 +1,12 @@
+import type { DefaultReact } from '../types';
+import type BaseModule from './base-module';
+type CreateModuleProviderOptions<TState, TModule extends BaseModule<TState>, TContextValue> = {
+    createModule: () => TModule;
+    mapContextValue: (module: TModule, state: TState) => TContextValue;
+    missingProviderError: string;
+};
+declare const _default: <TState, TModule extends BaseModule<TState>, TContextValue>({ createModule, mapContextValue, missingProviderError, }: CreateModuleProviderOptions<TState, TModule, TContextValue>) => {
+    Provider: ({ children, ...props }: DefaultReact.ViewProps) => import("react").JSX.Element;
+    useValue: () => NonNullable<TContextValue>;
+};
+export default _default;