@appigram/react-code-split-ssr 1.2.0-beta.5 → 1.2.1

package/lib/generate-routes.js

@@ -11,7 +11,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { matchPath, Route, Routes } from "react-router-dom";
 const generateRoutes = (options = {
     pathname: "/",
-    routes: []
+    routes: [],
 }) => __awaiter(void 0, void 0, void 0, function* () {
     if (!Array.isArray(options.routes) || options.routes.length === 0) {
         throw new Error("options.routes must be an non-empty array");
@@ -20,17 +20,17 @@ const generateRoutes = (options = {
     const preloadedComp = preload === undefined
         ? yield options.notFoundComp().props.mod
         : yield preload.element().props.mod;
-    const renderComp = (path, bundle) => {
+    const renderElement = (path, bundle) => {
         if (!preloadedComp)
             return bundle;
         const isSSR = (preload && preload.path === path) || (!preload && !path);
-        return isSSR ? preloadedComp.default : bundle;
+        const Element = isSSR ? preloadedComp.default : bundle;
+        return _jsx(Element, {}, void 0);
     };
     return () => {
         return (_jsxs(Routes, { children: [options.routes.map((props, i) => {
-                    const element = renderComp(props.path, props.element);
-                    return (_jsx(Route, Object.assign({}, props, { element: element }), i));
-                }), _jsx(Route, { element: renderComp(null, options.notFoundComp) }, void 0)] }, void 0));
+                    return (_jsx(Route, { path: props.path, element: renderElement(props.path, props.element()) }, i));
+                }), _jsx(Route, { element: renderElement(null, options.notFoundComp()) }, void 0)] }, void 0));
     };
 });
 export default generateRoutes;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@appigram/react-code-split-ssr",
-	"version": "1.2.0-beta.5",
+	"version": "1.2.1",
 	"description": "React code splitting with SSR",
 	"main": "./lib/index.js",
 	"scripts": {
@@ -28,7 +28,7 @@
 		"tslint-react": "^5.0.0",
 		"typescript": "^4.4.4"
 	},
-	"dependencies": {
+	"peerDependencies": {
 		"react": "^17.0.2",
 		"react-dom": "^17.0.2",
 		"react-router-dom": "^6.0.2"

package/src/generate-routes.tsx

@@ -1,17 +1,16 @@
-import { ReactElement, JSXElementConstructor } from 'react'
+import { ReactElement } from "react";
 import { matchPath, Route, Routes } from "react-router-dom";
-// import Bundle from './bundle'
 
 export interface IJSXModule {
-	default: ReactElement<any, string | JSXElementConstructor<any>>;
+	default: React.FC | React.ComponentClass;
 }
 
 export interface ISSRRoute {
 	caseSensitive?: boolean;
-  children?: React.ReactNode;
-  element?: () => React.FunctionComponentElement<{ mod: Promise<IJSXModule> }>;
-  index?: boolean;
-  path?: string;
+	children?: React.ReactNode;
+	element?: () => React.FunctionComponentElement<{ mod: Promise<IJSXModule> }>;
+	index?: boolean;
+	path?: string;
 }
 
 export interface IOptions {
@@ -23,7 +22,7 @@ export interface IOptions {
 const generateRoutes = async (
 	options: IOptions = {
 		pathname: "/",
-		routes: []
+		routes: [],
 	}
 ): Promise<React.FC> => {
 	if (!Array.isArray(options.routes) || options.routes.length === 0) {
@@ -31,8 +30,7 @@ const generateRoutes = async (
 	}
 
 	const preload = options.routes.find(
-		(route) =>
-			!!matchPath(route.path, options.pathname)
+		(route) => !!matchPath(route.path, options.pathname)
 	);
 
 	const preloadedComp: any =
@@ -40,25 +38,26 @@ const generateRoutes = async (
 			? await options.notFoundComp().props.mod
 			: await preload.element().props.mod;
 
-	const renderComp = (path: string, bundle: React.FC) => {
+	const renderElement = (path: string, bundle: ReactElement) => {
 		if (!preloadedComp) return bundle;
 		const isSSR = (preload && preload.path === path) || (!preload && !path);
-		return isSSR ? preloadedComp.default : bundle;
+		const Element = isSSR ? preloadedComp.default : bundle;
+		return <Element />;
 	};
 
 	return () => {
 		return (
 			<Routes>
 				{options.routes.map((props, i) => {
-					const element = renderComp(props.path, props.element)
 					return (
 						<Route
 							key={i}
-							{...props}
-							element={element}
+							path={props.path}
+							element={renderElement(props.path, props.element())}
 						/>
-				)})}
-				<Route element={renderComp(null, options.notFoundComp)} />
+					);
+				})}
+				<Route element={renderElement(null, options.notFoundComp())} />
 			</Routes>
 		);
 	};