@blinkk/root 1.0.0-beta.2 → 1.0.0-beta.21

package/dist/render.js

@@ -2,17 +2,205 @@ import {
   htmlMinify,
   htmlPretty,
   parseTagNames
-} from "./chunk-GGQGZ7ZE.js";
+} from "./chunk-DXD5LKU3.js";
 import {
   HTML_CONTEXT,
   I18N_CONTEXT,
   REQUEST_CONTEXT,
   getTranslations
-} from "./chunk-WTSNW7BB.js";
+} from "./chunk-WX2GLKRC.js";
 
 // src/render/render.tsx
 import renderToString from "preact-render-to-string";
 
+// src/core/pages/ErrorPage.tsx
+import { Fragment, jsx, jsxs } from "preact/jsx-runtime";
+var STYLES = `
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap');
+
+:root {
+  --font-family-text: "Inter", sans-serif;
+}
+
+body {
+  font-family: var(--font-family-text);
+  background: #F5F5F5;
+  padding: 40px 16px;
+}
+
+.root {
+  max-width: 1200px;
+  margin: 0 auto;
+}
+
+.root.align-center {
+  text-align: center;
+}
+
+h1.title {
+  margin-top: 0;
+  margin-bottom: 24px;
+}
+
+p.message {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+.box {
+  font-size: 16px;
+  line-height: 1.5;
+  padding: 16px;
+  border-radius: 12px;
+  background: #ffffff;
+}
+
+pre.box {
+  white-space: pre-wrap;
+}
+
+@media (min-width: 500px)  {
+  body {
+    padding: 40px;
+  }
+
+  .box {
+    padding: 24px;
+  }
+}
+
+@media (min-width: 1024px)  {
+  body {
+    padding: 100px;
+  }
+}
+`;
+function ErrorPage(props) {
+  const { code, message } = props;
+  const title = props.title || code;
+  return /* @__PURE__ */ jsxs(Fragment, {
+    children: [
+      /* @__PURE__ */ jsx("style", {
+        dangerouslySetInnerHTML: { __html: STYLES }
+      }),
+      /* @__PURE__ */ jsxs("div", {
+        className: `root align-${props.align || "left"}`,
+        children: [
+          /* @__PURE__ */ jsx("h1", {
+            className: "title",
+            children: title
+          }),
+          message && /* @__PURE__ */ jsx("p", {
+            className: "message",
+            children: message
+          }),
+          props.children
+        ]
+      })
+    ]
+  });
+}
+
+// src/core/pages/DevErrorPage.tsx
+import { Fragment as Fragment2, jsx as jsx2, jsxs as jsxs2 } from "preact/jsx-runtime";
+function DevErrorPage(props) {
+  var _a;
+  const req = props.req;
+  const err = props.error;
+  const route = props.route;
+  const routeParams = props.routeParams;
+  let errMsg = String(err);
+  if (err && err.stack) {
+    errMsg = err.stack.replace(/\(.*node_modules/g, "(node_modules").replace(/at \/.*node_modules/g, "at node_modules");
+    if ((_a = req.rootConfig) == null ? void 0 : _a.rootDir) {
+      errMsg = errMsg.replaceAll(req.rootConfig.rootDir, "<root>");
+    }
+    if (process.env.HOME) {
+      errMsg = errMsg.replaceAll(process.env.HOME, "$HOME");
+    }
+  }
+  return /* @__PURE__ */ jsxs2(ErrorPage, {
+    code: 500,
+    title: "Something went wrong",
+    children: [
+      errMsg && /* @__PURE__ */ jsxs2(Fragment2, {
+        children: [
+          /* @__PURE__ */ jsx2("h2", {
+            children: "Error"
+          }),
+          /* @__PURE__ */ jsx2("pre", {
+            className: "box",
+            children: /* @__PURE__ */ jsx2("code", {
+              children: errMsg
+            })
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx2("h2", {
+        children: "Debug Info"
+      }),
+      /* @__PURE__ */ jsx2("pre", {
+        className: "box",
+        children: /* @__PURE__ */ jsx2("code", {
+          children: `url: ${req.originalUrl}
+route: ${(route == null ? void 0 : route.src) || "null"}
+routeParams: ${routeParams && JSON.stringify(routeParams) || "null"}`
+        })
+      })
+    ]
+  });
+}
+
+// src/core/pages/DevNotFoundPage.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "preact/jsx-runtime";
+function DevNotFoundPage(props) {
+  const req = props.req;
+  const routesList = [];
+  let urlMaxLength = 0;
+  Object.keys(props.sitemap).forEach((urlPath) => {
+    const route = props.sitemap[urlPath].route;
+    routesList.push(Object.assign({}, route, { urlPath }));
+    if (urlPath.length > urlMaxLength) {
+      urlMaxLength = urlPath.length;
+    }
+  });
+  const routesListString = routesList.map((route) => {
+    return `${route.urlPath.padEnd(urlMaxLength, " ")}  =>  ${route.src}`;
+  }).join("\n");
+  return /* @__PURE__ */ jsxs3(ErrorPage, {
+    code: 404,
+    title: "Not found",
+    children: [
+      /* @__PURE__ */ jsx3("h2", {
+        children: "Routes"
+      }),
+      routesList.length > 0 ? /* @__PURE__ */ jsx3("pre", {
+        className: "box",
+        children: /* @__PURE__ */ jsx3("code", {
+          children: routesListString
+        })
+      }) : /* @__PURE__ */ jsxs3("div", {
+        className: "box",
+        children: [
+          "Add your first route at ",
+          /* @__PURE__ */ jsx3("code", {
+            children: "/routes/index.tsx"
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx3("h2", {
+        children: "Debug Info"
+      }),
+      /* @__PURE__ */ jsx3("pre", {
+        className: "box",
+        children: /* @__PURE__ */ jsx3("code", {
+          children: `url: ${req.originalUrl}`
+        })
+      })
+    ]
+  });
+}
+
 // src/render/router.ts
 import path from "node:path";
 
@@ -242,186 +430,6 @@ function pathContainsPlaceholders(urlPath) {
   });
 }
 
-// src/core/pages/ErrorPage.tsx
-import { Fragment, jsx, jsxs } from "preact/jsx-runtime";
-var STYLES = `
-@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap');
-
-:root {
-  --font-family-text: "Inter", sans-serif;
-}
-
-body {
-  font-family: var(--font-family-text);
-  background: #F5F5F5;
-  padding: 40px 16px;
-}
-
-.root {
-  max-width: 1200px;
-  margin: 0 auto;
-}
-
-h1 {
-  margin-bottom: 40px;
-}
-
-h2 {
-  margin-top: 30px;
-}
-
-.box {
-  font-size: 16px;
-  line-height: 1.5;
-  padding: 16px;
-  border-radius: 12px;
-  background: #ffffff;
-}
-
-pre.box {
-  white-space: pre-wrap;
-}
-
-@media (min-width: 500px)  {
-  body {
-    padding: 40px;
-  }
-
-  .box {
-    padding: 24px;
-  }
-}
-
-@media (min-width: 1024px)  {
-  body {
-    padding: 100px;
-  }
-}
-`;
-function ErrorPage(props) {
-  const { code, message } = props;
-  const title = props.title ? `${code} | ${props.title}` : code;
-  return /* @__PURE__ */ jsxs(Fragment, {
-    children: [
-      /* @__PURE__ */ jsx("style", {
-        dangerouslySetInnerHTML: { __html: STYLES }
-      }),
-      /* @__PURE__ */ jsxs("div", {
-        className: "root",
-        children: [
-          /* @__PURE__ */ jsx("h1", {
-            children: title
-          }),
-          message && /* @__PURE__ */ jsx("p", {
-            children: message
-          }),
-          props.children
-        ]
-      })
-    ]
-  });
-}
-
-// src/core/pages/DevNotFoundPage.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "preact/jsx-runtime";
-function DevNotFoundPage(props) {
-  const req = props.req;
-  const routesList = [];
-  let urlMaxLength = 0;
-  Object.keys(props.sitemap).forEach((urlPath) => {
-    const route = props.sitemap[urlPath].route;
-    routesList.push(Object.assign({}, route, { urlPath }));
-    if (urlPath.length > urlMaxLength) {
-      urlMaxLength = urlPath.length;
-    }
-  });
-  const routesListString = routesList.map((route) => {
-    return `${route.urlPath.padEnd(urlMaxLength, " ")}  =>  ${route.src}`;
-  }).join("\n");
-  return /* @__PURE__ */ jsxs2(ErrorPage, {
-    code: 404,
-    title: "Root.js",
-    children: [
-      /* @__PURE__ */ jsx2("h2", {
-        children: "Routes"
-      }),
-      routesList.length > 0 ? /* @__PURE__ */ jsx2("pre", {
-        className: "box",
-        children: /* @__PURE__ */ jsx2("code", {
-          children: routesListString
-        })
-      }) : /* @__PURE__ */ jsxs2("div", {
-        className: "box",
-        children: [
-          "Add your first route at ",
-          /* @__PURE__ */ jsx2("code", {
-            children: "/routes/index.tsx"
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsx2("h2", {
-        children: "Debug Info"
-      }),
-      /* @__PURE__ */ jsx2("pre", {
-        className: "box",
-        children: /* @__PURE__ */ jsx2("code", {
-          children: `url: ${req.originalUrl}`
-        })
-      })
-    ]
-  });
-}
-
-// src/core/pages/DevErrorPage.tsx
-import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "preact/jsx-runtime";
-function DevErrorPage(props) {
-  var _a;
-  const req = props.req;
-  const err = props.error;
-  const route = props.route;
-  const routeParams = props.routeParams;
-  let errMsg = String(err);
-  if (err && err.stack) {
-    errMsg = err.stack.replace(/\(.*node_modules/g, "(node_modules").replace(/at \/.*node_modules/g, "at node_modules");
-    if ((_a = req.rootConfig) == null ? void 0 : _a.rootDir) {
-      errMsg = errMsg.replaceAll(req.rootConfig.rootDir, "<root>");
-    }
-    if (process.env.HOME) {
-      errMsg = errMsg.replaceAll(process.env.HOME, "$HOME");
-    }
-  }
-  return /* @__PURE__ */ jsxs3(ErrorPage, {
-    code: 500,
-    title: "Root.js",
-    children: [
-      errMsg && /* @__PURE__ */ jsxs3(Fragment2, {
-        children: [
-          /* @__PURE__ */ jsx3("h2", {
-            children: "Error"
-          }),
-          /* @__PURE__ */ jsx3("pre", {
-            className: "box",
-            children: /* @__PURE__ */ jsx3("code", {
-              children: errMsg
-            })
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsx3("h2", {
-        children: "Debug Info"
-      }),
-      /* @__PURE__ */ jsx3("pre", {
-        className: "box",
-        children: /* @__PURE__ */ jsx3("code", {
-          children: `url: ${req.originalUrl}
-route: ${(route == null ? void 0 : route.src) || "null"}
-routeParams: ${routeParams && JSON.stringify(routeParams) || "null"}`
-        })
-      })
-    ]
-  });
-}
-
 // src/render/render.tsx
 import { jsx as jsx4, jsxs as jsxs4 } from "preact/jsx-runtime";
 var Renderer = class {
@@ -438,6 +446,9 @@ var Renderer = class {
       next();
       return;
     }
+    if (route.locale) {
+      routeParams.$locale = route.locale;
+    }
     const render404 = async () => {
       next();
     };
@@ -571,6 +582,9 @@ var Renderer = class {
   }
   async renderRoute(route, options) {
     const routeParams = options.routeParams;
+    if (route.locale) {
+      routeParams.$locale = route.locale;
+    }
     const Component = route.module.default;
     if (!Component) {
       throw new Error(
@@ -637,14 +651,24 @@ ${renderToString(page)}
       const Component = route.module.default;
       return this.renderComponent(Component, {}, { route, routeParams });
     }
-    const mainHtml = renderToString(/* @__PURE__ */ jsx4(ErrorPage, {
-      code: 404,
-      title: "Not Found"
-    }));
+    const mainHtml = renderToString(
+      /* @__PURE__ */ jsx4(ErrorPage, {
+        code: 404,
+        title: "Not found",
+        message: "Double-check the URL entered and try again.",
+        align: "center"
+      })
+    );
     const html = await this.renderHtml(mainHtml, {
-      headComponents: [/* @__PURE__ */ jsx4("title", {
-        children: "404"
-      })]
+      headComponents: [
+        /* @__PURE__ */ jsx4("title", {
+          children: "404 Not Found"
+        }),
+        /* @__PURE__ */ jsx4("meta", {
+          name: "viewport",
+          content: "width=device-width, initial-scale=1.0"
+        })
+      ]
     });
     return { html };
   }
@@ -661,14 +685,21 @@ ${renderToString(page)}
     const mainHtml = renderToString(
       /* @__PURE__ */ jsx4(ErrorPage, {
         code: 500,
-        title: "Error",
-        message: "An unknown error occurred."
+        title: "Something went wrong",
+        message: "An unknown error occurred.",
+        align: "center"
       })
     );
     const html = await this.renderHtml(mainHtml, {
-      headComponents: [/* @__PURE__ */ jsx4("title", {
-        children: "500"
-      })]
+      headComponents: [
+        /* @__PURE__ */ jsx4("title", {
+          children: "500 Error"
+        }),
+        /* @__PURE__ */ jsx4("meta", {
+          name: "viewport",
+          content: "width=device-width, initial-scale=1.0"
+        })
+      ]
     });
     return { html };
   }
@@ -682,7 +713,7 @@ ${renderToString(page)}
     );
     const html = await this.renderHtml(mainHtml, {
       headComponents: [/* @__PURE__ */ jsx4("title", {
-        children: "404 | Root.js"
+        children: "404 Not found | Root.js"
       })]
     });
     return { html };
@@ -699,7 +730,7 @@ ${renderToString(page)}
     );
     const html = await this.renderHtml(mainHtml, {
       headComponents: [/* @__PURE__ */ jsx4("title", {
-        children: "500 | Root.js"
+        children: "500 Error | Root.js"
       })]
     });
     return { html };