olova 2.0.61 → 2.0.63

package/src/router/OlovaRouter.tsx

@@ -1,354 +0,0 @@
-import { Suspense, useCallback, useEffect, useMemo, useRef, useState, useTransition, type ComponentType, type ReactNode } from 'react';
-import type { LayoutRoute, Metadata, NavigateOptions, NotFoundPageConfig, Route, SearchParams, SetSearchParamsOptions } from '../types';
-import { OutletContext, RouterContext } from './context';
-import { ErrorBoundary, RouteErrorBoundary } from './ErrorBoundary';
-import { findNotFoundPage, matchLayoutScope, matchRoute } from './matching';
-import { buildSearchString, parseSearchParams } from './search-params';
-
-function normalizePath(path: string): string {
-  if (path === '/') return path;
-  return path.replace(/\/+$/, '') || '/';
-}
-
-interface OlovaRouterProps {
-  routes: Route[];
-  layouts?: LayoutRoute[];
-  notFoundPages?: NotFoundPageConfig[];
-  notFound?: ReactNode;
-  loadingFallback?: ReactNode;
-  initialPath?: string;
-  onNavigate?: (from: string, to: string) => void;
-  onBeforeNavigate?: (from: string, to: string) => boolean | void;
-}
-
-export function OlovaRouter({
-  routes,
-  layouts = [],
-  notFoundPages = [],
-  notFound = <div>404 - Not Found</div>,
-  loadingFallback = <div>Loading...</div>,
-  initialPath,
-  onNavigate,
-  onBeforeNavigate,
-}: OlovaRouterProps) {
-  const isSSR = typeof window === 'undefined';
-  const [currentPath, setCurrentPath] = useState(() => normalizePath(initialPath || (isSSR ? '/' : window.location.pathname)));
-  const [searchParams, setSearchParamsState] = useState<SearchParams>(() =>
-    isSSR ? {} : parseSearchParams(window.location.search)
-  );
-  const [isPending, startTransition] = useTransition();
-  const prevPathRef = useRef(currentPath);
-
-  const [defaultTitle] = useState(() => isSSR ? '' : document.title);
-
-  useEffect(() => {
-    if (isSSR) return;
-    const onPopState = () => {
-      const newPath = normalizePath(window.location.pathname);
-      startTransition(() => {
-        setCurrentPath(newPath);
-        setSearchParamsState(parseSearchParams(window.location.search));
-      });
-    };
-    window.addEventListener('popstate', onPopState);
-    return () => window.removeEventListener('popstate', onPopState);
-  }, [isSSR]);
-
-  const performNavigation = useCallback((path: string, options: NavigateOptions = {}, historyMethod: 'push' | 'replace' = 'push') => {
-    if (isSSR) return;
-    const { scroll = true } = options;
-
-    const normalizedPath = normalizePath(path.split('?')[0].split('#')[0]);
-    const hash = path.includes('#') ? '#' + path.split('#')[1] : '';
-    const search = path.includes('?') ? '?' + path.split('?')[1].split('#')[0] : '';
-    const fullUrl = normalizedPath + search + hash;
-
-    if (onBeforeNavigate) {
-      const result = onBeforeNavigate(currentPath, normalizedPath);
-      if (result === false) return;
-    }
-
-    const prevPath = currentPath;
-
-    if (historyMethod === 'replace') {
-      window.history.replaceState({}, '', fullUrl);
-    } else {
-      window.history.pushState({}, '', fullUrl);
-    }
-
-    startTransition(() => {
-      setCurrentPath(normalizedPath);
-      setSearchParamsState(parseSearchParams(search));
-    });
-
-    if (scroll) {
-      if (hash) {
-        const el = document.getElementById(hash.slice(1));
-        if (el) {
-          el.scrollIntoView({ behavior: 'smooth' });
-        } else {
-          window.scrollTo(0, 0);
-        }
-      } else {
-        window.scrollTo(0, 0);
-      }
-    }
-
-    if (onNavigate) {
-      onNavigate(prevPath, normalizedPath);
-    }
-  }, [isSSR, currentPath, onBeforeNavigate, onNavigate]);
-
-  const navigate = useCallback((path: string, options?: NavigateOptions) => {
-    performNavigation(path, options, options?.replace ? 'replace' : 'push');
-  }, [performNavigation]);
-
-  const push = useCallback((path: string, options?: NavigateOptions) => {
-    performNavigation(path, options, 'push');
-  }, [performNavigation]);
-
-  const replace = useCallback((path: string, options?: NavigateOptions) => {
-    performNavigation(path, options, 'replace');
-  }, [performNavigation]);
-
-  const back = useCallback(() => {
-    if (!isSSR) window.history.back();
-  }, [isSSR]);
-
-  const forward = useCallback(() => {
-    if (!isSSR) window.history.forward();
-  }, [isSSR]);
-
-  const refresh = useCallback(() => {
-    if (!isSSR) {
-      startTransition(() => {
-        setCurrentPath(prev => prev);
-      });
-    }
-  }, [isSSR]);
-
-  const prefetch = useCallback((path: string) => {
-    // Trigger lazy component import by finding the matching route
-    const normalizedPath = normalizePath(path.split('?')[0]);
-    const pathParts = normalizedPath.split('/').filter(Boolean);
-    for (const route of routes) {
-      const segments = route.path.split('/').filter(Boolean);
-      const result = matchRoute(segments, pathParts);
-      if (result.match && route.component) {
-        // Accessing the component triggers React.lazy to load the chunk
-        break;
-      }
-    }
-  }, [routes]);
-
-  const setSearchParams = useCallback((
-    newParams: Record<string, string | string[] | null>,
-    options: SetSearchParamsOptions = {}
-  ) => {
-    if (isSSR) return;
-    const { replace: shouldReplace = false, merge = false } = options;
-
-    let finalParams: Record<string, string | string[] | null>;
-
-    if (merge) {
-      finalParams = { ...searchParams, ...newParams };
-      for (const key of Object.keys(finalParams)) {
-        if (finalParams[key] === null) {
-          delete finalParams[key];
-        }
-      }
-    } else {
-      finalParams = newParams;
-    }
-
-    const searchString = buildSearchString(finalParams as Record<string, string | string[] | null>);
-    const newUrl = currentPath + searchString;
-
-    if (shouldReplace) {
-      window.history.replaceState({}, '', newUrl);
-    } else {
-      window.history.pushState({}, '', newUrl);
-    }
-
-    setSearchParamsState(parseSearchParams(searchString));
-  }, [isSSR, searchParams, currentPath]);
-
-  const sortedRoutes = useMemo(() => {
-    return [...routes]
-      .sort((a, b) => {
-        const aHasCatchAll = a.path.includes('*');
-        const bHasCatchAll = b.path.includes('*');
-        const aHasDynamic = a.path.includes(':');
-        const bHasDynamic = b.path.includes(':');
-
-        if (aHasCatchAll && !bHasCatchAll) return 1;
-        if (!aHasCatchAll && bHasCatchAll) return -1;
-        if (aHasDynamic && !bHasDynamic) return 1;
-        if (!aHasDynamic && bHasDynamic) return -1;
-        return b.path.length - a.path.length;
-      })
-      .map(route => ({
-        ...route,
-        segments: route.path.split('/').filter(Boolean)
-      }));
-  }, [routes]);
-
-  const applyMetadata = useCallback((metadata: Metadata | undefined) => {
-    if (isSSR) return;
-    if (metadata?.title) {
-      document.title = metadata.title;
-    } else {
-      document.title = defaultTitle;
-    }
-
-    const setMetaTag = (name: string, content: string | undefined, attr = 'name') => {
-      let meta = document.querySelector(`meta[${attr}="${name}"]`);
-      if (content) {
-        if (!meta) {
-          meta = document.createElement('meta');
-          meta.setAttribute(attr, name);
-          document.head.appendChild(meta);
-        }
-        meta.setAttribute('content', content);
-      } else if (meta) {
-        document.head.removeChild(meta);
-      }
-    };
-
-    setMetaTag('description', metadata?.description);
-    setMetaTag('keywords', metadata?.keywords
-      ? (Array.isArray(metadata.keywords) ? metadata.keywords.join(', ') : metadata.keywords)
-      : undefined
-    );
-
-    // Open Graph tags
-    if (metadata?.openGraph) {
-      setMetaTag('og:title', metadata.openGraph.title || metadata.title, 'property');
-      setMetaTag('og:description', metadata.openGraph.description || metadata.description, 'property');
-      setMetaTag('og:image', metadata.openGraph.image, 'property');
-      setMetaTag('og:url', metadata.openGraph.url, 'property');
-      setMetaTag('og:type', metadata.openGraph.type || 'website', 'property');
-    }
-
-    // Canonical URL
-    let canonical = document.querySelector('link[rel="canonical"]') as HTMLLinkElement | null;
-    if (metadata?.openGraph?.url) {
-      if (!canonical) {
-        canonical = document.createElement('link');
-        canonical.setAttribute('rel', 'canonical');
-        document.head.appendChild(canonical);
-      }
-      canonical.setAttribute('href', metadata.openGraph.url);
-    }
-  }, [defaultTitle, isSSR]);
-
-  const { currentRoute, MatchedComponent, params } = useMemo(() => {
-    const pathParts = currentPath.split('/').filter(Boolean);
-
-    for (const route of sortedRoutes) {
-      if (route.path === '/' && currentPath === '/') {
-        return {
-          currentRoute: route,
-          MatchedComponent: route.component || null,
-          params: {} as Record<string, string>
-        };
-      }
-
-      const result = matchRoute(route.segments, pathParts);
-      if (result.match) {
-        return {
-          currentRoute: route,
-          MatchedComponent: route.component || null,
-          params: result.params
-        };
-      }
-    }
-    return {
-      currentRoute: null as Route | null,
-      MatchedComponent: null as ComponentType | null,
-      params: {} as Record<string, string>
-    };
-  }, [sortedRoutes, currentPath]);
-
-  // Track path changes for onNavigate callback
-  useEffect(() => {
-    prevPathRef.current = currentPath;
-  }, [currentPath]);
-
-  useEffect(() => {
-    if (isSSR) return;
-    applyMetadata(currentRoute?.metadata);
-  }, [currentRoute, applyMetadata, isSSR]);
-
-  const matchingLayouts = useMemo(() => {
-    return layouts
-      .filter(layout => matchLayoutScope(layout.path, currentPath))
-      .sort((a, b) => a.path.length - b.path.length);
-  }, [layouts, currentPath]);
-
-  const FinalComponent = useMemo(() => {
-    if (MatchedComponent) return MatchedComponent;
-    return findNotFoundPage(currentPath, notFoundPages);
-  }, [MatchedComponent, currentPath, notFoundPages]);
-
-  const content = useMemo(() => {
-    const LoadingComponent = currentRoute?.loading;
-    const ErrorComponent = currentRoute?.error;
-
-    let result: ReactNode = FinalComponent ? <FinalComponent /> : notFound;
-
-    // Only wrap with Suspense if route has explicit loading component
-    // (eager imports don't need Suspense fallback)
-    if (LoadingComponent) {
-      result = (
-        <Suspense fallback={<LoadingComponent />}>
-          {result}
-        </Suspense>
-      );
-    }
-
-    // Wrap with per-route error boundary (error.tsx)
-    if (ErrorComponent) {
-      result = (
-        <RouteErrorBoundary fallbackComponent={ErrorComponent} routePath={currentPath}>
-          {result}
-        </RouteErrorBoundary>
-      );
-    }
-
-    for (let i = matchingLayouts.length - 1; i >= 0; i--) {
-      const Layout = matchingLayouts[i].layout;
-      if (!Layout) continue;
-
-      const wrapped = result;
-      result = (
-        <OutletContext.Provider value={{ content: wrapped }}>
-          <Layout />
-        </OutletContext.Provider>
-      );
-    }
-
-    return result;
-  }, [FinalComponent, matchingLayouts, notFound, loadingFallback, currentRoute, currentPath]);
-
-  return (
-    <ErrorBoundary>
-      <RouterContext.Provider value={{
-        currentPath,
-        params,
-        searchParams,
-        navigate,
-        push,
-        replace,
-        back,
-        forward,
-        refresh,
-        setSearchParams,
-        isNavigating: isPending,
-        prefetch,
-      }}>
-        {content}
-      </RouterContext.Provider>
-    </ErrorBoundary>
-  );
-}

package/src/router/Outlet.tsx

@@ -1,8 +0,0 @@
-import { useContext } from 'react';
-import { OutletContext } from './context';
-
-export function Outlet() {
-  const context = useContext(OutletContext);
-  if (!context) return null;
-  return <>{context.content}</>;
-}

package/src/router/context.ts

@@ -1,117 +0,0 @@
-import { createContext, useContext, useMemo, useEffect, useRef, useCallback } from 'react';
-import type { RouterContextType, OutletContextType, NavigateOptions } from '../types';
-
-export const RouterContext = createContext<RouterContextType | null>(null);
-
-export const OutletContext = createContext<OutletContextType | null>(null);
-
-const ssrRouter: RouterContextType = {
-  currentPath: '/',
-  params: {},
-  searchParams: {},
-  navigate: () => {},
-  push: () => {},
-  replace: () => {},
-  back: () => {},
-  forward: () => {},
-  refresh: () => {},
-  setSearchParams: () => {},
-  isNavigating: false,
-  prefetch: () => {},
-};
-
-export function useRouter() {
-  const context = useContext(RouterContext);
-  if (!context) {
-    if (typeof window === 'undefined') return ssrRouter;
-    throw new Error('useRouter must be used within OlovaRouter');
-  }
-  return context;
-}
-
-export function useParams<T extends Record<string, string> = Record<string, string>>(): T {
-  const context = useContext(RouterContext);
-  return (context?.params || {}) as T;
-}
-
-export function useSearchParams(): URLSearchParams {
-  const context = useContext(RouterContext);
-  const searchParams = context?.searchParams || {};
-
-  return useMemo(() => {
-    const params = new URLSearchParams();
-    Object.entries(searchParams).forEach(([key, value]) => {
-      if (Array.isArray(value)) {
-        value.forEach(v => params.append(key, v));
-      } else {
-        params.set(key, value);
-      }
-    });
-    return params;
-  }, [searchParams]);
-}
-
-export function usePathname(): string {
-  const context = useContext(RouterContext);
-  if (!context) {
-    if (typeof window === 'undefined') return '/';
-    throw new Error('usePathname must be used within OlovaRouter');
-  }
-  return context.currentPath;
-}
-
-export function useSelectedLayoutSegment(): string | null {
-  const context = useContext(RouterContext);
-  if (!context) return null;
-  const segments = context.currentPath.split('/').filter(Boolean);
-  return segments[0] || null;
-}
-
-export function useSelectedLayoutSegments(): string[] {
-  const context = useContext(RouterContext);
-  if (!context) return [];
-  return context.currentPath.split('/').filter(Boolean);
-}
-
-export function useIsNavigating(): boolean {
-  const context = useContext(RouterContext);
-  return context?.isNavigating ?? false;
-}
-
-export function useNavigationEvent(callback: (from: string, to: string) => void) {
-  const context = useContext(RouterContext);
-  const currentPath = context?.currentPath;
-  const prevPath = useRef(currentPath || '/');
-
-  useEffect(() => {
-    if (!currentPath) return;
-    if (prevPath.current !== currentPath) {
-      callback(prevPath.current, currentPath);
-      prevPath.current = currentPath;
-    }
-  }, [currentPath, callback]);
-}
-
-export function redirect(path: string, options?: NavigateOptions): never {
-  if (typeof window !== 'undefined') {
-    if (options?.replace) {
-      window.history.replaceState({}, '', path);
-    } else {
-      window.history.pushState({}, '', path);
-    }
-    window.dispatchEvent(new PopStateEvent('popstate'));
-  }
-  throw new Error(`REDIRECT:${path}`);
-}
-
-export function useRedirect() {
-  const { navigate, replace } = useRouter();
-
-  return useCallback((path: string, options?: NavigateOptions) => {
-    if (options?.replace) {
-      replace(path, options);
-    } else {
-      navigate(path, options);
-    }
-  }, [navigate, replace]);
-}

package/src/router/index.ts

@@ -1,29 +0,0 @@
-export {
-  redirect,
-  useIsNavigating,
-  useNavigationEvent,
-  useParams,
-  usePathname,
-  useRedirect,
-  useRouter,
-  useSearchParams,
-  useSelectedLayoutSegment,
-  useSelectedLayoutSegments,
-} from './context';
-export { ErrorBoundary, RouteErrorBoundary } from './ErrorBoundary';
-export { createLink, type ResolveRoutePath } from './Link';
-export { OlovaRouter } from './OlovaRouter';
-export { Outlet } from './Outlet';
-
-export type {
-  LayoutRoute,
-  Metadata,
-  NavigateOptions,
-  NotFoundPageConfig,
-  OutletContextType,
-  Route,
-  RouterContextType,
-  SearchParams,
-  SetSearchParamsOptions,
-} from '../types';
-

package/src/router/matching.ts

@@ -1,63 +0,0 @@
-import type { ComponentType } from 'react';
-import type { NotFoundPageConfig } from '../types';
-
-export function matchRoute(patternParts: string[], pathParts: string[]) {
-  const params: Record<string, string> = {};
-
-  // Filter out empty parts (handles trailing slashes)
-  const filteredPathParts = pathParts.filter(Boolean);
-  const filteredPatternParts = patternParts.filter(Boolean);
-
-  for (let i = 0; i < filteredPatternParts.length; i++) {
-    const patternPart = filteredPatternParts[i];
-    const pathPart = filteredPathParts[i];
-
-    if (patternPart === '*') {
-      params['*'] = filteredPathParts.slice(i).join('/');
-      return { match: true, params };
-    }
-
-    if (pathPart === undefined) {
-      return { match: false, params: {} };
-    }
-
-    if (patternPart.startsWith(':')) {
-      params[patternPart.slice(1)] = decodeURIComponent(pathPart);
-    } else if (patternPart !== pathPart) {
-      return { match: false, params: {} };
-    }
-  }
-
-  if (filteredPathParts.length > filteredPatternParts.length) {
-    return { match: false, params: {} };
-  }
-
-  return { match: true, params };
-}
-
-export function matchLayoutScope(layoutPath: string, pathname: string): boolean {
-  if (layoutPath === '/') return true;
-  const normalizedPathname = pathname.replace(/\/+$/, '') || '/';
-  const normalizedLayout = layoutPath.replace(/\/+$/, '') || '/';
-  return normalizedPathname === normalizedLayout || normalizedPathname.startsWith(normalizedLayout + '/');
-}
-
-export function findNotFoundPage(path: string, notFoundPages: NotFoundPageConfig[]): ComponentType | null {
-  if (!notFoundPages || notFoundPages.length === 0) return null;
-
-  const normalizedPath = path.replace(/\/+$/, '') || '/';
-
-  const sorted = [...notFoundPages].sort((a, b) =>
-    b.pathPrefix.length - a.pathPrefix.length
-  );
-
-  for (const nf of sorted) {
-    if (nf.pathPrefix === '') {
-      return nf.component;
-    }
-    if (normalizedPath === nf.pathPrefix || normalizedPath.startsWith(nf.pathPrefix + '/')) {
-      return nf.component;
-    }
-  }
-  return null;
-}

package/src/router/router.tsx

@@ -1,23 +0,0 @@
-export {
-    OlovaRouter,
-    Outlet,
-    createLink,
-    redirect,
-    useIsNavigating,
-    useNavigationEvent,
-    useParams,
-    usePathname,
-    useRedirect,
-    useRouter,
-    useSearchParams,
-    useSelectedLayoutSegment,
-    useSelectedLayoutSegments,
-    type LayoutRoute,
-    type Metadata,
-    type NavigateOptions,
-    type NotFoundPageConfig,
-    type Route,
-    type SearchParams,
-    type SetSearchParamsOptions,
-} from './index';
-

package/src/router/search-params.ts

@@ -1,29 +0,0 @@
-import type { SearchParams } from '../types';
-
-export function parseSearchParams(search: string): SearchParams {
-  const params: SearchParams = {};
-  const urlParams = new URLSearchParams(search);
-
-  for (const key of urlParams.keys()) {
-    const values = urlParams.getAll(key);
-    params[key] = values.length === 1 ? values[0] : values;
-  }
-
-  return params;
-}
-
-export function buildSearchString(params: Record<string, string | string[] | null>): string {
-  const urlParams = new URLSearchParams();
-
-  for (const [key, value] of Object.entries(params)) {
-    if (value === null || value === undefined) continue;
-    if (Array.isArray(value)) {
-      value.forEach(v => urlParams.append(key, v));
-    } else {
-      urlParams.set(key, value);
-    }
-  }
-
-  const str = urlParams.toString();
-  return str ? `?${str}` : '';
-}