rasengan 1.0.0-beta.10 → 1.0.0-beta.12

package/lib/cjs/cli/index.js

@@ -122,10 +122,6 @@ program
         (0, execa_1.execa)("cp", ["node_modules/rasengan/lib/esm/server/functions/vercel/vercel.json", "."], {
             stdio: "inherit",
         });
-        // Removing index.d.ts and index.js.map files from the api folder
-        (0, execa_1.execa)("rm", ["api/index.d.ts"], {
-            stdio: "inherit",
-        });
     }
     else if (hostingStrategy === "netlify") { }
 });

package/lib/cjs/config/index.js

@@ -127,14 +127,14 @@ exports.defineConfig = defineConfig;
 var adaptPath = function (paths) {
     // Check if we are in dev mode or prod
     var isProduction = process.env.NODE_ENV === "production";
-    var prefix = isProduction ? "./../../../" : "";
+    var prefix = isProduction ? "./../../" : "";
     // Chech if the path is an array
     var isArray = Array.isArray(paths);
     // If the path is an array
     if (isArray) {
-        return paths.map(function (path) { return "".concat(prefix).concat(path); });
+        return paths.map(function (path) { return "".concat(process.cwd(), "/").concat(prefix).concat(path); });
     }
     // If the path is a string
-    return "".concat(prefix).concat(paths);
+    return "".concat(process.cwd(), "/").concat(prefix).concat(paths);
 };
 exports.adaptPath = adaptPath;

package/lib/cjs/core/components/index.js

@@ -140,10 +140,10 @@ var ErrorFallbackComponent = function (_a) {
  * @returns
  */
 var Heads = function (_a) {
-    var data = _a.data, _b = _a.children, children = _b === void 0 ? undefined : _b, _c = _a.bootstrap, bootstrap = _c === void 0 ? "" : _c;
+    var data = _a.data, _b = _a.children, children = _b === void 0 ? undefined : _b, _c = _a.bootstrap, bootstrap = _c === void 0 ? "" : _c, _d = _a.styles, styles = _d === void 0 ? "" : _d;
     if (!data)
         return null;
-    return ((0, jsx_runtime_1.jsxs)("head", { children: [children, data.helmet && data.helmet.meta.toComponent({}), data.helmet && data.helmet.title.toComponent({}), bootstrap && ((0, jsx_runtime_1.jsx)("script", { type: "module", src: bootstrap, defer: true }))] }));
+    return ((0, jsx_runtime_1.jsxs)("head", { children: [children, data.helmet && data.helmet.meta.toComponent({}), data.helmet && data.helmet.title.toComponent({}), bootstrap && ((0, jsx_runtime_1.jsx)("script", { type: "module", src: bootstrap, defer: true })), styles && ((0, jsx_runtime_1.jsx)("link", { rel: "stylesheet", crossOrigin: "", type: "text/css", href: styles }))] }));
 };
 exports.Heads = Heads;
 /**

package/lib/cjs/entries/entry-server.js

@@ -47,10 +47,10 @@ var HelmetAsync = __importStar(require("react-helmet-async"));
 var H = HelmetAsync.default ? HelmetAsync.default : HelmetAsync;
 // const ABORT_DELAY = 5000;
 var TemplateHtml = function (_a) {
-    var helmetContext = _a.helmetContext, bootstrap = _a.bootstrap;
+    var helmetContext = _a.helmetContext, bootstrap = _a.bootstrap, styles = _a.styles;
     return ((0, jsx_runtime_1.jsx)(template_1.default, { Head: function (_a) {
             var children = _a.children;
-            return ((0, jsx_runtime_1.jsx)(index_js_2.Heads, { data: helmetContext, bootstrap: bootstrap, children: children }));
+            return ((0, jsx_runtime_1.jsx)(index_js_2.Heads, { data: helmetContext, bootstrap: bootstrap, styles: styles, children: children }));
         }, Body: function (_a) {
             var children = _a.children;
             return (0, jsx_runtime_1.jsx)(index_js_2.Body, { children: children });
@@ -73,8 +73,8 @@ function render(router, context, helmetContext) {
 }
 exports.render = render;
 exports.staticRoutes = (0, index_js_1.generateStaticRoutes)(app_router_1.default);
-var loadTemplateHtml = function (helmetContext, bootstrap) {
-    var html = server_1.default.renderToString((0, jsx_runtime_1.jsx)(TemplateHtml, { helmetContext: helmetContext, bootstrap: bootstrap }));
+var loadTemplateHtml = function (helmetContext, bootstrap, styles) {
+    var html = server_1.default.renderToString((0, jsx_runtime_1.jsx)(TemplateHtml, { helmetContext: helmetContext, bootstrap: bootstrap, styles: styles }));
     return "\n  <!DOCTYPE html>\n  ".concat(html, "\n  ");
 };
 exports.loadTemplateHtml = loadTemplateHtml;

package/lib/cjs/server/functions/vercel/api/index.js

@@ -76,7 +76,7 @@ var __dirname = (0, node_path_1.dirname)(__filename);
 function handler(req, res) {
     var _a;
     return __awaiter(this, void 0, void 0, function () {
-        var url, host, appPath, err_1, templateHtml, serverFilePath, bootstrapDirPath, entry, bootstrap, render, staticRoutes, loadTemplateHtml, handler_1, fetchRequest, context, status_1, redirect, helmetContext, router, rendered, html, e_1;
+        var url, host, appPath, err_1, templateHtml, serverFilePath, bootstrapDirPath, entry, bootstrap, styles, render, staticRoutes, loadTemplateHtml, handler_1, fetchRequest, context, status_1, redirect, helmetContext, router, rendered, html, e_1;
         return __generator(this, function (_b) {
             switch (_b.label) {
                 case 0:
@@ -114,6 +114,10 @@ function handler(req, res) {
                         node_fs_1.default
                             .readdirSync(bootstrapDirPath)
                             .filter(function (fn) { return fn.includes("entry-client") && fn.endsWith(".js"); })[0];
+                    styles = "/assets/" +
+                        node_fs_1.default
+                            .readdirSync((0, node_path_1.join)(appPath, "dist/client/assets"))
+                            .filter(function (fn) { return fn.includes("entry-client") && fn.endsWith(".css"); })[0];
                     render = entry.render, staticRoutes = entry.staticRoutes, loadTemplateHtml = entry.loadTemplateHtml;
                     handler_1 = (0, server_js_1.createStaticHandler)(staticRoutes);
                     fetchRequest = (0, rasengan_1.createFetchRequest)(req, host);
@@ -133,16 +137,15 @@ function handler(req, res) {
                     rendered = _b.sent();
                     // Load template html
                     if (!templateHtml) {
-                        templateHtml = loadTemplateHtml(helmetContext, bootstrap);
+                        templateHtml = loadTemplateHtml(helmetContext, bootstrap, styles);
                     }
                     html = templateHtml.replace("rasengan-body-app", (_a = rendered.html) !== null && _a !== void 0 ? _a : "");
                     // Send the rendered html page
-                    res
-                        .status(200)
-                        .setHeader("Content-Type", "text/html")
-                        .setHeader("Cache-Control", "max-age=31536000")
-                        .end(html);
-                    return [3 /*break*/, 9];
+                    return [2 /*return*/, res
+                            .status(200)
+                            .setHeader("Content-Type", "text/html")
+                            .setHeader("Cache-Control", "max-age=31536000")
+                            .end(html)];
                 case 8:
                     e_1 = _b.sent();
                     console.log(e_1.stack);

package/lib/esm/cli/index.js

@@ -117,10 +117,6 @@ program
         execa("cp", ["node_modules/rasengan/lib/esm/server/functions/vercel/vercel.json", "."], {
             stdio: "inherit",
         });
-        // Removing index.d.ts and index.js.map files from the api folder
-        execa("rm", ["api/index.d.ts"], {
-            stdio: "inherit",
-        });
     }
     else if (hostingStrategy === "netlify") { }
 });

package/lib/esm/config/index.js

@@ -123,13 +123,13 @@ export var defineConfig = function (loadedConfig) {
 export var adaptPath = function (paths) {
     // Check if we are in dev mode or prod
     var isProduction = process.env.NODE_ENV === "production";
-    var prefix = isProduction ? "./../../../" : "";
+    var prefix = isProduction ? "./../../" : "";
     // Chech if the path is an array
     var isArray = Array.isArray(paths);
     // If the path is an array
     if (isArray) {
-        return paths.map(function (path) { return "".concat(prefix).concat(path); });
+        return paths.map(function (path) { return "".concat(process.cwd(), "/").concat(prefix).concat(path); });
     }
     // If the path is a string
-    return "".concat(prefix).concat(paths);
+    return "".concat(process.cwd(), "/").concat(prefix).concat(paths);
 };

package/lib/esm/core/components/index.js

@@ -109,10 +109,10 @@ var ErrorFallbackComponent = function (_a) {
  * @returns
  */
 export var Heads = function (_a) {
-    var data = _a.data, _b = _a.children, children = _b === void 0 ? undefined : _b, _c = _a.bootstrap, bootstrap = _c === void 0 ? "" : _c;
+    var data = _a.data, _b = _a.children, children = _b === void 0 ? undefined : _b, _c = _a.bootstrap, bootstrap = _c === void 0 ? "" : _c, _d = _a.styles, styles = _d === void 0 ? "" : _d;
     if (!data)
         return null;
-    return (_jsxs("head", { children: [children, data.helmet && data.helmet.meta.toComponent({}), data.helmet && data.helmet.title.toComponent({}), bootstrap && (_jsx("script", { type: "module", src: bootstrap, defer: true }))] }));
+    return (_jsxs("head", { children: [children, data.helmet && data.helmet.meta.toComponent({}), data.helmet && data.helmet.title.toComponent({}), bootstrap && (_jsx("script", { type: "module", src: bootstrap, defer: true })), styles && (_jsx("link", { rel: "stylesheet", crossOrigin: "", type: "text/css", href: styles }))] }));
 };
 /**
  * Body component

package/lib/esm/entries/entry-server.js

@@ -18,10 +18,10 @@ import * as HelmetAsync from "react-helmet-async";
 var H = HelmetAsync.default ? HelmetAsync.default : HelmetAsync;
 // const ABORT_DELAY = 5000;
 var TemplateHtml = function (_a) {
-    var helmetContext = _a.helmetContext, bootstrap = _a.bootstrap;
+    var helmetContext = _a.helmetContext, bootstrap = _a.bootstrap, styles = _a.styles;
     return (_jsx(Template, { Head: function (_a) {
             var children = _a.children;
-            return (_jsx(Heads, { data: helmetContext, bootstrap: bootstrap, children: children }));
+            return (_jsx(Heads, { data: helmetContext, bootstrap: bootstrap, styles: styles, children: children }));
         }, Body: function (_a) {
             var children = _a.children;
             return _jsx(Body, { children: children });
@@ -43,7 +43,7 @@ export function render(router, context, helmetContext) {
     return { html: html };
 }
 export var staticRoutes = generateStaticRoutes(AppRouter);
-export var loadTemplateHtml = function (helmetContext, bootstrap) {
-    var html = ReactDOMServer.renderToString(_jsx(TemplateHtml, { helmetContext: helmetContext, bootstrap: bootstrap }));
+export var loadTemplateHtml = function (helmetContext, bootstrap, styles) {
+    var html = ReactDOMServer.renderToString(_jsx(TemplateHtml, { helmetContext: helmetContext, bootstrap: bootstrap, styles: styles }));
     return "\n  <!DOCTYPE html>\n  ".concat(html, "\n  ");
 };

package/lib/esm/server/functions/vercel/api/index.js

@@ -48,7 +48,7 @@ var __dirname = dirname(__filename);
 export default function handler(req, res) {
     var _a;
     return __awaiter(this, void 0, void 0, function () {
-        var url, host, appPath, err_1, templateHtml, serverFilePath, bootstrapDirPath, entry, bootstrap, render, staticRoutes, loadTemplateHtml, handler_1, fetchRequest, context, status_1, redirect, helmetContext, router, rendered, html, e_1;
+        var url, host, appPath, err_1, templateHtml, serverFilePath, bootstrapDirPath, entry, bootstrap, styles, render, staticRoutes, loadTemplateHtml, handler_1, fetchRequest, context, status_1, redirect, helmetContext, router, rendered, html, e_1;
         return __generator(this, function (_b) {
             switch (_b.label) {
                 case 0:
@@ -86,6 +86,10 @@ export default function handler(req, res) {
                         fsSync
                             .readdirSync(bootstrapDirPath)
                             .filter(function (fn) { return fn.includes("entry-client") && fn.endsWith(".js"); })[0];
+                    styles = "/assets/" +
+                        fsSync
+                            .readdirSync(join(appPath, "dist/client/assets"))
+                            .filter(function (fn) { return fn.includes("entry-client") && fn.endsWith(".css"); })[0];
                     render = entry.render, staticRoutes = entry.staticRoutes, loadTemplateHtml = entry.loadTemplateHtml;
                     handler_1 = createStaticHandler(staticRoutes);
                     fetchRequest = createFetchRequest(req, host);
@@ -105,16 +109,15 @@ export default function handler(req, res) {
                     rendered = _b.sent();
                     // Load template html
                     if (!templateHtml) {
-                        templateHtml = loadTemplateHtml(helmetContext, bootstrap);
+                        templateHtml = loadTemplateHtml(helmetContext, bootstrap, styles);
                     }
                     html = templateHtml.replace("rasengan-body-app", (_a = rendered.html) !== null && _a !== void 0 ? _a : "");
                     // Send the rendered html page
-                    res
-                        .status(200)
-                        .setHeader("Content-Type", "text/html")
-                        .setHeader("Cache-Control", "max-age=31536000")
-                        .end(html);
-                    return [3 /*break*/, 9];
+                    return [2 /*return*/, res
+                            .status(200)
+                            .setHeader("Content-Type", "text/html")
+                            .setHeader("Cache-Control", "max-age=31536000")
+                            .end(html)];
                 case 8:
                     e_1 = _b.sent();
                     console.log(e_1.stack);

package/lib/types/core/components/index.d.ts

@@ -25,10 +25,11 @@ export declare class ErrorBoundary extends React.Component {
  * @params data - Helmet context
  * @returns
  */
-export declare const Heads: ({ data, children, bootstrap, }: {
+export declare const Heads: ({ data, children, bootstrap, styles, }: {
     data: HelmetContext;
     children?: React.ReactNode;
     bootstrap?: string;
+    styles?: string;
 }) => import("react/jsx-runtime").JSX.Element;
 /**
  * Body component

package/lib/types/entries/entry-server.d.ts

@@ -11,4 +11,4 @@ export declare function render(router: Router, context: StaticHandlerContext, he
     html: string;
 };
 export declare const staticRoutes: any;
-export declare const loadTemplateHtml: (helmetContext: any, bootstrap: string) => string;
+export declare const loadTemplateHtml: (helmetContext: any, bootstrap: string, styles: string) => string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "rasengan",
   "private": false,
-  "version": "1.0.0-beta.10",
+  "version": "1.0.0-beta.12",
   "type": "module",
   "main": "lib/esm/index.js",
   "bin": {

package/server.js

@@ -46,6 +46,8 @@ async function createServer({
   let templateHtml = "";
   // Bootstrap
   let bootstrap = "";
+  // Styles
+  let styles = "";
 
   // Add Vite or respective production middlewares
   let vite;
@@ -94,6 +96,13 @@ async function createServer({
             .filter(
               (fn) => fn.includes("entry-client") && fn.endsWith(".js")
             )[0];
+
+        // replace styles with compiled styles
+        styles =
+          "/assets/" +
+          fs
+            .readdirSync(join(appPath, "dist/client/assets"))
+            .filter((fn) => fn.includes("entry-client") && fn.endsWith(".css"))[0];
       }
 
       // Get entry values
@@ -126,7 +135,7 @@ async function createServer({
 
       // Load template html
       if (!templateHtml) {
-        templateHtml = loadTemplateHtml(helmetContext, bootstrap);
+        templateHtml = loadTemplateHtml(helmetContext, bootstrap, styles);
 
         if (!isProduction) {
           templateHtml = await vite.transformIndexHtml(url, templateHtml);
@@ -137,7 +146,7 @@ async function createServer({
       let html = templateHtml.replace(`rasengan-body-app`, rendered.html ?? "");
 
       // Send the rendered html page
-      res
+      return res
         .status(200)
         .set({
           "Content-Type": "text/html",

package/vite.config.ts

@@ -1,6 +1,5 @@
 import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react";
-import cssInjectedByJsPlugin from "vite-plugin-css-injected-by-js";
 
 // Load rasengan config file
 // @ts-ignore
@@ -20,7 +19,7 @@ const __pathToRoot = path.resolve(__dirname, "./../../");
 
 export default defineConfig({
   // Vite Plugins
-  plugins: [react(), cssInjectedByJsPlugin(), ...vite?.plugins],
+  plugins: [react(), ...vite?.plugins],
 
   // define index.html location
   root: __pathToRoot,