@hai3/react 0.2.0-alpha.0

package/dist/index.d.cts

@@ -0,0 +1,345 @@
+import * as React from 'react';
+import React__default, { ReactNode } from 'react';
+import { HAI3ProviderProps, UseTranslationReturn, UseScreenTranslationsReturn, UseNavigationReturn, UseThemeReturn, TextLoaderProps, AppRouterProps } from './types.cjs';
+export { AppRouterComponent, HAI3ProviderComponent, TextLoaderComponent, UseAppDispatchReturn, UseAppSelector, UseHAI3Return, UseLanguageReturn, UseMenuReturn, UseOverlayReturn, UsePopupReturn, UseScreenReturn, UseScreensetReturn } from './types.cjs';
+import { HAI3App, AppDispatch, RootState, TranslationMap, TranslationLoader } from '@hai3/framework';
+export { ACCOUNTS_DOMAIN, ApiProtocol, ApiService, ApiServiceConfig, ApiServicesMap, AppDispatch, BaseApiService, ChangeThemePayload, EventHandler, EventPayloadMap, FooterConfig, FooterState, HAI3App, HAI3AppBuilder, HAI3Config, HAI3Plugin, HAI3Store, HeaderConfig, HeaderState, HeaderUser, I18nConfig, I18nRegistry, I18nRegistryImpl, I18nRegistryType, JsonCompatible, JsonObject, JsonPrimitive, JsonValue, LAYOUT_SLICE_NAME, LanguageMetadata, LayoutDomain, LayoutDomainReducers, LayoutDomainState, LayoutState, LegacyTheme, MenuItem, MenuItemConfig, MenuScreenItem, MenuState, MockMap, MockPlugin, NavigateToScreenPayload, NavigateToScreensetPayload, OverlayConfig, OverlayState, PluginFactory, PluginLifecycle, PluginProvides, PopupConfig, PopupSliceState, PopupState, Preset, Presets, RestProtocol, RestProtocolConfig, RootState, RootStateWithLayout, RouteRegistry, SUPPORTED_LANGUAGES, ScreenConfig, ScreenId, ScreenLoader, ScreenState, ScreensetCategory, ScreensetConfig, ScreensetDefinition, ScreensetId, ScreensetRegistry, ScreensetsConfig, SetLanguagePayload, ShowPopupPayload, SidebarPosition, SidebarState, SliceObject, SseProtocol, SseProtocolConfig, Subscription, TENANT_SLICE_NAME, Tenant, TenantChangedPayload, TenantClearedPayload, TenantEvents, TenantState, ThemeApplyFn, ThemeConfig, ThemeRegistry, TranslationDictionary, TranslationLoader, TranslationMap, apiRegistry, changeTenant, clearActiveScreen, clearTenant, clearTenantAction, clearUser, closeAllPopups, closePopup, closeTopPopup, createHAI3, createHAI3App, createI18nRegistry, createRouteRegistry, createScreensetRegistry, createSlice, createStore, createThemeRegistry, effects, eventBus, fetchCurrentUser, footerActions, footerSlice, getLanguageMetadata, getStore, hasSlice, headerActions, headerSlice, hideOverlay, i18n, i18nRegistry, initTenantEffects, layout, layoutDomainReducers, layoutReducer, menuActions, menuSlice, navigateTo, navigateToScreen, navigation, openPopup, overlayActions, overlaySlice, popupActions, popupSlice, presets, registerSlice, routeRegistry, routing, screenActions, screenSlice, screensetRegistry, screensets, setActiveScreen, setFooterConfig, setFooterVisible, setHeaderLoading, setMenuCollapsed, setMenuConfig, setMenuItems, setMenuVisible, setOverlayVisible, setScreenLoading, setSidebarCollapsed, setSidebarConfig, setSidebarContent, setSidebarPosition, setSidebarTitle, setSidebarVisible, setSidebarWidth, setTenant, setTenantLoading, setTenantLoadingState, setUser, showOverlay, sidebarActions, sidebarSlice, tenantActions, tenantReducer, tenantSlice, themeRegistry, themes, toggleMenu, toggleSidebar } from '@hai3/framework';
+import { TypedUseSelectorHook } from 'react-redux';
+import { ComponentName, UiKitComponentMap, UiKitIcon } from '@hai3/uikit';
+export { ComponentName, UiKitComponent, UiKitComponentMap, UiKitIcon } from '@hai3/uikit';
+export { Language, LanguageDisplayMode, TextDirection } from '@hai3/i18n';
+
+/**
+ * HAI3 Provider - Main provider component for HAI3 applications
+ *
+ * React Layer: L3 (Depends on @hai3/framework)
+ */
+
+/**
+ * HAI3 Provider Component
+ *
+ * Provides the HAI3 application context to all child components.
+ * Creates the HAI3 app instance with the full preset by default.
+ *
+ * @example
+ * ```tsx
+ * // Default - creates app with full preset
+ * <HAI3Provider>
+ *   <App />
+ * </HAI3Provider>
+ *
+ * // With configuration
+ * <HAI3Provider config={{ devMode: true }}>
+ *   <App />
+ * </HAI3Provider>
+ *
+ * // With pre-built app
+ * const app = createHAI3().use(screensets()).build();
+ * <HAI3Provider app={app}>
+ *   <App />
+ * </HAI3Provider>
+ * ```
+ */
+declare const HAI3Provider: React__default.FC<HAI3ProviderProps>;
+
+/**
+ * HAI3 Context
+ * Holds the HAI3 app instance for the application.
+ */
+declare const HAI3Context: React.Context<HAI3App | null>;
+/**
+ * Use the HAI3 context.
+ * Throws if used outside of HAI3Provider.
+ *
+ * @returns The HAI3 app instance
+ */
+declare function useHAI3(): HAI3App;
+
+/**
+ * useAppDispatch Hook - Type-safe dispatch hook
+ *
+ * React Layer: L3
+ */
+
+/**
+ * Type-safe dispatch hook.
+ *
+ * @returns The typed dispatch function
+ *
+ * @example
+ * ```tsx
+ * const dispatch = useAppDispatch();
+ * dispatch(someAction());
+ * ```
+ */
+declare function useAppDispatch(): AppDispatch;
+
+/**
+ * useAppSelector Hook - Type-safe selector hook
+ *
+ * React Layer: L3
+ */
+
+/**
+ * Type-safe selector hook.
+ *
+ * @example
+ * ```tsx
+ * const activeScreen = useAppSelector(selectActiveScreen);
+ * const menuCollapsed = useAppSelector(selectMenuCollapsed);
+ * ```
+ */
+declare const useAppSelector: TypedUseSelectorHook<RootState>;
+
+/**
+ * useTranslation Hook - Translation utilities
+ *
+ * React Layer: L3
+ */
+
+/**
+ * Hook for accessing translation utilities.
+ *
+ * @returns Translation utilities
+ *
+ * @example
+ * ```tsx
+ * const { t, language, setLanguage, isRTL } = useTranslation();
+ *
+ * return (
+ *   <div dir={isRTL ? 'rtl' : 'ltr'}>
+ *     <h1>{t('common:app.title')}</h1>
+ *     <p>{t('common:app.welcome', { name: 'John' })}</p>
+ *   </div>
+ * );
+ * ```
+ */
+declare function useTranslation(): UseTranslationReturn;
+
+/**
+ * useScreenTranslations Hook - Screen-level translation loading
+ *
+ * React Layer: L3
+ */
+
+/**
+ * Hook for loading screen-level translations.
+ * Use this in screen components to lazy-load translations.
+ * Automatically reloads translations when language changes.
+ *
+ * @param screensetId - The screenset ID
+ * @param screenId - The screen ID
+ * @param translations - Either a TranslationMap object or a TranslationLoader function
+ *   (from I18nRegistry.createLoader)
+ * @returns Loading state
+ *
+ * @example
+ * ```tsx
+ * // Option 1: Using I18nRegistry.createLoader (recommended)
+ * const translations = I18nRegistry.createLoader({
+ *   en: () => import('./i18n/en.json'),
+ *   es: () => import('./i18n/es.json'),
+ * });
+ *
+ * // Option 2: Using raw TranslationMap
+ * const translations = {
+ *   en: () => import('./i18n/en.json'),
+ *   es: () => import('./i18n/es.json'),
+ * };
+ *
+ * export const HomeScreen: React.FC = () => {
+ *   const { isLoaded, error } = useScreenTranslations(
+ *     'demo',
+ *     'home',
+ *     translations
+ *   );
+ *
+ *   if (!isLoaded) return <LoadingSpinner />;
+ *   if (error) return <ErrorMessage error={error} />;
+ *
+ *   return <div>...</div>;
+ * };
+ * ```
+ */
+declare function useScreenTranslations(screensetId: string, screenId: string, translations: TranslationMap | TranslationLoader): UseScreenTranslationsReturn;
+
+/**
+ * useNavigation Hook - Navigation utilities
+ *
+ * React Layer: L3
+ */
+
+/**
+ * Hook for navigation utilities.
+ *
+ * @returns Navigation utilities
+ *
+ * @example
+ * ```tsx
+ * const { navigateToScreen, navigateToScreenset, currentScreen } = useNavigation();
+ *
+ * return (
+ *   <button onClick={() => navigateToScreen('demo', 'home')}>
+ *     Go to Home
+ *   </button>
+ * );
+ * ```
+ */
+declare function useNavigation(): UseNavigationReturn;
+
+/**
+ * useTheme Hook - Theme utilities
+ *
+ * React Layer: L3
+ */
+
+/**
+ * Hook for theme utilities.
+ *
+ * @returns Theme utilities
+ *
+ * @example
+ * ```tsx
+ * const { currentTheme, themes, setTheme } = useTheme();
+ *
+ * return (
+ *   <select
+ *     value={currentTheme}
+ *     onChange={(e) => setTheme(e.target.value)}
+ *   >
+ *     {themes.map((theme) => (
+ *       <option key={theme.id} value={theme.id}>
+ *         {theme.name}
+ *       </option>
+ *     ))}
+ *   </select>
+ * );
+ * ```
+ */
+declare function useTheme(): UseThemeReturn;
+
+/**
+ * TextLoader Component - Prevents flash of untranslated content
+ *
+ * React Layer: L3
+ */
+
+/**
+ * TextLoader Component
+ *
+ * Generic wrapper for translated text that automatically shows a skeleton loader
+ * while translations are being loaded. This eliminates the need for manual
+ * loading state checks throughout the application.
+ *
+ * @example
+ * ```tsx
+ * // Heading - default bg-muted skeleton
+ * <TextLoader skeletonClassName="h-10 w-64">
+ *   <h1 className="text-4xl font-bold">{t('screen.title')}</h1>
+ * </TextLoader>
+ *
+ * // Button label - inherits button text color
+ * <Button>
+ *   <TextLoader skeletonClassName="h-4 w-24" inheritColor>
+ *     {t('button.submit')}
+ *   </TextLoader>
+ * </Button>
+ * ```
+ */
+declare const TextLoader: React__default.FC<TextLoaderProps>;
+
+/**
+ * AppRouter Component - Renders the active screen
+ *
+ * React Layer: L3
+ */
+
+/**
+ * AppRouter Component
+ *
+ * Renders the currently active screen based on navigation state.
+ * Handles lazy loading and error boundaries.
+ *
+ * @example
+ * ```tsx
+ * <HAI3Provider>
+ *   <Layout>
+ *     <AppRouter
+ *       fallback={<LoadingSpinner />}
+ *       errorFallback={(error) => <ErrorPage error={error} />}
+ *     />
+ *   </Layout>
+ * </HAI3Provider>
+ * ```
+ */
+declare const AppRouter: React__default.FC<AppRouterProps>;
+
+/**
+ * UI Kit Registry Service
+ * Unified registry for UI components and icons
+ * Allows applications to register UI Kit implementations at runtime
+ *
+ * OPEN/CLOSED PRINCIPLE:
+ * - Registry is CLOSED for modification
+ * - UI elements register themselves at app level
+ * - UI Core depends on interfaces, not implementations
+ */
+
+declare class UiKitRegistry {
+    private components;
+    private icons;
+    /**
+     * Register a component implementation
+     */
+    registerComponent<K extends ComponentName>(name: K, component: UiKitComponentMap[K]): void;
+    /**
+     * Register multiple components at once
+     * Type-safe: only accepts components defined in UiKitComponentMap
+     */
+    registerComponents(components: Partial<UiKitComponentMap>): void;
+    /**
+     * Get a component by name
+     */
+    getComponent<K extends ComponentName>(name: K): UiKitComponentMap[K];
+    /**
+     * Check if a component is registered
+     */
+    hasComponent(name: ComponentName): boolean;
+    /**
+     * Get all registered component names
+     */
+    getRegisteredComponents(): ComponentName[];
+    /**
+     * Register an icon
+     * Only accepts UiKitIcon enum or exported string constants
+     * NO hardcoded string literals
+     */
+    registerIcon(id: UiKitIcon | string, icon: ReactNode): void;
+    /**
+     * Register multiple icons at once
+     * Only accepts UiKitIcon enum or exported string constants
+     * NO hardcoded string literals
+     */
+    registerIcons(icons: Record<string, ReactNode>): void;
+    /**
+     * Get an icon by ID
+     * Accepts UiKitIcon enum or exported string constants
+     */
+    getIcon(id: UiKitIcon | string): ReactNode | undefined;
+    /**
+     * Get all registered icons
+     */
+    getAllIcons(): Record<string, ReactNode>;
+    /**
+     * Check if an icon is registered
+     * Accepts UiKitIcon enum or exported string constants
+     */
+    hasIcon(id: UiKitIcon | string): boolean;
+    /**
+     * Clear all registrations (for testing)
+     */
+    clear(): void;
+}
+declare const uikitRegistry: UiKitRegistry;
+
+export { AppRouter, AppRouterProps, HAI3Context, HAI3Provider, HAI3ProviderProps, TextLoader, TextLoaderProps, UseNavigationReturn, UseScreenTranslationsReturn, UseThemeReturn, UseTranslationReturn, uikitRegistry, useAppDispatch, useAppSelector, useHAI3, useNavigation, useScreenTranslations, useTheme, useTranslation };

package/dist/index.d.ts

@@ -0,0 +1,345 @@
+import * as React from 'react';
+import React__default, { ReactNode } from 'react';
+import { HAI3ProviderProps, UseTranslationReturn, UseScreenTranslationsReturn, UseNavigationReturn, UseThemeReturn, TextLoaderProps, AppRouterProps } from './types.js';
+export { AppRouterComponent, HAI3ProviderComponent, TextLoaderComponent, UseAppDispatchReturn, UseAppSelector, UseHAI3Return, UseLanguageReturn, UseMenuReturn, UseOverlayReturn, UsePopupReturn, UseScreenReturn, UseScreensetReturn } from './types.js';
+import { HAI3App, AppDispatch, RootState, TranslationMap, TranslationLoader } from '@hai3/framework';
+export { ACCOUNTS_DOMAIN, ApiProtocol, ApiService, ApiServiceConfig, ApiServicesMap, AppDispatch, BaseApiService, ChangeThemePayload, EventHandler, EventPayloadMap, FooterConfig, FooterState, HAI3App, HAI3AppBuilder, HAI3Config, HAI3Plugin, HAI3Store, HeaderConfig, HeaderState, HeaderUser, I18nConfig, I18nRegistry, I18nRegistryImpl, I18nRegistryType, JsonCompatible, JsonObject, JsonPrimitive, JsonValue, LAYOUT_SLICE_NAME, LanguageMetadata, LayoutDomain, LayoutDomainReducers, LayoutDomainState, LayoutState, LegacyTheme, MenuItem, MenuItemConfig, MenuScreenItem, MenuState, MockMap, MockPlugin, NavigateToScreenPayload, NavigateToScreensetPayload, OverlayConfig, OverlayState, PluginFactory, PluginLifecycle, PluginProvides, PopupConfig, PopupSliceState, PopupState, Preset, Presets, RestProtocol, RestProtocolConfig, RootState, RootStateWithLayout, RouteRegistry, SUPPORTED_LANGUAGES, ScreenConfig, ScreenId, ScreenLoader, ScreenState, ScreensetCategory, ScreensetConfig, ScreensetDefinition, ScreensetId, ScreensetRegistry, ScreensetsConfig, SetLanguagePayload, ShowPopupPayload, SidebarPosition, SidebarState, SliceObject, SseProtocol, SseProtocolConfig, Subscription, TENANT_SLICE_NAME, Tenant, TenantChangedPayload, TenantClearedPayload, TenantEvents, TenantState, ThemeApplyFn, ThemeConfig, ThemeRegistry, TranslationDictionary, TranslationLoader, TranslationMap, apiRegistry, changeTenant, clearActiveScreen, clearTenant, clearTenantAction, clearUser, closeAllPopups, closePopup, closeTopPopup, createHAI3, createHAI3App, createI18nRegistry, createRouteRegistry, createScreensetRegistry, createSlice, createStore, createThemeRegistry, effects, eventBus, fetchCurrentUser, footerActions, footerSlice, getLanguageMetadata, getStore, hasSlice, headerActions, headerSlice, hideOverlay, i18n, i18nRegistry, initTenantEffects, layout, layoutDomainReducers, layoutReducer, menuActions, menuSlice, navigateTo, navigateToScreen, navigation, openPopup, overlayActions, overlaySlice, popupActions, popupSlice, presets, registerSlice, routeRegistry, routing, screenActions, screenSlice, screensetRegistry, screensets, setActiveScreen, setFooterConfig, setFooterVisible, setHeaderLoading, setMenuCollapsed, setMenuConfig, setMenuItems, setMenuVisible, setOverlayVisible, setScreenLoading, setSidebarCollapsed, setSidebarConfig, setSidebarContent, setSidebarPosition, setSidebarTitle, setSidebarVisible, setSidebarWidth, setTenant, setTenantLoading, setTenantLoadingState, setUser, showOverlay, sidebarActions, sidebarSlice, tenantActions, tenantReducer, tenantSlice, themeRegistry, themes, toggleMenu, toggleSidebar } from '@hai3/framework';
+import { TypedUseSelectorHook } from 'react-redux';
+import { ComponentName, UiKitComponentMap, UiKitIcon } from '@hai3/uikit';
+export { ComponentName, UiKitComponent, UiKitComponentMap, UiKitIcon } from '@hai3/uikit';
+export { Language, LanguageDisplayMode, TextDirection } from '@hai3/i18n';
+
+/**
+ * HAI3 Provider - Main provider component for HAI3 applications
+ *
+ * React Layer: L3 (Depends on @hai3/framework)
+ */
+
+/**
+ * HAI3 Provider Component
+ *
+ * Provides the HAI3 application context to all child components.
+ * Creates the HAI3 app instance with the full preset by default.
+ *
+ * @example
+ * ```tsx
+ * // Default - creates app with full preset
+ * <HAI3Provider>
+ *   <App />
+ * </HAI3Provider>
+ *
+ * // With configuration
+ * <HAI3Provider config={{ devMode: true }}>
+ *   <App />
+ * </HAI3Provider>
+ *
+ * // With pre-built app
+ * const app = createHAI3().use(screensets()).build();
+ * <HAI3Provider app={app}>
+ *   <App />
+ * </HAI3Provider>
+ * ```
+ */
+declare const HAI3Provider: React__default.FC<HAI3ProviderProps>;
+
+/**
+ * HAI3 Context
+ * Holds the HAI3 app instance for the application.
+ */
+declare const HAI3Context: React.Context<HAI3App | null>;
+/**
+ * Use the HAI3 context.
+ * Throws if used outside of HAI3Provider.
+ *
+ * @returns The HAI3 app instance
+ */
+declare function useHAI3(): HAI3App;
+
+/**
+ * useAppDispatch Hook - Type-safe dispatch hook
+ *
+ * React Layer: L3
+ */
+
+/**
+ * Type-safe dispatch hook.
+ *
+ * @returns The typed dispatch function
+ *
+ * @example
+ * ```tsx
+ * const dispatch = useAppDispatch();
+ * dispatch(someAction());
+ * ```
+ */
+declare function useAppDispatch(): AppDispatch;
+
+/**
+ * useAppSelector Hook - Type-safe selector hook
+ *
+ * React Layer: L3
+ */
+
+/**
+ * Type-safe selector hook.
+ *
+ * @example
+ * ```tsx
+ * const activeScreen = useAppSelector(selectActiveScreen);
+ * const menuCollapsed = useAppSelector(selectMenuCollapsed);
+ * ```
+ */
+declare const useAppSelector: TypedUseSelectorHook<RootState>;
+
+/**
+ * useTranslation Hook - Translation utilities
+ *
+ * React Layer: L3
+ */
+
+/**
+ * Hook for accessing translation utilities.
+ *
+ * @returns Translation utilities
+ *
+ * @example
+ * ```tsx
+ * const { t, language, setLanguage, isRTL } = useTranslation();
+ *
+ * return (
+ *   <div dir={isRTL ? 'rtl' : 'ltr'}>
+ *     <h1>{t('common:app.title')}</h1>
+ *     <p>{t('common:app.welcome', { name: 'John' })}</p>
+ *   </div>
+ * );
+ * ```
+ */
+declare function useTranslation(): UseTranslationReturn;
+
+/**
+ * useScreenTranslations Hook - Screen-level translation loading
+ *
+ * React Layer: L3
+ */
+
+/**
+ * Hook for loading screen-level translations.
+ * Use this in screen components to lazy-load translations.
+ * Automatically reloads translations when language changes.
+ *
+ * @param screensetId - The screenset ID
+ * @param screenId - The screen ID
+ * @param translations - Either a TranslationMap object or a TranslationLoader function
+ *   (from I18nRegistry.createLoader)
+ * @returns Loading state
+ *
+ * @example
+ * ```tsx
+ * // Option 1: Using I18nRegistry.createLoader (recommended)
+ * const translations = I18nRegistry.createLoader({
+ *   en: () => import('./i18n/en.json'),
+ *   es: () => import('./i18n/es.json'),
+ * });
+ *
+ * // Option 2: Using raw TranslationMap
+ * const translations = {
+ *   en: () => import('./i18n/en.json'),
+ *   es: () => import('./i18n/es.json'),
+ * };
+ *
+ * export const HomeScreen: React.FC = () => {
+ *   const { isLoaded, error } = useScreenTranslations(
+ *     'demo',
+ *     'home',
+ *     translations
+ *   );
+ *
+ *   if (!isLoaded) return <LoadingSpinner />;
+ *   if (error) return <ErrorMessage error={error} />;
+ *
+ *   return <div>...</div>;
+ * };
+ * ```
+ */
+declare function useScreenTranslations(screensetId: string, screenId: string, translations: TranslationMap | TranslationLoader): UseScreenTranslationsReturn;
+
+/**
+ * useNavigation Hook - Navigation utilities
+ *
+ * React Layer: L3
+ */
+
+/**
+ * Hook for navigation utilities.
+ *
+ * @returns Navigation utilities
+ *
+ * @example
+ * ```tsx
+ * const { navigateToScreen, navigateToScreenset, currentScreen } = useNavigation();
+ *
+ * return (
+ *   <button onClick={() => navigateToScreen('demo', 'home')}>
+ *     Go to Home
+ *   </button>
+ * );
+ * ```
+ */
+declare function useNavigation(): UseNavigationReturn;
+
+/**
+ * useTheme Hook - Theme utilities
+ *
+ * React Layer: L3
+ */
+
+/**
+ * Hook for theme utilities.
+ *
+ * @returns Theme utilities
+ *
+ * @example
+ * ```tsx
+ * const { currentTheme, themes, setTheme } = useTheme();
+ *
+ * return (
+ *   <select
+ *     value={currentTheme}
+ *     onChange={(e) => setTheme(e.target.value)}
+ *   >
+ *     {themes.map((theme) => (
+ *       <option key={theme.id} value={theme.id}>
+ *         {theme.name}
+ *       </option>
+ *     ))}
+ *   </select>
+ * );
+ * ```
+ */
+declare function useTheme(): UseThemeReturn;
+
+/**
+ * TextLoader Component - Prevents flash of untranslated content
+ *
+ * React Layer: L3
+ */
+
+/**
+ * TextLoader Component
+ *
+ * Generic wrapper for translated text that automatically shows a skeleton loader
+ * while translations are being loaded. This eliminates the need for manual
+ * loading state checks throughout the application.
+ *
+ * @example
+ * ```tsx
+ * // Heading - default bg-muted skeleton
+ * <TextLoader skeletonClassName="h-10 w-64">
+ *   <h1 className="text-4xl font-bold">{t('screen.title')}</h1>
+ * </TextLoader>
+ *
+ * // Button label - inherits button text color
+ * <Button>
+ *   <TextLoader skeletonClassName="h-4 w-24" inheritColor>
+ *     {t('button.submit')}
+ *   </TextLoader>
+ * </Button>
+ * ```
+ */
+declare const TextLoader: React__default.FC<TextLoaderProps>;
+
+/**
+ * AppRouter Component - Renders the active screen
+ *
+ * React Layer: L3
+ */
+
+/**
+ * AppRouter Component
+ *
+ * Renders the currently active screen based on navigation state.
+ * Handles lazy loading and error boundaries.
+ *
+ * @example
+ * ```tsx
+ * <HAI3Provider>
+ *   <Layout>
+ *     <AppRouter
+ *       fallback={<LoadingSpinner />}
+ *       errorFallback={(error) => <ErrorPage error={error} />}
+ *     />
+ *   </Layout>
+ * </HAI3Provider>
+ * ```
+ */
+declare const AppRouter: React__default.FC<AppRouterProps>;
+
+/**
+ * UI Kit Registry Service
+ * Unified registry for UI components and icons
+ * Allows applications to register UI Kit implementations at runtime
+ *
+ * OPEN/CLOSED PRINCIPLE:
+ * - Registry is CLOSED for modification
+ * - UI elements register themselves at app level
+ * - UI Core depends on interfaces, not implementations
+ */
+
+declare class UiKitRegistry {
+    private components;
+    private icons;
+    /**
+     * Register a component implementation
+     */
+    registerComponent<K extends ComponentName>(name: K, component: UiKitComponentMap[K]): void;
+    /**
+     * Register multiple components at once
+     * Type-safe: only accepts components defined in UiKitComponentMap
+     */
+    registerComponents(components: Partial<UiKitComponentMap>): void;
+    /**
+     * Get a component by name
+     */
+    getComponent<K extends ComponentName>(name: K): UiKitComponentMap[K];
+    /**
+     * Check if a component is registered
+     */
+    hasComponent(name: ComponentName): boolean;
+    /**
+     * Get all registered component names
+     */
+    getRegisteredComponents(): ComponentName[];
+    /**
+     * Register an icon
+     * Only accepts UiKitIcon enum or exported string constants
+     * NO hardcoded string literals
+     */
+    registerIcon(id: UiKitIcon | string, icon: ReactNode): void;
+    /**
+     * Register multiple icons at once
+     * Only accepts UiKitIcon enum or exported string constants
+     * NO hardcoded string literals
+     */
+    registerIcons(icons: Record<string, ReactNode>): void;
+    /**
+     * Get an icon by ID
+     * Accepts UiKitIcon enum or exported string constants
+     */
+    getIcon(id: UiKitIcon | string): ReactNode | undefined;
+    /**
+     * Get all registered icons
+     */
+    getAllIcons(): Record<string, ReactNode>;
+    /**
+     * Check if an icon is registered
+     * Accepts UiKitIcon enum or exported string constants
+     */
+    hasIcon(id: UiKitIcon | string): boolean;
+    /**
+     * Clear all registrations (for testing)
+     */
+    clear(): void;
+}
+declare const uikitRegistry: UiKitRegistry;
+
+export { AppRouter, AppRouterProps, HAI3Context, HAI3Provider, HAI3ProviderProps, TextLoader, TextLoaderProps, UseNavigationReturn, UseScreenTranslationsReturn, UseThemeReturn, UseTranslationReturn, uikitRegistry, useAppDispatch, useAppSelector, useHAI3, useNavigation, useScreenTranslations, useTheme, useTranslation };