stratakit/core/routing/AutoRouterProvider.js

stratakit - Meta-framework React puro con Auto Router automático, file-based routing, SEO automático y performance superior

import { jsx as _jsx } from "react/jsx-runtime";
// AutoRouterProvider - Proporciona el router automático de manera transparente
// Funciona como Next.js App Router - el programador no ve este código
import { createContext, useContext } from 'react';
import { BrowserRouter } from 'react-router-dom';
import { useAutoRouter } from './useAutoRouter';
const AutoRouterContext = createContext(undefined);
export const useAutoRouterContext = () => {
    const context = useContext(AutoRouterContext);
    if (!context) {
        throw new Error('useAutoRouterContext must be used within AutoRouterProvider');
    }
    return context;
};
// Componente interno que usa el hook
const AutoRouterInner = ({ children, fallback: FallbackComponent, errorComponent: ErrorComponent, loadingComponent: LoadingComponent }) => {
    const autoRouter = useAutoRouter();
    // Mostrar loading si está cargando
    if (autoRouter.isLoading && LoadingComponent) {
        return _jsx(LoadingComponent, {});
    }
    // Mostrar error si hay error
    if (autoRouter.error && ErrorComponent) {
        return _jsx(ErrorComponent, { error: autoRouter.error });
    }
    // Mostrar fallback si no hay rutas
    if (autoRouter.routes.length === 0 && FallbackComponent) {
        return _jsx(FallbackComponent, {});
    }
    return (_jsx(AutoRouterContext.Provider, { value: autoRouter, children: children }));
};
// Componente principal del provider
export const AutoRouterProvider = ({ children, fallback, errorComponent, loadingComponent }) => {
    return (_jsx(BrowserRouter, { children: _jsx(AutoRouterInner, { fallback: fallback, errorComponent: errorComponent, loadingComponent: loadingComponent, children: children }) }));
};
// Componente para renderizar la ruta actual automáticamente
export const AutoRouteRenderer = ({ fallback: FallbackComponent, errorComponent: ErrorComponent }) => {
    const { currentRoute, isLoading, error } = useAutoRouterContext();
    if (isLoading) {
        return _jsx("div", { children: "Cargando..." });
    }
    if (error && ErrorComponent) {
        return _jsx(ErrorComponent, { error: error });
    }
    if (!currentRoute) {
        return FallbackComponent ? _jsx(FallbackComponent, {}) : _jsx("div", { children: "P\u00E1gina no encontrada" });
    }
    const Component = currentRoute.component;
    if (!Component) {
        return FallbackComponent ? _jsx(FallbackComponent, {}) : _jsx("div", { children: "Componente no encontrado" });
    }
    return _jsx(Component, {});
};
// Hook simplificado para usar en componentes
export const useRoute = () => {
    const { currentRoute, navigate, isRouteActive } = useAutoRouterContext();
    return {
        currentRoute,
        navigate,
        isActive: (path) => isRouteActive(path)
    };
};
// Hook para navegación
export const useNavigation = () => {
    const { navigate, routes } = useAutoRouterContext();
    return {
        navigate,
        routes,
        goTo: (path, options) => navigate(path, options)
    };
};
export default AutoRouterProvider;