lovable-ssr 0.1.2

package/README.md

@@ -0,0 +1,136 @@
+# lovable-ssr
+
+SSR and route data engine for [Lovable](https://lovable.dev) projects. Provides a route registry (singleton), `getServerData`-based data loading for SSR and SPA navigation, and an Express + Vite server.
+
+**Documentation:** [Documentação completa](https://calm-meadow-5cf6.github-8c8.workers.dev/)
+
+## Installation
+
+```bash
+npm i lovable-ssr
+```
+
+Peer dependencies: `react`, `react-dom`, `react-router-dom` (^18 / ^6).
+
+## Quick start
+
+### 1. Register routes
+
+Define your routes and call `registerRoutes` so the framework can match paths and run `getServerData`:
+
+```ts
+// src/routes.ts (or wherever you define routes)
+import { registerRoutes, type RouteConfig, type ComponentWithGetServerData } from 'lovable-ssr';
+import HomePage from '@/pages/HomePage';
+import VideoPage from '@/pages/VideoPage';
+
+export const routes: RouteConfig[] = [
+  { path: '/', Component: HomePage, isSSR: true },
+  { path: '/video/:id', Component: VideoPage, isSSR: true },
+  { path: '*', Component: NotFound, isSSR: false },
+];
+
+registerRoutes(routes);
+```
+
+### 2. App shell
+
+Ensure routes are loaded (so the registry is filled), then use `BrowserRouteDataProvider` and `AppRoutes`. The framework reads `window.__PRELOADED_DATA__` and the current pathname and fills the route data context for you (no need to declare `Window` or compute initial route/params in the app):
+
+```tsx
+// src/App.tsx
+import './routes'; // runs registerRoutes(routes)
+import { BrowserRouteDataProvider, AppRoutes } from 'lovable-ssr';
+import { BrowserRouter } from 'react-router-dom';
+
+export default function App() {
+  return (
+    <BrowserRouter>
+      <BrowserRouteDataProvider>
+        <AppRoutes />
+      </BrowserRouteDataProvider>
+    </BrowserRouter>
+  );
+}
+```
+
+The package augments `Window` with `__PRELOADED_DATA__?: Record<string, unknown>` so you don't need to declare it. If you prefer to wire `RouteDataProvider` yourself (e.g. for testing), use `RouterService`, `RouteDataProvider`, and the same initial data logic.
+
+### 3. SSR entry (optional)
+
+For SSR, add an entry module that registers routes and calls the framework’s `render` with your app wrappers (e.g. QueryClient, Toaster):
+
+```tsx
+// src/entry-server.tsx
+import { registerRoutes, render as frameworkRender } from 'lovable-ssr';
+import { routes } from '@/routes';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+
+registerRoutes(routes);
+
+export async function render(url: string) {
+  return frameworkRender(url, {
+    wrap: (children) => (
+      <QueryClientProvider client={new QueryClient()}>
+        {children}
+      </QueryClientProvider>
+    ),
+  });
+}
+```
+
+### 4. SSR server (optional)
+
+Run the Express + Vite server using the framework’s `createServer` (import from the `server` subpath so Node-only code is not bundled in the client):
+
+```ts
+// src/ssr/server.ts
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { createServer } from 'lovable-ssr/server';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const root = path.resolve(__dirname, '../..');
+
+createServer({
+  root,
+  entryPath: 'src/entry-server.tsx',
+  port: process.env.PORT ? Number(process.env.PORT) : 5173,
+})
+  .then((s) => s.listen())
+  .catch(console.error);
+```
+
+Scripts:
+
+- **Dev SPA:** `vite`
+- **Dev SSR:** `tsx src/ssr/server.ts`
+- **Build SSR:** `vite build && vite build --ssr src/entry-server.tsx --outDir dist`
+- **Preview SSR:** `npm run build:ssr && NODE_ENV=production tsx src/ssr/server.ts`
+
+## API
+
+- **Types:** `RouteConfig`, `ComponentWithGetServerData`
+- **Registry:** `registerRoutes(routes)`, `getRoutes()`
+- **Router:** `RouterService.matchRoute(pathname)`, `RouterService.routeParams(path, pathname)`, `RouterService.isSsrRoute(pathname)`
+- **Data:** `RouteDataProvider`, `useRouteData()`, `buildRouteKey(path, params)`, `RouteDataState`, `InitialRouteShape`
+- **UI:** `AppRoutes` (no props), `BrowserRouteDataProvider` (wraps children with `RouteDataProvider` using `window.__PRELOADED_DATA__` and current pathname; use inside `BrowserRouter`)
+- **SSR:** `render(url, options?)` with `options.wrap = (children) => ReactNode`
+- **Server:** `createServer(config)` and `runServer(config?)` from `lovable-ssr/server`
+
+## Pages with `getServerData`
+
+Attach a `getServerData` function to the route component; it runs on the server for SSR and on the client when navigating to that route if data is not already cached (keyed by path + params).
+
+```ts
+async function getServerData(params?: Record<string, string>) {
+  const id = params?.id;
+  const data = await fetch(`/api/videos/${id}`).then((r) => r.json());
+  return { video: data };
+}
+VideoPage.getServerData = getServerData;
+```
+
+## License
+
+MIT

package/dist/components/AppRoutes.d.ts

@@ -0,0 +1,2 @@
+export declare function AppRoutes(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AppRoutes.d.ts.map

package/dist/components/AppRoutes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppRoutes.d.ts","sourceRoot":"","sources":["../../src/components/AppRoutes.tsx"],"names":[],"mappings":"AAMA,wBAAgB,SAAS,4CA6CxB"}

package/dist/components/AppRoutes.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect } from 'react';
+import { Route, Routes, useLocation } from 'react-router-dom';
+import { getRoutes } from '../registry.js';
+import { buildRouteKey, useRouteData } from '../router/RouteDataContext.js';
+import RouterService from '../router/RouterService.js';
+export function AppRoutes() {
+    const location = useLocation();
+    const pathname = location.pathname || '/';
+    const routes = getRoutes();
+    const matchedRoute = RouterService.matchRoute(pathname);
+    const params = matchedRoute ? RouterService.routeParams(matchedRoute.path, pathname) : {};
+    const routeKey = matchedRoute ? buildRouteKey(matchedRoute.path, params) : '';
+    const { data, setData } = useRouteData();
+    const currentData = routeKey ? data[routeKey] : undefined;
+    const getServerData = matchedRoute?.Component?.getServerData;
+    useEffect(() => {
+        if (!routeKey || !getServerData || currentData !== undefined)
+            return;
+        getServerData(params)
+            .then((d) => setData(routeKey, d))
+            .catch((e) => {
+            console.error('Client getServerData failed:', e);
+            setData(routeKey, {});
+        });
+    }, [routeKey, getServerData, params, currentData, setData]);
+    return (_jsx(Routes, { children: routes.map((route) => {
+            const isMatched = matchedRoute === route;
+            const getServerDataForRoute = route.Component.getServerData;
+            let element;
+            if (isMatched) {
+                if (typeof getServerDataForRoute === 'function') {
+                    element =
+                        currentData !== undefined ? (_jsx(route.Component, { ...currentData })) : null;
+                }
+                else {
+                    element = _jsx(route.Component, {});
+                }
+            }
+            else {
+                element = _jsx(route.Component, {});
+            }
+            return _jsx(Route, { path: route.path, element: element }, route.path);
+        }) }));
+}

package/dist/components/BrowserRouteDataProvider.d.ts

@@ -0,0 +1,13 @@
+import type { ReactNode } from 'react';
+/**
+ * Wraps children with RouteDataProvider using initial data from the browser:
+ * - window.__PRELOADED_DATA__ (from SSR)
+ * - window.location.pathname + RouterService for matchedRoute and routeParams
+ *
+ * Use this inside BrowserRouter so the app does not need to read __PRELOADED_DATA__
+ * or compute initial route/params manually.
+ */
+export declare function BrowserRouteDataProvider({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=BrowserRouteDataProvider.d.ts.map

package/dist/components/BrowserRouteDataProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrowserRouteDataProvider.d.ts","sourceRoot":"","sources":["../../src/components/BrowserRouteDataProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC;;;;;;;GAOG;AACH,wBAAgB,wBAAwB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAmB7E"}

package/dist/components/BrowserRouteDataProvider.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import RouterService from '../router/RouterService.js';
+import { RouteDataProvider } from '../router/RouteDataContext.js';
+/**
+ * Wraps children with RouteDataProvider using initial data from the browser:
+ * - window.__PRELOADED_DATA__ (from SSR)
+ * - window.location.pathname + RouterService for matchedRoute and routeParams
+ *
+ * Use this inside BrowserRouter so the app does not need to read __PRELOADED_DATA__
+ * or compute initial route/params manually.
+ */
+export function BrowserRouteDataProvider({ children }) {
+    const preloadedData = typeof window !== 'undefined' ? (window.__PRELOADED_DATA__ ?? {}) : {};
+    const pathname = typeof window !== 'undefined' ? window.location.pathname || '/' : '/';
+    const matchedRoute = RouterService.matchRoute(pathname);
+    const routeParams = matchedRoute
+        ? RouterService.routeParams(matchedRoute.path, pathname)
+        : {};
+    return (_jsx(RouteDataProvider, { initialData: preloadedData, initialRoute: matchedRoute, initialParams: routeParams, children: children }));
+}

package/dist/globals.d.ts

@@ -0,0 +1,7 @@
+declare global {
+    interface Window {
+        __PRELOADED_DATA__?: Record<string, unknown>;
+    }
+}
+export {};
+//# sourceMappingURL=globals.d.ts.map

package/dist/globals.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"globals.d.ts","sourceRoot":"","sources":["../src/globals.ts"],"names":[],"mappings":"AAAA,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;KAC9C;CACF;AAED,OAAO,EAAE,CAAC"}

package/dist/globals.js

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

package/dist/index.d.ts

@@ -0,0 +1,9 @@
+import './globals.js';
+export type { RouteConfig, ComponentWithGetServerData } from './types.js';
+export { registerRoutes, getRoutes } from './registry.js';
+export { BrowserRouteDataProvider } from './components/BrowserRouteDataProvider.js';
+export { default as RouterService } from './router/RouterService.js';
+export { RouteDataProvider, useRouteData, buildRouteKey, type RouteDataState, type InitialRouteShape, } from './router/RouteDataContext.js';
+export { AppRoutes } from './components/AppRoutes.js';
+export { render, type RenderResult, type RenderOptions, } from './ssr/render.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAC;AACtB,YAAY,EAAE,WAAW,EAAE,0BAA0B,EAAE,MAAM,YAAY,CAAC;AAC1E,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1D,OAAO,EAAE,wBAAwB,EAAE,MAAM,0CAA0C,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EACL,iBAAiB,EACjB,YAAY,EACZ,aAAa,EACb,KAAK,cAAc,EACnB,KAAK,iBAAiB,GACvB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,EACL,MAAM,EACN,KAAK,YAAY,EACjB,KAAK,aAAa,GACnB,MAAM,iBAAiB,CAAC"}

package/dist/index.js

@@ -0,0 +1,7 @@
+import './globals.js';
+export { registerRoutes, getRoutes } from './registry.js';
+export { BrowserRouteDataProvider } from './components/BrowserRouteDataProvider.js';
+export { default as RouterService } from './router/RouterService.js';
+export { RouteDataProvider, useRouteData, buildRouteKey, } from './router/RouteDataContext.js';
+export { AppRoutes } from './components/AppRoutes.js';
+export { render, } from './ssr/render.js';

package/dist/registry.d.ts

@@ -0,0 +1,4 @@
+import type { RouteConfig } from './types.js';
+export declare function registerRoutes(r: RouteConfig[]): void;
+export declare function getRoutes(): RouteConfig[];
+//# sourceMappingURL=registry.d.ts.map

package/dist/registry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../src/registry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAI9C,wBAAgB,cAAc,CAAC,CAAC,EAAE,WAAW,EAAE,GAAG,IAAI,CAErD;AAED,wBAAgB,SAAS,IAAI,WAAW,EAAE,CAEzC"}

package/dist/registry.js

@@ -0,0 +1,7 @@
+let routes = [];
+export function registerRoutes(r) {
+    routes = r;
+}
+export function getRoutes() {
+    return routes;
+}

package/dist/router/RouteDataContext.d.ts

@@ -0,0 +1,20 @@
+import { type ReactNode } from 'react';
+export type RouteDataState = Record<string, Record<string, unknown>>;
+export declare function buildRouteKey(path: string, params: Record<string, string>): string;
+interface RouteDataContextValue {
+    data: RouteDataState;
+    setData: (routeKey: string, value: Record<string, unknown>) => void;
+}
+export interface InitialRouteShape {
+    path: string;
+}
+interface RouteDataProviderProps {
+    children: ReactNode;
+    initialData?: Record<string, unknown>;
+    initialRoute?: InitialRouteShape;
+    initialParams?: Record<string, string>;
+}
+export declare function RouteDataProvider({ children, initialData, initialRoute, initialParams, }: RouteDataProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useRouteData(): RouteDataContextValue;
+export {};
+//# sourceMappingURL=RouteDataContext.d.ts.map

package/dist/router/RouteDataContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RouteDataContext.d.ts","sourceRoot":"","sources":["../../src/router/RouteDataContext.tsx"],"names":[],"mappings":"AAAA,OAAc,EAMZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,cAAc,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;AAErE,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,MAAM,CAKlF;AAED,UAAU,qBAAqB;IAC7B,IAAI,EAAE,cAAc,CAAC;IACrB,OAAO,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;CACrE;AAID,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC;CACd;AAED,UAAU,sBAAsB;IAC9B,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACtC,YAAY,CAAC,EAAE,iBAAiB,CAAC;IACjC,aAAa,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACxC;AAED,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,EACR,WAAW,EACX,YAAY,EACZ,aAAkB,GACnB,EAAE,sBAAsB,2CAmBxB;AAED,wBAAgB,YAAY,IAAI,qBAAqB,CAMpD"}

package/dist/router/RouteDataContext.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useCallback, useContext, useMemo, useState, } from 'react';
+export function buildRouteKey(path, params) {
+    const sorted = Object.keys(params)
+        .sort()
+        .reduce((acc, k) => ({ ...acc, [k]: params[k] }), {});
+    return `${path}|${JSON.stringify(sorted)}`;
+}
+const RouteDataContext = createContext(null);
+export function RouteDataProvider({ children, initialData, initialRoute, initialParams = {}, }) {
+    const initialKey = initialRoute && Object.keys(initialData ?? {}).length > 0
+        ? buildRouteKey(initialRoute.path, initialParams)
+        : null;
+    const [data, setDataState] = useState(() => initialKey && initialData ? { [initialKey]: initialData } : {});
+    const setData = useCallback((routeKey, value) => {
+        setDataState((prev) => ({ ...prev, [routeKey]: value }));
+    }, []);
+    const value = useMemo(() => ({ data, setData }), [data, setData]);
+    return (_jsx(RouteDataContext.Provider, { value: value, children: children }));
+}
+export function useRouteData() {
+    const ctx = useContext(RouteDataContext);
+    if (!ctx) {
+        throw new Error('useRouteData must be used within RouteDataProvider');
+    }
+    return ctx;
+}

package/dist/router/RouterService.d.ts

@@ -0,0 +1,13 @@
+import type { RouteConfig } from '../types.js';
+declare function matchPath(pathPattern: string, pathname: string): boolean;
+declare function isSsrRoute(pathname: string): boolean;
+declare function matchRoute(pathname: string): RouteConfig | undefined;
+declare function routeParams(routePath: string, pathname?: string): Record<string, string>;
+declare const RouterService: {
+    isSsrRoute: typeof isSsrRoute;
+    matchPath: typeof matchPath;
+    matchRoute: typeof matchRoute;
+    routeParams: typeof routeParams;
+};
+export default RouterService;
+//# sourceMappingURL=RouterService.d.ts.map

package/dist/router/RouterService.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RouterService.d.ts","sourceRoot":"","sources":["../../src/router/RouterService.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C,iBAAS,SAAS,CAAC,WAAW,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,OAAO,CAOjE;AAED,iBAAS,UAAU,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAG7C;AAED,iBAAS,UAAU,CAAC,QAAQ,EAAE,MAAM,GAAG,WAAW,GAAG,SAAS,CAM7D;AAED,iBAAS,WAAW,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAUjF;AAED,QAAA,MAAM,aAAa;;;;;CAKlB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/router/RouterService.js

@@ -0,0 +1,42 @@
+import { getRoutes } from '../registry.js';
+function matchPath(pathPattern, pathname) {
+    if (pathPattern === '*')
+        return true;
+    if (pathPattern === pathname)
+        return true;
+    const segments = pathname.split('/').filter(Boolean);
+    const patternSegments = pathPattern.split('/').filter(Boolean);
+    if (segments.length !== patternSegments.length)
+        return false;
+    return patternSegments.every((p, i) => p.startsWith(':') || p === segments[i]);
+}
+function isSsrRoute(pathname) {
+    const routes = getRoutes();
+    return routes.filter((r) => r.isSSR).some((route) => matchPath(route.path, pathname));
+}
+function matchRoute(pathname) {
+    const routes = getRoutes();
+    for (const route of routes) {
+        if (matchPath(route.path, pathname))
+            return route;
+    }
+    return routes.find((r) => r.path === '*');
+}
+function routeParams(routePath, pathname) {
+    const pathSegments = pathname?.split('/').filter(Boolean) || [];
+    const patternSegments = routePath.split('/').filter(Boolean);
+    const params = {};
+    patternSegments.forEach((segment, i) => {
+        if (segment.startsWith(':')) {
+            params[segment.slice(1)] = pathSegments[i];
+        }
+    });
+    return params;
+}
+const RouterService = {
+    isSsrRoute,
+    matchPath,
+    matchRoute,
+    routeParams,
+};
+export default RouterService;

package/dist/router/index.d.ts

@@ -0,0 +1,3 @@
+export { default as RouterService } from './RouterService.js';
+export { RouteDataProvider, useRouteData, buildRouteKey, type RouteDataState, type InitialRouteShape, } from './RouteDataContext.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/router/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/router/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EACL,iBAAiB,EACjB,YAAY,EACZ,aAAa,EACb,KAAK,cAAc,EACnB,KAAK,iBAAiB,GACvB,MAAM,uBAAuB,CAAC"}

package/dist/router/index.js

@@ -0,0 +1,2 @@
+export { default as RouterService } from './RouterService.js';
+export { RouteDataProvider, useRouteData, buildRouteKey, } from './RouteDataContext.js';

package/dist/ssr/render.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode } from 'react';
+export interface RenderResult {
+    html: string;
+    preloadedData: Record<string, unknown>;
+}
+export interface RenderOptions {
+    wrap?: (children: ReactNode) => ReactNode;
+}
+export declare function render(url: string, options?: RenderOptions): Promise<RenderResult>;
+//# sourceMappingURL=render.d.ts.map

package/dist/ssr/render.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../src/ssr/render.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACxC;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,CAAC,EAAE,CAAC,QAAQ,EAAE,SAAS,KAAK,SAAS,CAAC;CAC3C;AAED,wBAAsB,MAAM,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,aAAa,GAAG,OAAO,CAAC,YAAY,CAAC,CAgCxF"}

package/dist/ssr/render.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { renderToString } from 'react-dom/server';
+import { StaticRouter } from 'react-router-dom/server';
+import RouterService from '../router/RouterService.js';
+import { RouteDataProvider } from '../router/RouteDataContext.js';
+import { AppRoutes } from '../components/AppRoutes.js';
+export async function render(url, options) {
+    const fullUrl = new URL(url, 'http://localhost');
+    const pathname = fullUrl.pathname || '/';
+    const matchedRoute = RouterService.matchRoute(pathname);
+    const params = matchedRoute ? RouterService.routeParams(matchedRoute.path, pathname) : {};
+    let preloadedData = { is_success: true };
+    const getServerData = matchedRoute?.Component?.getServerData;
+    if (typeof getServerData === 'function') {
+        try {
+            preloadedData = await getServerData(params);
+        }
+        catch (e) {
+            console.error(`SSR getServerData failed for ${matchedRoute?.path}:`, e);
+            preloadedData = { ...preloadedData, is_success: false };
+        }
+    }
+    const inner = (_jsx(StaticRouter, { location: url, children: _jsx(RouteDataProvider, { initialData: preloadedData, initialRoute: matchedRoute, initialParams: params, children: _jsx(AppRoutes, {}) }) }));
+    const app = options?.wrap ? options.wrap(inner) : inner;
+    const html = renderToString(app);
+    return { html, preloadedData };
+}

package/dist/ssr/server.d.ts

@@ -0,0 +1,21 @@
+import { type Express } from 'express';
+export interface RenderResult {
+    html: string;
+    preloadedData: Record<string, unknown>;
+}
+export interface CreateServerConfig {
+    root: string;
+    /** Path to the app entry-server module relative to root (e.g. 'src/entry-server.tsx') */
+    entryPath: string;
+    port?: number;
+    /** Optional link tag to inject in dev for CSS (e.g. '<link rel="stylesheet" href="/src/index.css">') */
+    cssLinkInDev?: string;
+}
+export declare function createServer(config: CreateServerConfig): Promise<{
+    getApp: () => Express;
+    listen: (port?: number, callback?: () => void) => void;
+}>;
+/** Standalone: run server when this file is executed (e.g. tsx packages/lovable-ssr/src/ssr/server.ts).
+ * Set env ROOT, ENTRY_PATH, PORT or use defaults. */
+export declare function runServer(config?: Partial<CreateServerConfig>): void;
+//# sourceMappingURL=server.d.ts.map

package/dist/ssr/server.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../src/ssr/server.ts"],"names":[],"mappings":"AAGA,OAAgB,EAAE,KAAK,OAAO,EAAkD,MAAM,SAAS,CAAC;AAIhG,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACxC;AAED,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,yFAAyF;IACzF,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,wGAAwG;IACxG,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAgKD,wBAAsB,YAAY,CAAC,MAAM,EAAE,kBAAkB,GAAG,OAAO,CAAC;IACtE,MAAM,EAAE,MAAM,OAAO,CAAC;IACtB,MAAM,EAAE,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;CACxD,CAAC,CAOD;AAED;qDACqD;AACrD,wBAAgB,SAAS,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,QAO7D"}

package/dist/ssr/server.js

@@ -0,0 +1,149 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import { pathToFileURL } from 'node:url';
+import express from 'express';
+import { createServer as createViteServer } from 'vite';
+import RouterService from '../router/RouterService.js';
+function defaultDistEntryPath(entryPath) {
+    return entryPath
+        .replace(/^src\//, 'dist/')
+        .replace(/\.tsx?$/, '.js');
+}
+class SsrServer {
+    app;
+    vite;
+    config;
+    isProd;
+    constructor(config) {
+        this.config = {
+            root: path.resolve(config.root),
+            entryPath: config.entryPath,
+            port: config.port ?? 5173,
+            cssLinkInDev: config.cssLinkInDev ?? '<link rel="stylesheet" href="/src/index.css"></head>',
+        };
+        this.isProd = process.env.NODE_ENV === 'production';
+        this.app = express();
+    }
+    static async create(config) {
+        const server = new SsrServer(config);
+        await server.configureVite();
+        server.configureStaticAssets();
+        server.configureRequestHandler();
+        return server;
+    }
+    async configureVite() {
+        if (this.isProd)
+            return;
+        this.vite = await createViteServer({
+            server: { middlewareMode: true },
+            appType: 'custom',
+            root: this.config.root,
+        });
+        this.app.use(this.vite.middlewares);
+    }
+    configureStaticAssets() {
+        if (!this.isProd)
+            return;
+        this.app.use(express.static(path.join(this.config.root, 'dist'), { index: false }));
+    }
+    configureRequestHandler() {
+        this.app.use('*', (req, res, next) => this.handleRequest(req, res, next));
+    }
+    async handleRequest(req, res, next) {
+        const url = req.originalUrl;
+        const pathname = url.replace(/\?.*$/, '').replace(/#.*$/, '') || '/';
+        try {
+            if (!RouterService.isSsrRoute(pathname)) {
+                return await this.renderSpa(url, res);
+            }
+            return await this.renderSsr(url, res);
+        }
+        catch (e) {
+            if (this.vite) {
+                this.vite.ssrFixStacktrace?.(e);
+            }
+            next(e);
+        }
+    }
+    async renderSpa(url, res) {
+        if (this.vite) {
+            let template = this.readTemplate(path.join(this.config.root, 'index.html'));
+            template = this.injectCssInDev(template);
+            const html = await this.vite.transformIndexHtml(url, template);
+            return res.status(200).set({ 'Content-Type': 'text/html' }).send(html);
+        }
+        const template = this.readTemplate(path.join(this.config.root, 'dist', 'index.html'));
+        return res.status(200).set({ 'Content-Type': 'text/html' }).send(template);
+    }
+    async renderSsr(url, res) {
+        const { template, render } = await this.getSsrRenderer();
+        const result = await render(url);
+        const appHtml = typeof result.html === 'string' ? result.html : '';
+        const preloadedData = result.preloadedData ?? {};
+        let html = template.replace('<div id="root"></div>', `<div id="root">${appHtml}</div>`);
+        html = this.injectPreloadedData(html, preloadedData);
+        if (this.vite) {
+            const transformed = await this.vite.transformIndexHtml(url, html);
+            return res.status(200).set({ 'Content-Type': 'text/html' }).send(transformed);
+        }
+        return res.status(200).set({ 'Content-Type': 'text/html' }).send(html);
+    }
+    async getSsrRenderer() {
+        if (this.vite) {
+            const template = this.injectCssInDev(this.readTemplate(path.join(this.config.root, 'index.html')));
+            const entry = await this.vite.ssrLoadModule(path.join(this.config.root, this.config.entryPath));
+            return {
+                template,
+                render: entry.render,
+            };
+        }
+        const template = this.readTemplate(path.join(this.config.root, 'dist', 'index.html'));
+        const distEntryPath = defaultDistEntryPath(this.config.entryPath);
+        const entryUrl = pathToFileURL(path.join(this.config.root, distEntryPath)).href;
+        const entry = await import(entryUrl);
+        return {
+            template,
+            render: entry.render,
+        };
+    }
+    readTemplate(fullPath) {
+        return fs.readFileSync(fullPath, 'utf-8');
+    }
+    injectCssInDev(html) {
+        if (!this.vite)
+            return html;
+        return html.replace('</head>', this.config.cssLinkInDev);
+    }
+    injectPreloadedData(html, preloadedData) {
+        if (Object.keys(preloadedData).length === 0)
+            return html;
+        const script = `<script>window.__PRELOADED_DATA__=${JSON.stringify(preloadedData)};</script>`;
+        return html.replace('</body>', `${script}</body>`);
+    }
+    listen(port, callback) {
+        const p = port ?? this.config.port;
+        this.app.listen(p, callback ?? (() => {
+            console.log(`SSR server running at http://localhost:${p}`);
+        }));
+    }
+    getApp() {
+        return this.app;
+    }
+}
+export async function createServer(config) {
+    const server = await SsrServer.create(config);
+    return {
+        getApp: () => server.getApp(),
+        listen: (port, callback) => server.listen(port, callback),
+    };
+}
+/** Standalone: run server when this file is executed (e.g. tsx packages/lovable-ssr/src/ssr/server.ts).
+ * Set env ROOT, ENTRY_PATH, PORT or use defaults. */
+export function runServer(config) {
+    const root = config?.root ?? process.cwd();
+    const entryPath = config?.entryPath ?? 'src/entry-server.tsx';
+    const port = config?.port ?? (process.env.PORT ? Number(process.env.PORT) : 5173);
+    createServer({ root, entryPath, port, ...config })
+        .then((s) => s.listen(port))
+        .catch(console.error);
+}

package/dist/types.d.ts

@@ -0,0 +1,10 @@
+import type React from 'react';
+export type ComponentWithGetServerData = React.ComponentType<any> & {
+    getServerData?: (params?: Record<string, string>) => Promise<Record<string, unknown>>;
+};
+export type RouteConfig = {
+    path: string;
+    Component: ComponentWithGetServerData;
+    isSSR: boolean;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,MAAM,0BAA0B,GAAG,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG;IAClE,aAAa,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;CACvF,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,0BAA0B,CAAC;IACtC,KAAK,EAAE,OAAO,CAAC;CAChB,CAAC"}

package/dist/types.js

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

package/package.json

@@ -0,0 +1,55 @@
+{
+  "name": "lovable-ssr",
+  "version": "0.1.2",
+  "description": "SSR and route data engine for Lovable projects",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./server": {
+      "import": "./dist/ssr/server.js",
+      "types": "./dist/ssr/server.d.ts"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsc && npm run build:docs",
+    "dev": "tsc --watch",
+    "changelog": "standard-version --message \"[skip ci]\"",
+    "changelog:rc": "npm run changelog -- --prerelease rc --skip.changelog --skip.tag",
+    "changelog:patch": "npm run changelog -- --release-as patch --prerelease rc",
+    "changelog:minor": "npm run changelog -- --release-as minor --prerelease rc",
+    "changelog:major": "npm run changelog -- --release-as major --prerelease rc",
+    "build:docs": "cd doc && npm run docs:build"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "react-router-dom": "^6.0.0"
+  },
+  "dependencies": {
+    "express": "^4.21.0"
+  },
+  "devDependencies": {
+    "@types/express": "^4.17.21",
+    "@types/node": "^22.16.5",
+    "@types/react": "^18.3.23",
+    "@types/react-dom": "^18.3.7",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-router-dom": "^6.30.1",
+    "standard-version": "^9.5.0",
+    "typescript": "^5.8.3",
+    "vite": "^5.4.19"
+  },
+  "engines": {
+    "node": ">=18"
+  }
+}