@lolyjs/core 0.1.0-alpha.5 → 0.1.0-alpha.8

package/dist/index.d.mts

@@ -1,7 +1,6 @@
 import http from 'http';
 import { Request, Response } from 'express';
 import { Socket, Server } from 'socket.io';
-export { c as bootstrapClient } from './bootstrap-BiCQmSkx.mjs';
 import { ZodSchema, z } from 'zod';
 import * as express_rate_limit from 'express-rate-limit';
 import pino, { Logger as Logger$1 } from 'pino';
@@ -216,6 +215,44 @@ interface BuildAppOptions {
 }
 declare function buildApp(options?: BuildAppOptions): Promise<void>;
 
+declare const WINDOW_DATA_KEY = "__FW_DATA__";
+
+type InitialData = {
+    pathname: string;
+    params: Record<string, string>;
+    props: Record<string, any>;
+    metadata?: {
+        title?: string;
+        description?: string;
+    } | null;
+    notFound?: boolean;
+    error?: boolean;
+    theme?: string;
+};
+declare global {
+    interface Window {
+        [WINDOW_DATA_KEY]?: InitialData;
+    }
+}
+type ClientLoadedComponents = {
+    Page: React.ComponentType<any>;
+    layouts: React.ComponentType<any>[];
+};
+type ClientRouteLoaded = {
+    pattern: string;
+    paramNames: string[];
+    load: () => Promise<ClientLoadedComponents>;
+};
+
+/**
+ * Bootstraps the client-side application.
+ *
+ * @param routes - Array of client routes
+ * @param notFoundRoute - Not-found route definition
+ * @param errorRoute - Error route definition
+ */
+declare function bootstrapClient(routes: ClientRouteLoaded[], notFoundRoute: ClientRouteLoaded | null, errorRoute?: ClientRouteLoaded | null): void;
+
 declare function withCache(fn: any, options: any): any;
 
 /**
@@ -442,4 +479,4 @@ declare function requestLoggerMiddleware(options?: {
  */
 declare function getRequestLogger(req: Request): Logger;
 
-export { type ApiContext, type ApiMiddleware, DEFAULT_CONFIG, type FrameworkConfig, type GenerateStaticParams, type InitServerData, type LoaderResult, type LogLevel, Logger, type LoggerContext, type LoggerOptions, type MetadataLoader, type RouteMiddleware, type ServerConfig, type ServerContext, type ServerLoader, ValidationError, type WssContext, buildApp, commonSchemas, createModuleLogger, createRateLimiter, defaultRateLimiter, generateRequestId, getAppDir, getBuildDir, getLogger, getRequestLogger, getStaticDir, lenientRateLimiter, loadConfig, logger, requestLoggerMiddleware, resetLogger, safeValidate, sanitizeObject, sanitizeParams, sanitizeQuery, sanitizeString, setLogger, startDevServer, startProdServer, strictRateLimiter, validate, withCache };
+export { type ApiContext, type ApiMiddleware, DEFAULT_CONFIG, type FrameworkConfig, type GenerateStaticParams, type InitServerData, type LoaderResult, type LogLevel, Logger, type LoggerContext, type LoggerOptions, type MetadataLoader, type RouteMiddleware, type ServerConfig, type ServerContext, type ServerLoader, ValidationError, type WssContext, bootstrapClient, buildApp, commonSchemas, createModuleLogger, createRateLimiter, defaultRateLimiter, generateRequestId, getAppDir, getBuildDir, getLogger, getRequestLogger, getStaticDir, lenientRateLimiter, loadConfig, logger, requestLoggerMiddleware, resetLogger, safeValidate, sanitizeObject, sanitizeParams, sanitizeQuery, sanitizeString, setLogger, startDevServer, startProdServer, strictRateLimiter, validate, withCache };

package/dist/index.d.ts

@@ -1,7 +1,6 @@
 import http from 'http';
 import { Request, Response } from 'express';
 import { Socket, Server } from 'socket.io';
-export { c as bootstrapClient } from './bootstrap-BiCQmSkx.js';
 import { ZodSchema, z } from 'zod';
 import * as express_rate_limit from 'express-rate-limit';
 import pino, { Logger as Logger$1 } from 'pino';
@@ -216,6 +215,44 @@ interface BuildAppOptions {
 }
 declare function buildApp(options?: BuildAppOptions): Promise<void>;
 
+declare const WINDOW_DATA_KEY = "__FW_DATA__";
+
+type InitialData = {
+    pathname: string;
+    params: Record<string, string>;
+    props: Record<string, any>;
+    metadata?: {
+        title?: string;
+        description?: string;
+    } | null;
+    notFound?: boolean;
+    error?: boolean;
+    theme?: string;
+};
+declare global {
+    interface Window {
+        [WINDOW_DATA_KEY]?: InitialData;
+    }
+}
+type ClientLoadedComponents = {
+    Page: React.ComponentType<any>;
+    layouts: React.ComponentType<any>[];
+};
+type ClientRouteLoaded = {
+    pattern: string;
+    paramNames: string[];
+    load: () => Promise<ClientLoadedComponents>;
+};
+
+/**
+ * Bootstraps the client-side application.
+ *
+ * @param routes - Array of client routes
+ * @param notFoundRoute - Not-found route definition
+ * @param errorRoute - Error route definition
+ */
+declare function bootstrapClient(routes: ClientRouteLoaded[], notFoundRoute: ClientRouteLoaded | null, errorRoute?: ClientRouteLoaded | null): void;
+
 declare function withCache(fn: any, options: any): any;
 
 /**
@@ -442,4 +479,4 @@ declare function requestLoggerMiddleware(options?: {
  */
 declare function getRequestLogger(req: Request): Logger;
 
-export { type ApiContext, type ApiMiddleware, DEFAULT_CONFIG, type FrameworkConfig, type GenerateStaticParams, type InitServerData, type LoaderResult, type LogLevel, Logger, type LoggerContext, type LoggerOptions, type MetadataLoader, type RouteMiddleware, type ServerConfig, type ServerContext, type ServerLoader, ValidationError, type WssContext, buildApp, commonSchemas, createModuleLogger, createRateLimiter, defaultRateLimiter, generateRequestId, getAppDir, getBuildDir, getLogger, getRequestLogger, getStaticDir, lenientRateLimiter, loadConfig, logger, requestLoggerMiddleware, resetLogger, safeValidate, sanitizeObject, sanitizeParams, sanitizeQuery, sanitizeString, setLogger, startDevServer, startProdServer, strictRateLimiter, validate, withCache };
+export { type ApiContext, type ApiMiddleware, DEFAULT_CONFIG, type FrameworkConfig, type GenerateStaticParams, type InitServerData, type LoaderResult, type LogLevel, Logger, type LoggerContext, type LoggerOptions, type MetadataLoader, type RouteMiddleware, type ServerConfig, type ServerContext, type ServerLoader, ValidationError, type WssContext, bootstrapClient, buildApp, commonSchemas, createModuleLogger, createRateLimiter, defaultRateLimiter, generateRequestId, getAppDir, getBuildDir, getLogger, getRequestLogger, getStaticDir, lenientRateLimiter, loadConfig, logger, requestLoggerMiddleware, resetLogger, safeValidate, sanitizeObject, sanitizeParams, sanitizeQuery, sanitizeString, setLogger, startDevServer, startProdServer, strictRateLimiter, validate, withCache };

package/dist/index.js

@@ -1353,9 +1353,6 @@ function createClientConfig(projectRoot, mode) {
         filename: mode === "production" ? "client.[contenthash].css" : "client.css"
       })
     ],
-    externals: {
-      "@lolyjs/core/runtime": "@lolyjs/core/runtime"
-    },
     infrastructureLogging: {
       level: "error"
     },
@@ -5102,6 +5099,11 @@ import { useEffect, useState, useRef } from "react";
 // modules/runtime/client/RouterView.tsx
 import { jsx } from "react/jsx-runtime";
 function RouterView({ state }) {
+  console.log("[loly:RouterView] Rendering", {
+    url: state.url,
+    hasRoute: !!state.route,
+    hasComponents: !!state.components
+  });
   if (!state.route) {
     if (state.components === null) {
       return null;
@@ -5113,6 +5115,11 @@ function RouterView({ state }) {
   }
   const { Page, layouts } = state.components;
   const { params, props } = state;
+  console.log("[loly:RouterView] Creating page element", {
+    hasPage: !!Page,
+    layoutsCount: layouts.length,
+    paramsKeys: Object.keys(params)
+  });
   let element = /* @__PURE__ */ jsx(Page, { params, ...props });
   const layoutChain = layouts.slice().reverse();
   for (const Layout of layoutChain) {
@@ -5460,24 +5467,50 @@ async function navigate(nextUrl, handlers, options) {
 }
 function createClickHandler(navigate2) {
   return function handleClick(ev) {
+    const target = ev.target;
+    const tagName = target?.tagName.toLowerCase() || "unknown";
+    console.log("[loly:click] Click event received", {
+      type: ev.type,
+      tagName,
+      target: target?.tagName,
+      defaultPrevented: ev.defaultPrevented,
+      button: ev.button,
+      clientX: ev.clientX,
+      clientY: ev.clientY
+    });
     try {
-      if (ev.defaultPrevented) return;
-      if (ev.type !== "click") return;
-      if (ev.button !== 0) return;
-      if (ev.metaKey || ev.ctrlKey || ev.shiftKey || ev.altKey) return;
+      if (ev.defaultPrevented) {
+        console.log("[loly:click] Event already prevented, skipping");
+        return;
+      }
+      if (ev.type !== "click") {
+        console.log("[loly:click] Not a click event, skipping", { type: ev.type });
+        return;
+      }
+      if (ev.button !== 0) {
+        console.log("[loly:click] Not left button, skipping", { button: ev.button });
+        return;
+      }
+      if (ev.metaKey || ev.ctrlKey || ev.shiftKey || ev.altKey) {
+        console.log("[loly:click] Modifier keys pressed, skipping");
+        return;
+      }
       if (ev.clientX === 0 && ev.clientY === 0 && ev.detail === 0) {
-        const target2 = ev.target;
-        if (target2) {
-          const tagName2 = target2.tagName.toLowerCase();
-          if (tagName2 === "input" || tagName2 === "textarea" || tagName2 === "button" || tagName2 === "select") {
+        if (target) {
+          const tagName3 = target.tagName.toLowerCase();
+          if (tagName3 === "input" || tagName3 === "textarea" || tagName3 === "button" || tagName3 === "select") {
+            console.log("[loly:click] Synthetic event on interactive element, skipping", { tagName: tagName3 });
             return;
           }
         }
       }
-      const target = ev.target;
-      if (!target) return;
-      const tagName = target.tagName.toLowerCase();
-      if (tagName === "input" || tagName === "textarea" || tagName === "button" || tagName === "select" || target.isContentEditable || target.getAttribute("contenteditable") === "true") {
+      if (!target) {
+        console.log("[loly:click] No target, skipping");
+        return;
+      }
+      const tagName2 = target.tagName.toLowerCase();
+      if (tagName2 === "input" || tagName2 === "textarea" || tagName2 === "button" || tagName2 === "select" || target.isContentEditable || target.getAttribute("contenteditable") === "true") {
+        console.log("[loly:click] Target is interactive element, skipping", { tagName: tagName2 });
         return;
       }
       const interactiveParent = target.closest("input, textarea, button, select, [contenteditable], label");
@@ -5485,29 +5518,60 @@ function createClickHandler(navigate2) {
         if (interactiveParent.tagName.toLowerCase() === "label") {
           const label = interactiveParent;
           if (label.control) {
+            console.log("[loly:click] Inside label with control, skipping");
             return;
           }
         } else {
+          console.log("[loly:click] Inside interactive parent, skipping", {
+            parentTag: interactiveParent.tagName.toLowerCase()
+          });
           return;
         }
       }
       const anchor = target.closest("a[href]");
-      if (!anchor) return;
+      if (!anchor) {
+        console.log("[loly:click] No anchor found, skipping");
+        return;
+      }
+      console.log("[loly:click] Anchor found, processing navigation", {
+        href: anchor.getAttribute("href")
+      });
       const href = anchor.getAttribute("href");
-      if (!href) return;
-      if (href.startsWith("#")) return;
+      if (!href) {
+        console.log("[loly:click] No href attribute, skipping");
+        return;
+      }
+      if (href.startsWith("#")) {
+        console.log("[loly:click] Hash link, skipping");
+        return;
+      }
       const url = new URL(href, window.location.href);
-      if (url.origin !== window.location.origin) return;
-      if (anchor.target && anchor.target !== "_self") return;
+      if (url.origin !== window.location.origin) {
+        console.log("[loly:click] External link, skipping", { origin: url.origin });
+        return;
+      }
+      if (anchor.target && anchor.target !== "_self") {
+        console.log("[loly:click] Link has target, skipping", { target: anchor.target });
+        return;
+      }
       ev.preventDefault();
+      console.log("[loly:click] Prevented default, navigating");
       const nextUrl = url.pathname + url.search;
       const currentUrl = window.location.pathname + window.location.search;
-      if (nextUrl === currentUrl) return;
+      if (nextUrl === currentUrl) {
+        console.log("[loly:click] Same URL, skipping", { nextUrl });
+        return;
+      }
       const shouldRevalidate = anchor.hasAttribute("data-revalidate") && anchor.getAttribute("data-revalidate") !== "false";
+      console.log("[loly:click] Pushing state and navigating", {
+        nextUrl,
+        currentUrl,
+        shouldRevalidate
+      });
       window.history.pushState({}, "", nextUrl);
       navigate2(nextUrl, shouldRevalidate ? { revalidate: true } : void 0);
     } catch (error) {
-      console.error("[navigation] Error in click handler:", error);
+      console.error("[loly:click] Error in click handler:", error);
     }
   };
 }
@@ -5526,6 +5590,10 @@ function AppShell({
   notFoundRoute,
   errorRoute
 }) {
+  console.log("[loly:AppShell] Component rendering", {
+    url: initialState.url,
+    hasRoute: !!initialState.route
+  });
   const [state, setState] = useState(initialState);
   const handlersRef = useRef({
     setState,
@@ -5534,6 +5602,11 @@ function AppShell({
     errorRoute
   });
   useEffect(() => {
+    console.log("[loly:AppShell] Updating handlersRef", {
+      routesCount: routes.length,
+      hasNotFound: !!notFoundRoute,
+      hasError: !!errorRoute
+    });
     handlersRef.current = {
       setState,
       routes,
@@ -5542,16 +5615,34 @@ function AppShell({
     };
   }, [routes, notFoundRoute, errorRoute]);
   useEffect(() => {
+    const effectId = Math.random().toString(36).substring(7);
+    console.log("[loly:AppShell] Setting up event listeners", { effectId });
     let isMounted = true;
+    let listenerCount = 0;
     async function handleNavigate(nextUrl, options) {
-      if (!isMounted) return;
+      if (!isMounted) {
+        console.warn("[loly:AppShell] navigate called but component is unmounted");
+        return;
+      }
+      console.log("[loly:AppShell] Navigating to", nextUrl, options);
       await navigate(nextUrl, handlersRef.current, options);
     }
     const handleClick = createClickHandler(handleNavigate);
     const handlePopState = createPopStateHandler(handleNavigate);
     window.addEventListener("click", handleClick, false);
     window.addEventListener("popstate", handlePopState, false);
+    listenerCount = 2;
+    console.log("[loly:AppShell] Event listeners added", {
+      clickListener: true,
+      popStateListener: true,
+      totalListeners: listenerCount
+    });
     return () => {
+      console.log("[loly:AppShell] Cleaning up event listeners", {
+        effectId,
+        wasMounted: isMounted,
+        listenersToRemove: listenerCount
+      });
       isMounted = false;
       window.removeEventListener("click", handleClick, false);
       window.removeEventListener("popstate", handlePopState, false);
@@ -5606,14 +5697,25 @@ async function loadInitialRoute(initialUrl, initialData, routes, notFoundRoute,
   };
 }
 function bootstrapClient(routes, notFoundRoute, errorRoute = null) {
+  console.log("[loly:runtime] bootstrapClient called", {
+    routesCount: routes.length,
+    hasNotFound: !!notFoundRoute,
+    hasError: !!errorRoute
+  });
   (async function bootstrap() {
     const container = document.getElementById(APP_CONTAINER_ID2);
     const initialData = getWindowData();
+    console.log("[loly:runtime] bootstrap starting", {
+      hasContainer: !!container,
+      containerId: APP_CONTAINER_ID2,
+      hasInitialData: !!initialData
+    });
     if (!container) {
-      console.error(`Container #${APP_CONTAINER_ID2} not found for hydration`);
+      console.error(`[loly:runtime] Container #${APP_CONTAINER_ID2} not found for hydration`);
       return;
     }
     const initialUrl = window.location.pathname + window.location.search;
+    console.log("[loly:runtime] Loading initial route", { initialUrl });
     try {
       const initialState = await loadInitialRoute(
         initialUrl,
@@ -5622,9 +5724,15 @@ function bootstrapClient(routes, notFoundRoute, errorRoute = null) {
         notFoundRoute,
         errorRoute
       );
+      console.log("[loly:runtime] Initial route loaded", {
+        url: initialState.url,
+        hasRoute: !!initialState.route,
+        hasComponents: !!initialState.components
+      });
       if (initialData?.metadata) {
         applyMetadata(initialData.metadata);
       }
+      console.log("[loly:runtime] Hydrating React app");
       hydrateRoot(
         container,
         /* @__PURE__ */ jsx3(
@@ -5637,9 +5745,10 @@ function bootstrapClient(routes, notFoundRoute, errorRoute = null) {
           }
         )
       );
+      console.log("[loly:runtime] React app hydrated successfully");
     } catch (error) {
       console.error(
-        "[client] Error loading initial route components for",
+        "[loly:runtime] Error loading initial route components for",
         initialUrl,
         error
       );