frontend-hamroun 1.2.27 → 1.2.29

package/templates/fullstack-app/build/main.js

@@ -0,0 +1,682 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __glob = (map) => (path) => {
+  var fn = map[path];
+  if (fn)
+    return fn();
+  throw new Error("Module not found in bundle: " + path);
+};
+var __esm = (fn, res) => function __init() {
+  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+
+// node_modules/frontend-hamroun/dist/index.mjs
+function batchUpdates(fn) {
+  if (isBatching) {
+    queue.push(fn);
+    return;
+  }
+  isBatching = true;
+  try {
+    fn();
+    while (queue.length > 0) {
+      const nextFn = queue.shift();
+      nextFn == null ? void 0 : nextFn();
+    }
+  } finally {
+    isBatching = false;
+  }
+}
+function setRenderCallback(callback, element, container) {
+  globalRenderCallback = callback;
+  globalContainer = container;
+  currentElement = element;
+}
+function prepareRender() {
+  currentRender++;
+  stateIndices.set(currentRender, 0);
+  return currentRender;
+}
+function finishRender() {
+  if (isServer) {
+    serverStates.delete(currentRender);
+  }
+  currentRender = 0;
+}
+function jsx(type, props) {
+  console.log("JSX Transform:", { type, props });
+  const processedProps = { ...props };
+  if (arguments.length > 2) {
+    processedProps.children = Array.prototype.slice.call(arguments, 2);
+  }
+  return { type, props: processedProps };
+}
+async function createElement(vnode) {
+  var _a;
+  console.log("Creating element from:", vnode);
+  if (vnode == null) {
+    return document.createTextNode("");
+  }
+  if (typeof vnode === "boolean") {
+    return document.createTextNode("");
+  }
+  if (typeof vnode === "number" || typeof vnode === "string") {
+    return document.createTextNode(String(vnode));
+  }
+  if (Array.isArray(vnode)) {
+    const fragment = document.createDocumentFragment();
+    for (const child of vnode) {
+      const node = await createElement(child);
+      fragment.appendChild(node);
+    }
+    return fragment;
+  }
+  if ("type" in vnode && vnode.props !== void 0) {
+    const { type, props } = vnode;
+    if (typeof type === "function") {
+      try {
+        const result = await type(props || {});
+        const node = await createElement(result);
+        if (node instanceof Element) {
+          node.setAttribute("data-component-id", type.name || type.toString());
+        }
+        return node;
+      } catch (error) {
+        console.error("Error rendering component:", error);
+        return document.createTextNode("");
+      }
+    }
+    const element = document.createElement(type);
+    for (const [key, value] of Object.entries(props || {})) {
+      if (key === "children")
+        continue;
+      if (key.startsWith("on") && typeof value === "function") {
+        const eventName = key.toLowerCase().slice(2);
+        const existingHandler = (_a = element.__events) == null ? void 0 : _a[eventName];
+        if (existingHandler) {
+          element.removeEventListener(eventName, existingHandler);
+        }
+        element.addEventListener(eventName, value);
+        if (!element.__events) {
+          element.__events = {};
+        }
+        element.__events[eventName] = value;
+      } else if (key === "style" && typeof value === "object") {
+        Object.assign(element.style, value);
+      } else if (key === "className") {
+        element.setAttribute("class", String(value));
+      } else if (key !== "key" && key !== "ref") {
+        element.setAttribute(key, String(value));
+      }
+    }
+    const children = props == null ? void 0 : props.children;
+    if (children != null) {
+      const childArray = Array.isArray(children) ? children.flat() : [children];
+      for (const child of childArray) {
+        const childNode = await createElement(child);
+        element.appendChild(childNode);
+      }
+    }
+    return element;
+  }
+  return document.createTextNode(String(vnode));
+}
+async function hydrate(element, container) {
+  isHydrating = true;
+  try {
+    await render(element, container);
+  } finally {
+    isHydrating = false;
+  }
+}
+async function render(element, container) {
+  console.log("Rendering to:", container.id);
+  batchUpdates(async () => {
+    const rendererId = prepareRender();
+    try {
+      setRenderCallback(render, element, container);
+      const domNode = await createElement(element);
+      if (!isHydrating) {
+        container.innerHTML = "";
+      }
+      container.appendChild(domNode);
+    } finally {
+      finishRender();
+    }
+  });
+}
+var isBatching, queue, currentRender, stateIndices, globalRenderCallback, globalContainer, currentElement, isServer, serverStates, isHydrating;
+var init_dist = __esm({
+  "node_modules/frontend-hamroun/dist/index.mjs"() {
+    isBatching = false;
+    queue = [];
+    currentRender = 0;
+    stateIndices = /* @__PURE__ */ new Map();
+    globalRenderCallback = null;
+    globalContainer = null;
+    currentElement = null;
+    isServer = typeof window === "undefined";
+    serverStates = /* @__PURE__ */ new Map();
+    isHydrating = false;
+  }
+});
+
+// src/config.ts
+var AppConfig, config_default;
+var init_config = __esm({
+  "src/config.ts"() {
+    "use strict";
+    AppConfig = {
+      // App information
+      title: "Frontend Hamroun App",
+      description: "A full-stack application built with Frontend Hamroun",
+      // Navigation
+      navigation: [
+        { path: "/", label: "Home" },
+        { path: "/about", label: "About" },
+        { path: "/users", label: "Users" }
+      ],
+      // API endpoints
+      api: {
+        baseUrl: "/api",
+        endpoints: {
+          users: "/users",
+          posts: "/posts"
+        }
+      },
+      // Default meta tags
+      meta: {
+        viewport: "width=device-width, initial-scale=1.0",
+        charset: "UTF-8",
+        author: "Your Name",
+        keywords: "frontend-hamroun, fullstack, template"
+      },
+      // Style customization
+      theme: {
+        primaryColor: "#0066cc",
+        backgroundColor: "#ffffff",
+        textColor: "#333333",
+        fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif'
+      }
+    };
+    config_default = AppConfig;
+  }
+});
+
+// src/components/Layout.tsx
+function Layout({ children, title = config_default.title, showNavigation = true }) {
+  const { navigation } = config_default;
+  return /* @__PURE__ */ jsx("div", { className: "container mx-auto px-4 py-8 max-w-5xl" }, /* @__PURE__ */ jsx("header", { className: "mb-8" }, /* @__PURE__ */ jsx("h1", { className: "text-4xl font-bold text-gray-800 mb-4" }, title), showNavigation && /* @__PURE__ */ jsx("nav", { className: "mb-6" }, /* @__PURE__ */ jsx("ul", { className: "flex space-x-6" }, navigation.map((item) => /* @__PURE__ */ jsx("li", { key: item.path }, /* @__PURE__ */ jsx(
+    "a",
+    {
+      href: item.path,
+      className: "text-blue-600 hover:text-blue-800 hover:underline transition-colors font-medium"
+    },
+    item.label
+  )))))), /* @__PURE__ */ jsx("main", { className: "min-h-[50vh]" }, children), /* @__PURE__ */ jsx("footer", { className: "mt-12 pt-6 border-t border-gray-200 text-gray-600 text-sm" }, /* @__PURE__ */ jsx("p", null, config_default.title, " \xA9 ", (/* @__PURE__ */ new Date()).getFullYear())));
+}
+var init_Layout = __esm({
+  "src/components/Layout.tsx"() {
+    "use strict";
+    init_dist();
+    init_config();
+  }
+});
+
+// src/pages/about/index.tsx
+var about_exports = {};
+__export(about_exports, {
+  default: () => about_default
+});
+var AboutPage, about_default;
+var init_about = __esm({
+  "src/pages/about/index.tsx"() {
+    "use strict";
+    init_dist();
+    init_Layout();
+    AboutPage = ({ initialState: initialState2 }) => {
+      return /* @__PURE__ */ jsx(Layout, { title: "About This App" }, /* @__PURE__ */ jsx("div", { className: "max-w-4xl mx-auto bg-white shadow-lg rounded-lg overflow-hidden" }, /* @__PURE__ */ jsx("div", { className: "p-8" }, /* @__PURE__ */ jsx("p", { className: "text-lg text-gray-700 mb-6" }, "This is a frontend application built with Frontend Hamroun framework and styled with Tailwind CSS."), /* @__PURE__ */ jsx("p", { className: "text-gray-600 mb-8" }, "It features server-side rendering, client-side navigation, and websocket-based live reloading during development."), /* @__PURE__ */ jsx("div", { className: "bg-gray-50 p-6 rounded-lg border border-gray-200 mb-8" }, /* @__PURE__ */ jsx("h2", { className: "text-xl font-semibold text-gray-800 mb-4" }, "Key Features"), /* @__PURE__ */ jsx("ul", { className: "space-y-2 text-gray-700" }, /* @__PURE__ */ jsx("li", { className: "flex items-center" }, /* @__PURE__ */ jsx("svg", { className: "w-5 h-5 text-green-500 mr-2", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M5 13l4 4L19 7" })), "Server-side rendering"), /* @__PURE__ */ jsx("li", { className: "flex items-center" }, /* @__PURE__ */ jsx("svg", { className: "w-5 h-5 text-green-500 mr-2", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M5 13l4 4L19 7" })), "Client-side navigation"), /* @__PURE__ */ jsx("li", { className: "flex items-center" }, /* @__PURE__ */ jsx("svg", { className: "w-5 h-5 text-green-500 mr-2", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M5 13l4 4L19 7" })), "Component-based architecture"), /* @__PURE__ */ jsx("li", { className: "flex items-center" }, /* @__PURE__ */ jsx("svg", { className: "w-5 h-5 text-green-500 mr-2", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M5 13l4 4L19 7" })), "Integrated API backend"), /* @__PURE__ */ jsx("li", { className: "flex items-center" }, /* @__PURE__ */ jsx("svg", { className: "w-5 h-5 text-green-500 mr-2", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M5 13l4 4L19 7" })), "Live reload during development"), /* @__PURE__ */ jsx("li", { className: "flex items-center" }, /* @__PURE__ */ jsx("svg", { className: "w-5 h-5 text-green-500 mr-2", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M5 13l4 4L19 7" })), "Tailwind CSS for styling"))), /* @__PURE__ */ jsx("a", { href: "/", className: "inline-block px-6 py-3 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 transition-colors" }, "Back to Home"))));
+    };
+    about_default = AboutPage;
+  }
+});
+
+// src/components/UserList.tsx
+var UserList, UserList_default;
+var init_UserList = __esm({
+  "src/components/UserList.tsx"() {
+    "use strict";
+    init_dist();
+    UserList = ({ users }) => {
+      if (!users || users.length === 0) {
+        return /* @__PURE__ */ jsx("div", { className: "p-4 bg-gray-50 rounded-lg border border-gray-200 my-4" }, /* @__PURE__ */ jsx("p", { className: "text-gray-500 italic" }, "No users found or still loading..."));
+      }
+      return /* @__PURE__ */ jsx("div", { className: "rounded-lg overflow-hidden my-4" }, /* @__PURE__ */ jsx("h3", { className: "text-lg font-medium mb-3" }, "Users (", users.length, ")"), /* @__PURE__ */ jsx("ul", { className: "divide-y divide-gray-200 border border-gray-200 rounded-lg overflow-hidden" }, users.map((user) => /* @__PURE__ */ jsx("li", { key: user.id, className: "flex justify-between items-center p-4 hover:bg-gray-50" }, /* @__PURE__ */ jsx("span", { className: "font-medium text-gray-800" }, user.name), /* @__PURE__ */ jsx("span", { className: "text-gray-500 text-sm" }, user.email)))));
+    };
+    UserList_default = UserList;
+  }
+});
+
+// src/data/api.ts
+async function fetchApi(endpoint, options = {}) {
+  const url = endpoint.startsWith("/") ? `/api${endpoint}` : `/api/${endpoint}`;
+  try {
+    console.log(`[API] Fetching data from: ${url}`);
+    const response = await fetch(url, {
+      headers: {
+        "Content-Type": "application/json",
+        "Accept": "application/json"
+      },
+      ...options
+    });
+    if (!response.ok) {
+      throw new Error(`API request failed: ${response.status} ${response.statusText}`);
+    }
+    const data = await response.json();
+    console.log(`[API] Successfully fetched data from: ${url}`);
+    return data;
+  } catch (error) {
+    console.error(`[API] Error fetching from ${url}:`, error);
+    return null;
+  }
+}
+var UserApi;
+var init_api = __esm({
+  "src/data/api.ts"() {
+    "use strict";
+    UserApi = {
+      getAll: () => fetchApi("/users"),
+      getById: (id) => fetchApi(`/users/${id}`),
+      create: (data) => fetchApi("/users", {
+        method: "POST",
+        body: JSON.stringify(data)
+      }),
+      update: (id, data) => fetchApi(`/users/${id}`, {
+        method: "PUT",
+        body: JSON.stringify(data)
+      }),
+      delete: (id) => fetchApi(`/users/${id}`, {
+        method: "DELETE"
+      })
+    };
+  }
+});
+
+// src/pages/index.tsx
+var pages_exports = {};
+__export(pages_exports, {
+  default: () => pages_default
+});
+var HomePage, pages_default;
+var init_pages = __esm({
+  "src/pages/index.tsx"() {
+    "use strict";
+    init_dist();
+    init_Layout();
+    init_UserList();
+    init_api();
+    HomePage = ({ initialState: initialState2 }) => /* @__PURE__ */ jsx(Layout, { title: "Home" }, /* @__PURE__ */ jsx("div", { className: "max-w-4xl mx-auto py-8" }, /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold text-blue-600 mb-6" }, "Welcome to your Frontend Hamroun application!"), /* @__PURE__ */ jsx("div", { className: "bg-white shadow-lg rounded-lg p-6 mb-8" }, /* @__PURE__ */ jsx("h2", { className: "text-xl font-semibold text-gray-800 mb-4" }, "User List"), /* @__PURE__ */ jsx(UserList_default, { users: initialState2.data?.users || [] })), /* @__PURE__ */ jsx("div", { className: "bg-gray-50 rounded-lg p-6 border border-gray-200" }, /* @__PURE__ */ jsx("h3", { className: "text-lg font-medium text-gray-700 mb-3" }, "Application State"), /* @__PURE__ */ jsx("pre", { className: "overflow-auto p-4 bg-gray-100 rounded-md text-sm text-gray-800" }, JSON.stringify(initialState2, null, 2)))));
+    HomePage.getInitialData = async () => {
+      return {
+        users: await UserApi.getAll()
+      };
+    };
+    pages_default = HomePage;
+  }
+});
+
+// src/pages/users.tsx
+var users_exports = {};
+__export(users_exports, {
+  default: () => users_default
+});
+var UsersPage, users_default;
+var init_users = __esm({
+  "src/pages/users.tsx"() {
+    "use strict";
+    init_dist();
+    init_Layout();
+    init_api();
+    UsersPage = ({ initialState: initialState2 }) => {
+      const users = initialState2.data?.users || [];
+      return /* @__PURE__ */ jsx(Layout, { title: "User Management" }, /* @__PURE__ */ jsx("div", { className: "max-w-4xl mx-auto" }, /* @__PURE__ */ jsx("div", { className: "bg-blue-50 p-6 rounded-lg mb-8 border border-blue-100" }, /* @__PURE__ */ jsx("h2", { className: "text-xl font-semibold text-blue-800 mb-2" }, "Data Fetching Demo"), /* @__PURE__ */ jsx("p", { className: "text-blue-700" }, "This page demonstrates dynamic data fetching with the Users API.")), /* @__PURE__ */ jsx("div", { className: "bg-white shadow-md rounded-lg overflow-hidden" }, /* @__PURE__ */ jsx("div", { className: "px-6 py-4 border-b border-gray-200" }, /* @__PURE__ */ jsx("h2", { className: "text-xl font-semibold text-gray-800" }, "User List")), users.length === 0 ? /* @__PURE__ */ jsx("div", { className: "p-6 text-center text-gray-500" }, /* @__PURE__ */ jsx("p", null, "No users found.")) : /* @__PURE__ */ jsx("div", { className: "overflow-x-auto" }, /* @__PURE__ */ jsx("table", { className: "w-full" }, /* @__PURE__ */ jsx("thead", null, /* @__PURE__ */ jsx("tr", { className: "bg-gray-50" }, /* @__PURE__ */ jsx("th", { className: "text-left py-3 px-6 font-medium text-gray-600 text-sm uppercase tracking-wider border-b" }, "ID"), /* @__PURE__ */ jsx("th", { className: "text-left py-3 px-6 font-medium text-gray-600 text-sm uppercase tracking-wider border-b" }, "Name"), /* @__PURE__ */ jsx("th", { className: "text-left py-3 px-6 font-medium text-gray-600 text-sm uppercase tracking-wider border-b" }, "Email"))), /* @__PURE__ */ jsx("tbody", { className: "divide-y divide-gray-200" }, users.map((user) => /* @__PURE__ */ jsx("tr", { key: user.id, className: "hover:bg-gray-50" }, /* @__PURE__ */ jsx("td", { className: "py-4 px-6 text-sm text-gray-900" }, user.id), /* @__PURE__ */ jsx("td", { className: "py-4 px-6 text-sm font-medium text-gray-900" }, user.name), /* @__PURE__ */ jsx("td", { className: "py-4 px-6 text-sm text-gray-500" }, user.email)))))))));
+    };
+    UsersPage.getInitialData = async () => {
+      return {
+        users: await UserApi.getAll()
+      };
+    };
+    users_default = UsersPage;
+  }
+});
+
+// src/main.tsx
+init_dist();
+
+// src/router.ts
+init_dist();
+
+// import("./pages/**/*.tsx") in src/router.ts
+var globImport_pages_tsx = __glob({
+  "./pages/about/index.tsx": () => Promise.resolve().then(() => (init_about(), about_exports)),
+  "./pages/index.tsx": () => Promise.resolve().then(() => (init_pages(), pages_exports)),
+  "./pages/users.tsx": () => Promise.resolve().then(() => (init_users(), users_exports))
+});
+
+// import("./pages/**/*/index.tsx") in src/router.ts
+var globImport_pages_index_tsx = __glob({
+  "./pages/about/index.tsx": () => Promise.resolve().then(() => (init_about(), about_exports))
+});
+
+// src/router.ts
+var Router = class {
+  constructor() {
+    this.routes = {};
+    this.notFoundComponent = null;
+  }
+  // Register a component for a specific route
+  register(path, component) {
+    const normalizedPath = path === "/" ? "index" : path.replace(/^\//, "");
+    this.routes[normalizedPath] = component;
+    console.log(`[Router] Registered component for path: ${normalizedPath}`);
+    return this;
+  }
+  // Set the not found component
+  setNotFound(component) {
+    this.notFoundComponent = component;
+    return this;
+  }
+  // Get the not found component
+  getNotFound() {
+    return this.notFoundComponent;
+  }
+  // Get all registered routes
+  getAllRoutes() {
+    return this.routes;
+  }
+  // Find component for a given path
+  async resolve(path) {
+    const normalizedPath = path === "/" ? "index" : path.replace(/^\//, "");
+    console.log(`[Router] Resolving component for path: ${normalizedPath}`);
+    if (this.routes[normalizedPath]) {
+      return this.routes[normalizedPath];
+    }
+    const pathSegments = normalizedPath.split("/");
+    const registeredRoutes = Object.keys(this.routes);
+    for (const route of registeredRoutes) {
+      const routeSegments = route.split("/");
+      if (routeSegments.length !== pathSegments.length)
+        continue;
+      let isMatch = true;
+      const params = {};
+      for (let i = 0; i < routeSegments.length; i++) {
+        const routeSegment = routeSegments[i];
+        const pathSegment = pathSegments[i];
+        if (routeSegment.startsWith("[") && routeSegment.endsWith("]")) {
+          const paramName = routeSegment.slice(1, -1);
+          params[paramName] = pathSegment;
+        } else if (routeSegment !== pathSegment) {
+          isMatch = false;
+          break;
+        }
+      }
+      if (isMatch) {
+        console.log(`[Router] Found dynamic route match: ${route}`);
+        return this.routes[route];
+      }
+    }
+    try {
+      let component = null;
+      let resolvedPath = normalizedPath;
+      try {
+        try {
+          console.log(`[Router] Trying direct import: ./pages/${resolvedPath}.tsx`);
+          const directModule = await /* @vite-ignore */
+          globImport_pages_tsx(`./pages/${resolvedPath}.tsx`).catch(() => null);
+          if (directModule) {
+            component = directModule.default || directModule;
+          }
+        } catch (e) {
+          console.warn(`[Router] Error importing ./pages/${resolvedPath}.tsx:`, e);
+        }
+        if (!component && !resolvedPath.endsWith("index")) {
+          try {
+            console.log(`[Router] Trying index file: ./pages/${resolvedPath}/index.tsx`);
+            const indexModule = await /* @vite-ignore */
+            globImport_pages_index_tsx(`./pages/${resolvedPath}/index.tsx`).catch(() => null);
+            if (indexModule) {
+              component = indexModule.default || indexModule;
+            }
+          } catch (e) {
+            console.warn(`[Router] Error importing ./pages/${resolvedPath}/index.tsx:`, e);
+          }
+        }
+      } catch (routeError) {
+        console.warn(`[Router] Error resolving Next.js style route:`, routeError);
+      }
+      if (component) {
+        this.routes[normalizedPath] = component;
+        return component;
+      }
+    } catch (error) {
+      console.warn(`[Router] Error importing component for ${normalizedPath}:`, error);
+    }
+    console.warn(`[Router] No component found for path: ${normalizedPath}`);
+    return this.notFoundComponent;
+  }
+  // Auto-discover components in the pages directory
+  async discoverRoutes() {
+    console.log("[Router] Auto-discovering routes from pages directory...");
+    try {
+      await this.tryLoadCoreRoutes();
+      console.log("[Router] Route discovery complete. Available routes:", Object.keys(this.routes));
+      return this.routes;
+    } catch (error) {
+      console.error("[Router] Error discovering routes:", error);
+      await this.tryLoadCoreRoutes();
+      return this.routes;
+    }
+  }
+  // Fallback method to load core routes
+  async tryLoadCoreRoutes() {
+    const pageModules = [
+      { path: "./pages/index", route: "index" },
+      { path: "./pages/about/index", route: "about" },
+      { path: "./pages/users", route: "users" }
+    ];
+    for (const { path, route } of pageModules) {
+      if (!this.routes[route]) {
+        try {
+          console.log(`[Router] Attempting to load route: ${route}`);
+          const module = await import(
+            /* @vite-ignore */
+            `${path}.tsx`
+          ).catch(() => null);
+          if (module && module.default) {
+            this.routes[route] = module.default;
+            console.log(`[Router] Registered route: ${route}`);
+          }
+        } catch (error) {
+          console.warn(`[Router] Could not load route: ${route}`, error);
+        }
+      }
+    }
+  }
+};
+var router = new Router();
+var NotFound = ({ initialState: initialState2 }) => {
+  return jsx("div", { className: "container mx-auto px-4 py-12 max-w-4xl" }, [
+    jsx("div", { className: "bg-white shadow-lg rounded-lg overflow-hidden p-8" }, [
+      jsx("h1", { className: "text-3xl font-bold text-gray-800 mb-4" }, ["Page Not Found"]),
+      jsx("p", { className: "text-gray-600 mb-6" }, [`No component found for path: ${initialState2?.route || "unknown"}`]),
+      jsx("a", { href: "/", className: "text-blue-600 hover:text-blue-800 hover:underline transition-colors" }, ["Go to Home"]),
+      jsx("div", { className: "mt-8 p-6 bg-gray-50 rounded-lg border border-gray-200" }, [
+        jsx("h3", { className: "text-lg font-medium text-gray-700 mb-3" }, ["Available Routes"]),
+        jsx("ul", { className: "space-y-2" }, [
+          jsx("li", {}, [jsx("a", { href: "/", className: "text-blue-600 hover:text-blue-800 hover:underline" }, ["Home"])]),
+          jsx("li", {}, [jsx("a", { href: "/about", className: "text-blue-600 hover:text-blue-800 hover:underline" }, ["About"])]),
+          jsx("li", {}, [jsx("a", { href: "/users", className: "text-blue-600 hover:text-blue-800 hover:underline" }, ["Users"])])
+        ])
+      ])
+    ])
+  ]);
+};
+router.setNotFound(NotFound);
+
+// src/main.tsx
+init_pages();
+init_about();
+init_users();
+var isHydrating2 = document.getElementById("root")?.innerHTML.trim() !== "";
+console.log("[Client] Running client-side code. Hydration state:", isHydrating2);
+var initialState = window.__INITIAL_STATE__ || {
+  route: window.location.pathname,
+  timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+  serverRendered: false,
+  data: {
+    users: null,
+    posts: null
+  }
+};
+console.log("[Client] Initial state:", initialState);
+async function fetchData(path) {
+  try {
+    console.log(`[Client] Fetching data from API: ${path}`);
+    const response = await fetch(`/api${path}`);
+    if (!response.ok) {
+      throw new Error(`API request failed: ${response.status}`);
+    }
+    const data = await response.json();
+    console.log(`[Client] Received data:`, data);
+    return data;
+  } catch (error) {
+    console.error(`[Client] Error fetching data from ${path}:`, error);
+    return null;
+  }
+}
+function initializeRouter() {
+  console.log("[Client] Initializing router with known pages");
+  router.register("index", pages_default);
+  router.register("about", about_default);
+  router.register("users", users_default);
+}
+initializeRouter();
+async function renderApp() {
+  try {
+    const currentPath = window.location.pathname;
+    console.log(`[Client] Rendering for path: ${currentPath}`);
+    const rootElement = document.getElementById("root");
+    if (!rootElement) {
+      console.error("[Client] Root element not found");
+      return;
+    }
+    console.log(`[Client] Fetching users data for ${currentPath}`);
+    const users = await fetchData("/users");
+    if (users) {
+      initialState.data = {
+        ...initialState.data,
+        users
+      };
+      console.log(`[Client] Updated state with ${users.length} users`);
+    }
+    let PageComponent = null;
+    if (currentPath === "/about") {
+      try {
+        const AboutPage2 = await Promise.resolve().then(() => (init_about(), about_exports));
+        PageComponent = AboutPage2.default;
+      } catch (err) {
+        console.error("[Client] Failed to load about page:", err);
+      }
+    } else if (currentPath === "/users") {
+      try {
+        const UsersPage2 = await Promise.resolve().then(() => (init_users(), users_exports));
+        PageComponent = UsersPage2.default;
+      } catch (err) {
+        console.error("[Client] Failed to load users page:", err);
+      }
+    } else {
+      PageComponent = await router.resolve(currentPath);
+    }
+    if (!PageComponent) {
+      console.warn(`[Client] Page component not found for ${currentPath}, checking special cases`);
+      if (currentPath === "/users") {
+        try {
+          console.log("[Client] Attempting direct import of Users page");
+          const UsersModule = await Promise.resolve().then(() => (init_users(), users_exports));
+          if (UsersModule.default) {
+            PageComponent = UsersModule.default;
+          }
+        } catch (err) {
+          console.error("[Client] Failed to import Users page:", err);
+        }
+      }
+    }
+    if (!PageComponent) {
+      PageComponent = ({ initialState: initialState2 }) => jsx("div", {
+        style: "padding: 20px; max-width: 800px; margin: 0 auto;"
+      }, [
+        jsx("h1", {}, ["Page Not Found"]),
+        jsx("p", {}, [`No component found for path: ${initialState2.route}`]),
+        jsx("a", { href: "/", style: "color: #0066cc;" }, ["Go to Home"])
+      ]);
+    }
+    initialState.route = currentPath;
+    initialState.timestamp = (/* @__PURE__ */ new Date()).toISOString();
+    initialState.serverRendered = false;
+    if (isHydrating2) {
+      console.log("[Client] Hydrating server-rendered content");
+      hydrate(/* @__PURE__ */ jsx(PageComponent, { initialState }), rootElement);
+      isHydrating2 = false;
+    } else {
+      console.log("[Client] Rendering client-side");
+      render(/* @__PURE__ */ jsx(PageComponent, { initialState }), rootElement);
+    }
+  } catch (error) {
+    console.error("[Client] Error rendering app:", error);
+    const rootElement = document.getElementById("root");
+    if (rootElement) {
+      rootElement.innerHTML = `
+        <div style="padding: 20px; color: red;">
+          <h1>Error</h1>
+          <p>${error.message}</p>
+          <pre>${error.stack}</pre>
+        </div>
+      `;
+    }
+  }
+}
+renderApp();
+document.addEventListener("click", (e) => {
+  let target = e.target;
+  while (target && target.tagName !== "A") {
+    target = target.parentElement;
+    if (!target)
+      break;
+  }
+  if (target && target.tagName === "A" && target.getAttribute("href") && target.getAttribute("href").startsWith("/") && !target.getAttribute("href").startsWith("//") && !target.getAttribute("target")) {
+    e.preventDefault();
+    const href = target.getAttribute("href");
+    window.history.pushState(null, "", href);
+    isHydrating2 = false;
+    renderApp();
+  }
+});
+window.addEventListener("popstate", () => {
+  isHydrating2 = false;
+  renderApp();
+});
+if (typeof io !== "undefined") {
+  const socket = io();
+  socket.on("reload", () => {
+    console.log("[Dev] Reloading page due to file changes");
+    window.location.reload();
+  });
+  socket.on("welcome", (data) => {
+    console.log("[Dev] Connected to development server:", data);
+  });
+}
+//# sourceMappingURL=main.js.map