@getcronit/pylon 3.0.0-canary-20250312165655.826d17474bf64dfdbd9e31dd76e4f3898d48a6d1 → 3.0.0-canary-20250313071016.ae6b1c56cc44cc99648aaee747ea420a05ed0f84

package/dist/index.js

@@ -1207,7 +1207,991 @@ function getEnv() {
 
 // src/index.ts
 import { createPubSub } from "graphql-yoga";
-import { usePages } from "@getcronit/pylon-pages";
+
+// src/plugins/use-pages/setup/index.tsx
+import fs2 from "fs";
+import path3 from "path";
+import reactServer from "react-dom/server";
+import { trimTrailingSlash } from "hono/trailing-slash";
+import { StaticRouter } from "react-router";
+import { PassThrough, Readable } from "stream";
+
+// src/plugins/use-pages/setup/app-loader.tsx
+import { useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+var AppLoader = (props) => {
+  props.client.useHydrateCache({ cacheSnapshot: props.pylonData.cacheSnapshot });
+  const data = props.client.useQuery();
+  const page = useMemo(() => {
+    const page2 = /* @__PURE__ */ jsx(
+      props.App,
+      {
+        pageProps: {
+          ...props.pylonData.pageProps,
+          data
+        }
+      }
+    );
+    return page2;
+  }, [props]);
+  return /* @__PURE__ */ jsx(props.Router, { ...props.routerProps, children: page });
+};
+
+// src/components/global-error-page.tsx
+import { useEffect } from "react";
+
+// src/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/components/logo.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var Logo = (props) => {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      className: cn("h-12 w-auto", props.className),
+      xmlns: "http://www.w3.org/2000/svg",
+      xmlnsXlink: "http://www.w3.org/1999/xlink",
+      zoomAndPan: "magnify",
+      viewBox: "0 0 286.5 121.500001",
+      preserveAspectRatio: "xMidYMid meet",
+      version: "1.0",
+      children: [
+        /* @__PURE__ */ jsxs("defs", { children: [
+          /* @__PURE__ */ jsx2("g", {}),
+          /* @__PURE__ */ jsx2("clipPath", { id: "38f6fcde47", children: /* @__PURE__ */ jsx2(
+            "path",
+            {
+              d: "M 0.339844 42 L 10 42 L 10 79 L 0.339844 79 Z M 0.339844 42 ",
+              clipRule: "nonzero"
+            }
+          ) }),
+          /* @__PURE__ */ jsx2("clipPath", { id: "af000f7256", children: /* @__PURE__ */ jsx2(
+            "path",
+            {
+              d: "M 64 23.925781 L 72.789062 23.925781 L 72.789062 96.378906 L 64 96.378906 Z M 64 23.925781 ",
+              clipRule: "nonzero"
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ jsx2("g", { fill: "currentColor", fillOpacity: "1", children: /* @__PURE__ */ jsx2("g", { transform: "translate(107.11969, 78.49768)", children: /* @__PURE__ */ jsx2("g", { children: /* @__PURE__ */ jsx2("path", { d: "M 10.078125 -25.046875 C 11.109375 -26.398438 12.507812 -27.535156 14.28125 -28.453125 C 16.0625 -29.378906 18.070312 -29.84375 20.3125 -29.84375 C 22.863281 -29.84375 25.195312 -29.210938 27.3125 -27.953125 C 29.425781 -26.691406 31.085938 -24.921875 32.296875 -22.640625 C 33.503906 -20.367188 34.109375 -17.757812 34.109375 -14.8125 C 34.109375 -11.863281 33.503906 -9.222656 32.296875 -6.890625 C 31.085938 -4.566406 29.425781 -2.753906 27.3125 -1.453125 C 25.195312 -0.160156 22.863281 0.484375 20.3125 0.484375 C 18.070312 0.484375 16.078125 0.03125 14.328125 -0.875 C 12.585938 -1.78125 11.171875 -2.910156 10.078125 -4.265625 L 10.078125 13.96875 L 4 13.96875 L 4 -29.359375 L 10.078125 -29.359375 Z M 27.921875 -14.8125 C 27.921875 -16.84375 27.503906 -18.59375 26.671875 -20.0625 C 25.835938 -21.539062 24.734375 -22.660156 23.359375 -23.421875 C 21.992188 -24.179688 20.53125 -24.5625 18.96875 -24.5625 C 17.445312 -24.5625 16 -24.171875 14.625 -23.390625 C 13.257812 -22.609375 12.160156 -21.472656 11.328125 -19.984375 C 10.492188 -18.492188 10.078125 -16.734375 10.078125 -14.703125 C 10.078125 -12.679688 10.492188 -10.914062 11.328125 -9.40625 C 12.160156 -7.894531 13.257812 -6.75 14.625 -5.96875 C 16 -5.1875 17.445312 -4.796875 18.96875 -4.796875 C 20.53125 -4.796875 21.992188 -5.191406 23.359375 -5.984375 C 24.734375 -6.785156 25.835938 -7.953125 26.671875 -9.484375 C 27.503906 -11.015625 27.921875 -12.789062 27.921875 -14.8125 Z M 27.921875 -14.8125 " }) }) }) }),
+        /* @__PURE__ */ jsx2("g", { fill: "currentColor", fillOpacity: "1", children: /* @__PURE__ */ jsx2("g", { transform: "translate(143.259256, 78.49768)", children: /* @__PURE__ */ jsx2("g", { children: /* @__PURE__ */ jsx2("path", { d: "M 30.4375 -29.359375 L 12.421875 13.796875 L 6.125 13.796875 L 12.09375 -0.484375 L 0.53125 -29.359375 L 7.296875 -29.359375 L 15.5625 -6.984375 L 24.140625 -29.359375 Z M 30.4375 -29.359375 " }) }) }) }),
+        /* @__PURE__ */ jsx2("g", { fill: "currentColor", fillOpacity: "1", children: /* @__PURE__ */ jsx2("g", { transform: "translate(174.281707, 78.49768)", children: /* @__PURE__ */ jsx2("g", { children: /* @__PURE__ */ jsx2("path", { d: "M 10.078125 -39.4375 L 10.078125 0 L 4 0 L 4 -39.4375 Z M 10.078125 -39.4375 " }) }) }) }),
+        /* @__PURE__ */ jsx2("g", { fill: "currentColor", fillOpacity: "1", children: /* @__PURE__ */ jsx2("g", { transform: "translate(188.353752, 78.49768)", children: /* @__PURE__ */ jsx2("g", { children: /* @__PURE__ */ jsx2("path", { d: "M 16.734375 0.484375 C 13.960938 0.484375 11.457031 -0.144531 9.21875 -1.40625 C 6.976562 -2.664062 5.21875 -4.441406 3.9375 -6.734375 C 2.664062 -9.035156 2.03125 -11.691406 2.03125 -14.703125 C 2.03125 -17.691406 2.6875 -20.335938 4 -22.640625 C 5.3125 -24.953125 7.101562 -26.726562 9.375 -27.96875 C 11.65625 -29.21875 14.195312 -29.84375 17 -29.84375 C 19.8125 -29.84375 22.351562 -29.21875 24.625 -27.96875 C 26.894531 -26.726562 28.6875 -24.953125 30 -22.640625 C 31.320312 -20.335938 31.984375 -17.691406 31.984375 -14.703125 C 31.984375 -11.722656 31.304688 -9.078125 29.953125 -6.765625 C 28.597656 -4.453125 26.757812 -2.664062 24.4375 -1.40625 C 22.113281 -0.144531 19.546875 0.484375 16.734375 0.484375 Z M 16.734375 -4.796875 C 18.296875 -4.796875 19.757812 -5.164062 21.125 -5.90625 C 22.5 -6.65625 23.613281 -7.773438 24.46875 -9.265625 C 25.320312 -10.765625 25.75 -12.578125 25.75 -14.703125 C 25.75 -16.835938 25.335938 -18.640625 24.515625 -20.109375 C 23.703125 -21.585938 22.617188 -22.695312 21.265625 -23.4375 C 19.910156 -24.1875 18.453125 -24.5625 16.890625 -24.5625 C 15.328125 -24.5625 13.878906 -24.1875 12.546875 -23.4375 C 11.210938 -22.695312 10.15625 -21.585938 9.375 -20.109375 C 8.59375 -18.640625 8.203125 -16.835938 8.203125 -14.703125 C 8.203125 -11.546875 9.007812 -9.101562 10.625 -7.375 C 12.25 -5.65625 14.285156 -4.796875 16.734375 -4.796875 Z M 16.734375 -4.796875 " }) }) }) }),
+        /* @__PURE__ */ jsx2("g", { fill: "currentColor", fillOpacity: "1", children: /* @__PURE__ */ jsx2("g", { transform: "translate(222.361196, 78.49768)", children: /* @__PURE__ */ jsx2("g", { children: /* @__PURE__ */ jsx2("path", { d: "M 18.8125 -29.84375 C 21.125 -29.84375 23.191406 -29.363281 25.015625 -28.40625 C 26.847656 -27.445312 28.28125 -26.023438 29.3125 -24.140625 C 30.34375 -22.253906 30.859375 -19.984375 30.859375 -17.328125 L 30.859375 0 L 24.84375 0 L 24.84375 -16.421875 C 24.84375 -19.046875 24.179688 -21.054688 22.859375 -22.453125 C 21.546875 -23.859375 19.753906 -24.5625 17.484375 -24.5625 C 15.210938 -24.5625 13.410156 -23.859375 12.078125 -22.453125 C 10.742188 -21.054688 10.078125 -19.046875 10.078125 -16.421875 L 10.078125 0 L 4 0 L 4 -29.359375 L 10.078125 -29.359375 L 10.078125 -26.015625 C 11.066406 -27.222656 12.332031 -28.160156 13.875 -28.828125 C 15.425781 -29.503906 17.070312 -29.84375 18.8125 -29.84375 Z M 18.8125 -29.84375 " }) }) }) }),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            fill: "currentColor",
+            d: "M 53.359375 31.652344 L 53.359375 88.6875 L 62.410156 90.859375 L 62.410156 29.484375 Z M 53.359375 31.652344 ",
+            fillOpacity: "1",
+            fillRule: "nonzero"
+          }
+        ),
+        /* @__PURE__ */ jsx2("g", { clipPath: "url(#38f6fcde47)", children: /* @__PURE__ */ jsx2(
+          "path",
+          {
+            fill: "currentColor",
+            d: "M 0.339844 47.433594 L 0.339844 72.910156 C 0.339844 73.34375 0.410156 73.769531 0.554688 74.179688 C 0.699219 74.59375 0.90625 74.96875 1.175781 75.3125 C 1.445312 75.65625 1.765625 75.945312 2.132812 76.179688 C 2.503906 76.414062 2.898438 76.582031 3.324219 76.683594 L 9.390625 78.140625 L 9.390625 42.195312 L 3.3125 43.660156 C 2.890625 43.761719 2.492188 43.929688 2.125 44.164062 C 1.761719 44.402344 1.441406 44.6875 1.171875 45.03125 C 0.902344 45.375 0.695312 45.75 0.554688 46.164062 C 0.410156 46.574219 0.339844 46.996094 0.339844 47.433594 Z M 0.339844 47.433594 ",
+            fillOpacity: "1",
+            fillRule: "nonzero"
+          }
+        ) }),
+        /* @__PURE__ */ jsx2("g", { clipPath: "url(#af000f7256)", children: /* @__PURE__ */ jsx2(
+          "path",
+          {
+            fill: "currentColor",
+            d: "M 64.996094 95.085938 L 64.996094 25.253906 C 64.996094 25.082031 65.027344 24.917969 65.09375 24.761719 C 65.160156 24.601562 65.253906 24.460938 65.375 24.339844 C 65.496094 24.21875 65.636719 24.125 65.792969 24.0625 C 65.953125 23.996094 66.117188 23.960938 66.289062 23.960938 L 71.460938 23.960938 C 71.632812 23.960938 71.796875 23.996094 71.957031 24.0625 C 72.113281 24.125 72.253906 24.21875 72.375 24.339844 C 72.496094 24.460938 72.589844 24.601562 72.65625 24.761719 C 72.722656 24.917969 72.753906 25.082031 72.753906 25.253906 L 72.753906 95.085938 C 72.753906 95.257812 72.722656 95.421875 72.65625 95.582031 C 72.589844 95.738281 72.496094 95.878906 72.375 96 C 72.253906 96.121094 72.113281 96.214844 71.957031 96.28125 C 71.796875 96.347656 71.632812 96.378906 71.460938 96.378906 L 66.289062 96.378906 C 66.117188 96.378906 65.953125 96.347656 65.792969 96.28125 C 65.636719 96.214844 65.496094 96.121094 65.375 96 C 65.253906 95.878906 65.160156 95.738281 65.09375 95.582031 C 65.027344 95.421875 64.996094 95.257812 64.996094 95.085938 Z M 64.996094 95.085938 ",
+            fillOpacity: "1",
+            fillRule: "nonzero"
+          }
+        ) }),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            fill: "currentColor",
+            d: "M 22.320312 81.238281 L 22.320312 39.101562 L 11.976562 41.585938 L 11.976562 78.757812 Z M 22.320312 81.238281 ",
+            fillOpacity: "1",
+            fillRule: "nonzero"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            fill: "currentColor",
+            d: "M 50.769531 88.066406 L 50.769531 32.277344 L 37.839844 35.378906 L 37.839844 84.960938 Z M 50.769531 88.066406 ",
+            fillOpacity: "1",
+            fillRule: "nonzero"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            fill: "currentColor",
+            d: "M 24.90625 81.863281 L 35.253906 84.34375 L 35.253906 35.996094 L 24.90625 38.480469 Z M 24.90625 81.863281 ",
+            fillOpacity: "1",
+            fillRule: "nonzero"
+          }
+        )
+      ]
+    }
+  );
+};
+var logo_default = Logo;
+
+// src/components/global-error-page.tsx
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+function GlobalError({ error }) {
+  useEffect(() => {
+    console.error("Global error:", error);
+  }, [error]);
+  const reset = () => {
+    window.location.reload();
+  };
+  return /* @__PURE__ */ jsxs2("html", { lang: "en", children: [
+    /* @__PURE__ */ jsxs2("head", { children: [
+      /* @__PURE__ */ jsx3("meta", { charSet: "utf-8" }),
+      /* @__PURE__ */ jsx3("meta", { name: "viewport", content: "width=device-width, initial-scale=1" }),
+      /* @__PURE__ */ jsx3(
+        "link",
+        {
+          rel: "stylesheet",
+          href: "/__pylon/static/pylon.css",
+          precedence: "high"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx3("body", { children: /* @__PURE__ */ jsx3("div", { className: "fixed inset-0 bg-black/90 z-50 overflow-y-auto p-4 flex items-center justify-center", children: /* @__PURE__ */ jsxs2("div", { className: "w-full max-w-3xl bg-black border border-red-600 rounded-lg overflow-hidden text-white font-sans", children: [
+      /* @__PURE__ */ jsx3("div", { className: "flex items-center justify-between border-b border-neutral-800 p-4", children: /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsx3("div", { className: "flex-shrink-0", children: /* @__PURE__ */ jsx3(logo_default, { className: "h-8 w-auto text-white" }) }),
+        /* @__PURE__ */ jsx3("div", { children: /* @__PURE__ */ jsx3("h1", { className: "text-xl font-medium text-red-500", children: "Application Crashed" }) })
+      ] }) }),
+      /* @__PURE__ */ jsxs2("div", { className: "p-4", children: [
+        /* @__PURE__ */ jsx3("div", { className: "mb-4 text-neutral-400", children: "The application encountered a critical error and could not continue." }),
+        /* @__PURE__ */ jsx3("h2", { className: "text-2xl font-bold mb-4 text-white", children: error.message || "A critical error occurred" }),
+        error.digest && /* @__PURE__ */ jsxs2("div", { className: "mb-4", children: [
+          /* @__PURE__ */ jsx3("h3", { className: "text-sm uppercase tracking-wider text-neutral-500 font-medium mb-2", children: "Error ID" }),
+          /* @__PURE__ */ jsx3("div", { className: "bg-neutral-900 rounded-md p-3 text-neutral-300 font-mono", children: error.digest })
+        ] })
+      ] })
+    ] }) }) })
+  ] });
+}
+
+// src/plugins/use-pages/setup/index.tsx
+import { tmpdir } from "os";
+import { pipeline } from "stream/promises";
+import { createHash } from "crypto";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var disableCacheMiddleware = async (c, next) => {
+  const env3 = getEnv();
+  if (env3.NODE_ENV === "development") {
+    c.header(
+      "Cache-Control",
+      "no-store, no-cache, must-revalidate, proxy-revalidate"
+    );
+    c.header("Pragma", "no-cache");
+    c.header("Expires", "0");
+    c.header("Surrogate-Control", "no-store");
+  }
+  return next();
+};
+var setup = (app2) => {
+  const pagesFilePath = path3.resolve(process.cwd(), ".pylon", "pages.json");
+  let pageRoutes = [];
+  try {
+    pageRoutes = JSON.parse(fs2.readFileSync(pagesFilePath, "utf-8"));
+  } catch (error) {
+    console.error("Error reading pages.json", error);
+  }
+  app2.use(trimTrailingSlash());
+  let App = void 0;
+  let client = void 0;
+  app2.on(
+    "GET",
+    pageRoutes.map((pageRoute) => pageRoute.slug),
+    disableCacheMiddleware,
+    async (c) => {
+      try {
+        if (!App) {
+          const module = await import(`${process.cwd()}/.pylon/__pylon/pages/app.js`);
+          App = module.default;
+        }
+        if (!client) {
+          client = await import(`${process.cwd()}/.pylon/client/index.js`);
+        }
+        const pageProps = {
+          params: c.req.param(),
+          searchParams: c.req.query(),
+          path: c.req.path
+        };
+        let cacheSnapshot = void 0;
+        try {
+          const prepared = await client.prepareReactRender(
+            /* @__PURE__ */ jsx4(
+              AppLoader,
+              {
+                Router: StaticRouter,
+                routerProps: {
+                  location: c.req.path
+                },
+                App,
+                client,
+                pylonData: {
+                  pageProps,
+                  cacheSnapshot: void 0
+                }
+              }
+            )
+          );
+          cacheSnapshot = prepared.cacheSnapshot;
+        } catch (error) {
+        }
+        if (reactServer.renderToReadableStream) {
+          try {
+            const stream = await reactServer.renderToReadableStream(
+              /* @__PURE__ */ jsx4(
+                AppLoader,
+                {
+                  Router: StaticRouter,
+                  routerProps: {
+                    location: c.req.path
+                  },
+                  App,
+                  client,
+                  pylonData: {
+                    pageProps,
+                    cacheSnapshot
+                  }
+                }
+              ),
+              {
+                bootstrapModules: ["/__pylon/static/app.js"],
+                bootstrapScriptContent: `window.__PYLON_DATA__ = ${JSON.stringify(
+                  {
+                    pageProps,
+                    cacheSnapshot
+                  }
+                )}`
+              }
+            );
+            return c.body(stream);
+          } catch (error) {
+            throw error;
+          }
+        } else if (reactServer.renderToPipeableStream) {
+          return await new Promise((resolve, reject) => {
+            const { pipe } = reactServer.renderToPipeableStream(
+              /* @__PURE__ */ jsx4(
+                AppLoader,
+                {
+                  Router: StaticRouter,
+                  routerProps: {
+                    location: c.req.path
+                  },
+                  App,
+                  client,
+                  pylonData: {
+                    pageProps,
+                    cacheSnapshot
+                  }
+                }
+              ),
+              {
+                bootstrapModules: ["/__pylon/static/app.js"],
+                bootstrapScriptContent: `window.__PYLON_DATA__ = ${JSON.stringify(
+                  {
+                    pageProps,
+                    cacheSnapshot
+                  }
+                )}`,
+                onShellReady: async () => {
+                  c.header("Content-Type", "text/html");
+                  const passThrough = new PassThrough();
+                  pipe(passThrough);
+                  resolve(c.body(Readable.toWeb(passThrough)));
+                },
+                onShellError: async (error) => {
+                  reject(error);
+                }
+              }
+            );
+          });
+        } else {
+          throw new Error("Environment not supported");
+        }
+      } catch (error) {
+        c.header("Content-Type", "text/html");
+        c.status(500);
+        return c.html(
+          reactServer.renderToString(/* @__PURE__ */ jsx4(GlobalError, { error }))
+        );
+      }
+    }
+  );
+  const publicFilesPath = path3.resolve(
+    process.cwd(),
+    ".pylon",
+    "__pylon",
+    "public"
+  );
+  let publicFiles = [];
+  try {
+    publicFiles = fs2.readdirSync(publicFilesPath);
+  } catch (error) {
+  }
+  app2.on(
+    "GET",
+    publicFiles.map((file) => `/${file}`),
+    disableCacheMiddleware,
+    async (c) => {
+      const publicFilePath = path3.resolve(
+        process.cwd(),
+        ".pylon",
+        "__pylon",
+        "public",
+        c.req.path.replace("/", "")
+      );
+      try {
+        await fs2.promises.access(publicFilePath);
+        if (publicFilePath.endsWith(".js")) {
+          c.res.headers.set("Content-Type", "text/javascript");
+        } else if (publicFilePath.endsWith(".css")) {
+          c.res.headers.set("Content-Type", "text/css");
+        } else if (publicFilePath.endsWith(".html")) {
+          c.res.headers.set("Content-Type", "text/html");
+        } else if (publicFilePath.endsWith(".json")) {
+          c.res.headers.set("Content-Type", "application/json");
+        } else if (publicFilePath.endsWith(".png")) {
+          c.res.headers.set("Content-Type", "image/png");
+        } else if (publicFilePath.endsWith(".jpg") || publicFilePath.endsWith(".jpeg")) {
+          c.res.headers.set("Content-Type", "image/jpeg");
+        } else if (publicFilePath.endsWith(".gif")) {
+          c.res.headers.set("Content-Type", "image/gif");
+        } else if (publicFilePath.endsWith(".svg")) {
+          c.res.headers.set("Content-Type", "image/svg+xml");
+        } else if (publicFilePath.endsWith(".ico")) {
+          c.res.headers.set("Content-Type", "image/x-icon");
+        } else if (publicFilePath.endsWith(".map")) {
+          c.res.headers.set("Content-Type", "application/json");
+        }
+        const stream = fs2.createReadStream(publicFilePath);
+        const webStream = Readable.toWeb(stream);
+        return c.body(webStream);
+      } catch {
+        return c.status(404);
+      }
+    }
+  );
+  app2.get("/__pylon/static/*", disableCacheMiddleware, async (c) => {
+    const filePath = path3.resolve(
+      process.cwd(),
+      ".pylon",
+      "__pylon",
+      "static",
+      c.req.path.replace("/__pylon/static/", "")
+    );
+    if (!fs2.existsSync(filePath)) {
+      return c.notFound();
+    }
+    if (filePath.endsWith(".js")) {
+      c.res.headers.set("Content-Type", "text/javascript");
+    } else if (filePath.endsWith(".css")) {
+      c.res.headers.set("Content-Type", "text/css");
+    } else if (filePath.endsWith(".html")) {
+      c.res.headers.set("Content-Type", "text/html");
+    } else if (filePath.endsWith(".json") || filePath.endsWith(".map")) {
+      c.res.headers.set("Content-Type", "application/json");
+    } else if (filePath.endsWith(".png")) {
+      c.res.headers.set("Content-Type", "image/png");
+    } else if (filePath.endsWith(".jpg") || filePath.endsWith(".jpeg")) {
+      c.res.headers.set("Content-Type", "image/jpeg");
+    } else if (filePath.endsWith(".gif")) {
+      c.res.headers.set("Content-Type", "image/gif");
+    } else if (filePath.endsWith(".svg")) {
+      c.res.headers.set("Content-Type", "image/svg+xml");
+    } else if (filePath.endsWith(".ico")) {
+      c.res.headers.set("Content-Type", "image/x-icon");
+    }
+    const stream = fs2.createReadStream(filePath);
+    const webStream = Readable.toWeb(stream);
+    return c.body(webStream);
+  });
+  app2.get("/__pylon/image", async (c) => {
+    try {
+      let isSupportedFormat2 = function(format2) {
+        const supportedFormats = sharp.format;
+        return Object.keys(supportedFormats).includes(format2);
+      };
+      var isSupportedFormat = isSupportedFormat2;
+      const sharp = (await import("sharp")).default;
+      const { src, w, h, q = "75", format = "webp" } = c.req.query();
+      const queryStringHash = createHash("sha256").update(JSON.stringify(c.req.query())).digest("hex");
+      if (!src) {
+        return c.json({ error: "Missing parameters." }, 400);
+      }
+      let imagePath = path3.join(process.cwd(), ".pylon", src);
+      if (src.startsWith("http://") || src.startsWith("https://")) {
+        imagePath = await downloadImage(src);
+      }
+      try {
+        await fs2.promises.access(imagePath);
+      } catch {
+        return c.json({ error: "Image not found" }, 404);
+      }
+      const metadata = await sharp(imagePath).metadata();
+      if (!metadata.width || !metadata.height) {
+        return c.json(
+          {
+            error: "Invalid image metadata. Width and height are required for resizing."
+          },
+          400
+        );
+      }
+      const { width: finalWidth, height: finalHeight } = calculateDimensions(
+        metadata.width,
+        metadata.height,
+        w ? parseInt(w) : void 0,
+        h ? parseInt(h) : void 0
+      );
+      const cachePath = path3.join(IMAGE_CACHE_DIR, queryStringHash);
+      let imageFormat = format.toLowerCase();
+      if (!isSupportedFormat2(imageFormat)) {
+        throw new Error("Unsupported image format");
+      }
+      const quality = parseInt(q);
+      if (IS_IMAGE_CACHE_POSSIBLE) {
+        const image = await sharp(imagePath).resize(finalWidth, finalHeight).toFormat(imageFormat, {
+          quality
+        }).toFile(cachePath);
+        c.res.headers.set("Content-Type", getContentType(image.format));
+        return c.body(
+          Readable.toWeb(
+            fs2.createReadStream(cachePath)
+          )
+        );
+      } else {
+        const image = await sharp(imagePath).resize(finalWidth, finalHeight).toFormat(imageFormat, {
+          quality
+        }).toBuffer({ resolveWithObject: true });
+        c.res.headers.set("Content-Type", getContentType(image.info.format));
+        return c.body(image.data);
+      }
+    } catch (error) {
+      console.error("Error processing the image:", error);
+      return c.json({ error: "Error processing the image" }, 500);
+    }
+  });
+};
+var IMAGE_CACHE_DIR = path3.join(process.cwd(), ".cache/__pylon/images");
+var IS_IMAGE_CACHE_POSSIBLE = true;
+try {
+  await fs2.promises.mkdir(IMAGE_CACHE_DIR, { recursive: true });
+} catch (error) {
+  IS_IMAGE_CACHE_POSSIBLE = false;
+}
+var calculateDimensions = (originalWidth, originalHeight, width, height) => {
+  if (!width && !height) {
+    return { width: originalWidth, height: originalHeight };
+  }
+  if (width && !height) {
+    height = Math.round(width * originalHeight / originalWidth);
+  } else if (height && !width) {
+    width = Math.round(height * originalWidth / originalHeight);
+  }
+  return { width, height };
+};
+var getContentType = (format) => {
+  switch (format.toLowerCase()) {
+    case "webp":
+      return "image/webp";
+    case "jpeg":
+    case "jpg":
+      return "image/jpeg";
+    case "png":
+      return "image/png";
+    case "gif":
+      return "image/gif";
+    case "svg":
+      return "image/svg+xml";
+    default:
+      return "application/octet-stream";
+  }
+};
+var downloadImage = async (url) => {
+  const response = await fetch(url);
+  if (!response.ok)
+    throw new Error(`Failed to download image: ${response.statusText}`);
+  const ext = path3.extname(new URL(url).pathname) || ".jpg";
+  const tempFilePath = path3.join(tmpdir(), `image-${Date.now()}${ext}`);
+  const fileStream = fs2.createWriteStream(tempFilePath);
+  await pipeline(response.body, fileStream);
+  return tempFilePath;
+};
+
+// src/plugins/use-pages/build/index.ts
+import path7 from "path";
+
+// src/plugins/use-pages/build/app-utils.ts
+import path4 from "path";
+import glob from "tiny-glob";
+function fnv1aHash(str) {
+  let hash = 2166136261;
+  for (let i = 0; i < str.length; i++) {
+    hash ^= str.charCodeAt(i);
+    hash += (hash << 1) + (hash << 4) + (hash << 7) + (hash << 8) + (hash << 24);
+  }
+  return (hash >>> 0).toString(16);
+}
+var APP_DIR = path4.join(process.cwd(), "pages");
+async function getPageRoutes(dir = APP_DIR) {
+  const routes = [];
+  const pagePattern = path4.join(dir, "**/page.{ts,tsx,js}");
+  const layoutPattern = path4.join(dir, "**/layout.tsx");
+  const pageFiles = await glob(pagePattern);
+  const layoutFiles = await glob(layoutPattern);
+  for (const pagePath of pageFiles) {
+    const relativePagePath = path4.relative(APP_DIR, pagePath);
+    let slug = "/" + relativePagePath.replace(/page\.(ts|tsx|js)$/, "").replace(/\[([\w-]+)\]/g, ":$1");
+    slug = slug.replace(/\/$/, "");
+    const layouts = layoutFiles.filter((layout) => {
+      return pagePath.startsWith(layout.replace("layout.tsx", ""));
+    });
+    const layoutsWithoutRootLayout = layouts.slice(1);
+    routes.push({
+      pagePath,
+      slug: slug || "/",
+      layouts: layoutsWithoutRootLayout
+    });
+  }
+  return routes;
+}
+var generateAppFile = (pageRoutes) => {
+  const makePageMap = (routes) => {
+    const pageMap2 = {};
+    for (const route of routes) {
+      pageMap2[route.pagePath] = `Page${fnv1aHash(route.pagePath)}`;
+    }
+    return pageMap2;
+  };
+  const makeLayoutMap = (routes) => {
+    const layoutMap2 = {};
+    for (const route of routes) {
+      for (const layout of route.layouts) {
+        layoutMap2[layout] = `Layout${fnv1aHash(layout)}`;
+      }
+    }
+    return layoutMap2;
+  };
+  const pageMap = makePageMap(pageRoutes);
+  const layoutMap = makeLayoutMap(pageRoutes);
+  const importPages = Object.keys(pageMap).map((pagePath, index) => {
+    const importLocation = `../${pagePath}`.replace(".tsx", ".js");
+    const componentName = pageMap[pagePath];
+    return `const ${componentName} = lazy(() => import('${importLocation}'))
+      `;
+  }).join("\n");
+  const importLayouts = Object.keys(layoutMap).map((layoutPath, index) => {
+    const importLocation = `../${layoutPath}`.replace(".tsx", ".js");
+    const componentName = layoutMap[layoutPath];
+    return `const ${componentName} = lazy(() => import('${importLocation}'))
+      `;
+  }).join("\n");
+  const appComponent = `"use client";
+  import {lazy, Suspense} from 'react'
+ import { __PYLON_ROUTER_INTERNALS_DO_NOT_USE, DevOverlay} from '@getcronit/pylon/pages';
+   const {Routes, Route} = __PYLON_ROUTER_INTERNALS_DO_NOT_USE
+  ${importPages}
+  const RootLayout = lazy(() => import('../pages/layout.js'))
+  ${importLayouts}
+  
+  const App: React.FC<{pageProps: any}> = ({pageProps}) => (
+  <DevOverlay>
+  <RootLayout>
+      <meta charSet="utf-8" />
+      <meta name="viewport" content="width=device-width, initial-scale=1" />
+      <link rel="stylesheet" href="/__pylon/static/app.css" precedence="high" />
+         <Routes>
+        ${pageRoutes.map((route, index) => {
+    return `<Route key={${index}} index={${index === 0 ? "true" : "false"}} path="${route.slug}" element={
+            ${route.layouts.reduceRight((child, layoutPath, layoutIndex) => {
+      const layoutName = layoutMap[layoutPath];
+      return `<${layoutName}>${child}</${layoutName}>`;
+    }, `<${pageMap[route.pagePath]} {...pageProps} />`)}
+       } />`;
+  }).join("\n")}
+    </Routes>
+    </RootLayout>
+    </DevOverlay>
+  );
+  
+  export default App;
+    `;
+  return appComponent;
+};
+
+// src/plugins/use-pages/build/index.ts
+import chokidar from "chokidar";
+import fs6 from "fs/promises";
+import esbuild from "esbuild";
+
+// src/plugins/use-pages/build/plugins/inject-app-hydration.ts
+import path5 from "path";
+import fs3 from "fs/promises";
+var injectAppHydrationPlugin = {
+  name: "inject-hydration",
+  setup(build2) {
+    build2.onLoad({ filter: /.*/, namespace: "file" }, async (args) => {
+      if (args.path === path5.resolve(process.cwd(), ".pylon", "app.tsx")) {
+        let contents = await fs3.readFile(args.path, "utf-8");
+        const clientPath = path5.resolve(process.cwd(), ".pylon/client");
+        const pathToClient = path5.relative(path5.dirname(args.path), clientPath);
+        contents += `
+          import {hydrateRoot} from 'react-dom/client'
+          import * as client from './${pathToClient}'
+          import { __PYLON_ROUTER_INTERNALS_DO_NOT_USE, DevOverlay, onCaughtErrorProd, onRecoverableErrorProd, onUncaughtErrorProd } from '@getcronit/pylon/pages';
+          const {BrowserRouter} = __PYLON_ROUTER_INTERNALS_DO_NOT_USE
+          import React, {useMemo} from 'react'
+
+          const pylonData = window.__PYLON_DATA__
+
+          const AppLoader = (props: {
+            client: any
+            pylonData: {
+              pageProps: Omit<PageProps, 'data'>
+              cacheSnapshot?: any
+            }
+            App: React.FC<{
+              pageProps: PageProps
+            }>
+            Router: React.FC<any>
+            routerProps: any
+          }) => {
+            props.client.useHydrateCache({cacheSnapshot: props.pylonData.cacheSnapshot})
+          
+            const data = props.client.useQuery()
+            const page = useMemo(() => {
+              const page = (
+                <props.App
+                  pageProps={{
+                    ...props.pylonData.pageProps,
+                    data
+                  }}
+                />
+              )
+          
+              return page
+            }, [props])
+          
+            return <props.Router {...props.routerProps}>{page}</props.Router>
+          }
+
+        
+          
+
+          hydrateRoot(
+          document,
+            <AppLoader Router={BrowserRouter} client={client} pylonData={pylonData} App={App} />, {
+                  onCaughtError: onCaughtErrorProd,
+      onRecoverableError: onRecoverableErrorProd,
+      onUncaughtError: onUncaughtErrorProd,
+            }
+          )
+          `;
+        return {
+          loader: "tsx",
+          contents
+        };
+      }
+    });
+  }
+};
+
+// src/plugins/use-pages/build/plugins/image-plugin.ts
+import { createHash as createHash2 } from "crypto";
+import path6 from "path";
+import fs4 from "fs/promises";
+var imagePlugin = {
+  name: "image-plugin",
+  setup(build2) {
+    const outdir = build2.initialOptions.outdir;
+    const publicPath = build2.initialOptions.publicPath;
+    if (!outdir || !publicPath) {
+      throw new Error("outdir and publicPath must be set in esbuild options");
+    }
+    build2.onResolve({ filter: /\.(png|jpe?g)$/ }, async (args) => {
+      const filePath = path6.resolve(args.resolveDir, args.path);
+      const fileName = path6.basename(filePath);
+      const extname = path6.extname(filePath);
+      const hash = createHash2("md5").update(filePath + await fs4.readFile(filePath)).digest("hex").slice(0, 8);
+      const newFilename = `${fileName}-${hash}${extname}`;
+      const newFilePath = path6.join(outdir, "media", newFilename);
+      await fs4.mkdir(path6.dirname(newFilePath), { recursive: true });
+      await fs4.copyFile(filePath, newFilePath);
+      return {
+        path: newFilePath,
+        namespace: "image"
+      };
+    });
+    build2.onLoad({ filter: /\.png$|\.jpg$/ }, async (args) => {
+      const sharp = (await import("sharp")).default;
+      const image = sharp(args.path);
+      const metadata = await image.metadata();
+      const url = `${publicPath}/media/${path6.basename(args.path)}`;
+      const searchParams = new URLSearchParams({});
+      if (metadata.width) {
+        searchParams.set("w", metadata.width.toString());
+      }
+      if (metadata.height) {
+        searchParams.set("h", metadata.height.toString());
+      }
+      const output = image.resize({
+        width: Math.min(metadata.width ?? 16, 16),
+        height: Math.min(metadata.height ?? 16, 16),
+        fit: "inside"
+      }).toFormat("webp", {
+        quality: 20,
+        alphaQuality: 20,
+        smartSubsample: true
+      });
+      const { data, info } = await output.toBuffer({ resolveWithObject: true });
+      const dataURIBase64 = `data:image/${info.format};base64,${data.toString(
+        "base64"
+      )}`;
+      if (dataURIBase64) {
+        searchParams.set("blurDataURL", dataURIBase64);
+      }
+      return {
+        contents: `${url}?${searchParams.toString()}`,
+        loader: "text"
+      };
+    });
+  }
+};
+
+// src/plugins/use-pages/build/plugins/postcss-plugin.ts
+import fs5 from "fs/promises";
+import loadConfig from "postcss-load-config";
+import postcss from "postcss";
+var postcssPlugin = {
+  name: "postcss-plugin",
+  setup(build2) {
+    build2.onLoad({ filter: /.css$/, namespace: "file" }, async (args) => {
+      const { plugins, options } = await loadConfig();
+      const css = await fs5.readFile(args.path, "utf-8");
+      const result = await postcss(plugins).process(css, {
+        ...options,
+        from: args.path
+      }).then((result2) => result2);
+      return {
+        contents: result.css,
+        loader: "css"
+      };
+    });
+  }
+};
+
+// src/plugins/use-pages/build/index.ts
+var DIST_STATIC_DIR = path7.join(process.cwd(), ".pylon/__pylon/static");
+var DIST_PAGES_DIR = path7.join(process.cwd(), ".pylon/__pylon/pages");
+async function updateFileIfChanged(path8, newContent) {
+  try {
+    const currentContent = await fs6.readFile(path8, "utf8");
+    if (currentContent === newContent) {
+      return false;
+    }
+  } catch (err) {
+    if (err.code !== "ENOENT") throw err;
+  }
+  await fs6.writeFile(path8, newContent, "utf8");
+  return true;
+}
+var build = async () => {
+  const buildAppFile = async () => {
+    const pagesRoutes = await getPageRoutes();
+    const appContent = generateAppFile(pagesRoutes);
+    const pagesFile = path7.resolve(process.cwd(), ".pylon", "pages.json");
+    await updateFileIfChanged(pagesFile, JSON.stringify(pagesRoutes, null, 2));
+    const appFilePath = path7.resolve(process.cwd(), ".pylon", "app.tsx");
+    const state = await updateFileIfChanged(appFilePath, appContent);
+    if (state) {
+    }
+  };
+  const copyPublicDir = async () => {
+    const publicDir = path7.resolve(process.cwd(), "public");
+    const pylonPublicDir = path7.resolve(
+      process.cwd(),
+      ".pylon",
+      "__pylon",
+      "public"
+    );
+    try {
+      await fs6.access(publicDir);
+      await fs6.mkdir(pylonPublicDir, { recursive: true });
+      await fs6.cp(publicDir, pylonPublicDir, { recursive: true });
+    } catch (err) {
+      if (err.code !== "ENOENT") throw err;
+    }
+  };
+  const copyPylonCSS = async () => {
+    const pylonCssPathDir = path7.join(
+      process.cwd(),
+      "node_modules",
+      "@getcronit/pylon",
+      "node_modules",
+      "@getcronit/pylon-pages/dist/browser"
+    );
+    const pylonCssDestDir = path7.join(
+      process.cwd(),
+      ".pylon",
+      "__pylon",
+      "static"
+    );
+    await fs6.mkdir(pylonCssDestDir, { recursive: true });
+    await fs6.cp(
+      path7.join(pylonCssPathDir, "index.css"),
+      path7.join(pylonCssDestDir, "pylon.css")
+    );
+    await fs6.cp(
+      path7.join(pylonCssPathDir, "index.css.map"),
+      path7.join(pylonCssDestDir, "pylon.css.map")
+    );
+  };
+  const writeOnEndPlugin = {
+    name: "write-on-end",
+    setup(build2) {
+      build2.onEnd(async (result) => {
+        await Promise.all(
+          result.outputFiles.map(async (file) => {
+            await fs6.mkdir(path7.dirname(file.path), { recursive: true });
+            await updateFileIfChanged(file.path, file.text);
+          })
+        );
+      });
+    }
+  };
+  const nodePaths = [
+    path7.join(process.cwd(), "node_modules"),
+    path7.join(process.cwd(), "node_modules", "@getcronit/pylon/node_modules")
+  ];
+  let pagesWatcher = null;
+  const clientCtx = await esbuild.context({
+    sourcemap: "linked",
+    write: false,
+    metafile: true,
+    nodePaths,
+    absWorkingDir: process.cwd(),
+    plugins: [
+      injectAppHydrationPlugin,
+      imagePlugin,
+      postcssPlugin,
+      writeOnEndPlugin
+    ],
+    publicPath: "/__pylon/static",
+    assetNames: "assets/[name]-[hash]",
+    chunkNames: "chunks/[name]-[hash]",
+    format: "esm",
+    platform: "browser",
+    entryPoints: [".pylon/app.tsx"],
+    outdir: DIST_STATIC_DIR,
+    bundle: true,
+    splitting: true,
+    minify: false,
+    loader: {
+      // Map file extensions to the file loader
+      ".svg": "file",
+      ".woff": "file",
+      ".woff2": "file"
+    },
+    define: {
+      "process.env.NODE_ENV": JSON.stringify(
+        process.env.NODE_ENV || "development"
+      )
+    },
+    mainFields: ["browser", "module", "main"]
+  });
+  const serverCtx = await esbuild.context({
+    sourcemap: "inline",
+    write: false,
+    absWorkingDir: process.cwd(),
+    nodePaths,
+    plugins: [imagePlugin, postcssPlugin, writeOnEndPlugin],
+    publicPath: "/__pylon/static",
+    assetNames: "assets/[name]-[hash]",
+    chunkNames: "chunks/[name]-[hash]",
+    format: "esm",
+    platform: "node",
+    entryPoints: [".pylon/app.tsx"],
+    outdir: DIST_PAGES_DIR,
+    bundle: true,
+    splitting: false,
+    external: [
+      "@getcronit/pylon",
+      "@getcronit/pylon-pages",
+      "react",
+      "react-dom",
+      "gqty",
+      "@gqty/react"
+    ],
+    minify: true,
+    loader: {
+      // Map file extensions to the file loader
+      ".svg": "file",
+      ".woff": "file",
+      ".woff2": "file"
+    },
+    define: {
+      "process.env.NODE_ENV": JSON.stringify(
+        process.env.NODE_ENV || "development"
+      )
+    },
+    mainFields: ["module", "main"]
+  });
+  return {
+    watch: async () => {
+      pagesWatcher = chokidar.watch("pages", { ignoreInitial: true });
+      pagesWatcher.on("all", async (event, path8) => {
+        if (["add", "change", "unlink"].includes(event)) {
+          await buildAppFile();
+          await copyPublicDir();
+          await copyPylonCSS();
+        }
+      });
+      await Promise.all([clientCtx.watch(), serverCtx.watch()]);
+    },
+    dispose: async () => {
+      if (pagesWatcher) {
+        pagesWatcher.close();
+      }
+      Promise.all([clientCtx.dispose(), serverCtx.dispose()]);
+    },
+    rebuild: async () => {
+      await buildAppFile();
+      await copyPublicDir();
+      await copyPylonCSS();
+      await Promise.all([clientCtx.rebuild(), serverCtx.rebuild()]);
+      return {};
+    },
+    cancel: async () => {
+      if (pagesWatcher) {
+        await pagesWatcher.close();
+      }
+      await Promise.all([clientCtx.cancel(), serverCtx.cancel()]);
+    }
+  };
+};
+
+// src/plugins/use-pages/index.ts
+function usePages() {
+  return {
+    setup,
+    build
+  };
+}
 export {
   ServiceError,
   app,