@lolyjs/core 0.1.0-alpha.0

package/dist/runtime.cjs

@@ -0,0 +1,626 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// modules/runtime/client/index.tsx
+var client_exports = {};
+__export(client_exports, {
+  bootstrapClient: () => bootstrapClient
+});
+module.exports = __toCommonJS(client_exports);
+
+// modules/runtime/client/bootstrap.tsx
+var import_client = require("react-dom/client");
+
+// modules/runtime/client/constants.ts
+var WINDOW_DATA_KEY = "__FW_DATA__";
+var APP_CONTAINER_ID = "__app";
+
+// modules/runtime/client/window-data.ts
+function getWindowData() {
+  return window[WINDOW_DATA_KEY] ?? null;
+}
+function setWindowData(data) {
+  window[WINDOW_DATA_KEY] = data;
+  if (typeof window !== "undefined") {
+    window.dispatchEvent(
+      new CustomEvent("fw-data-refresh", {
+        detail: { data }
+      })
+    );
+  }
+}
+function getCurrentTheme() {
+  return getWindowData()?.theme ?? null;
+}
+
+// modules/runtime/client/route-matcher.ts
+function buildClientRegexFromPattern(pattern) {
+  const segments = pattern.split("/").filter(Boolean);
+  const regexParts = [];
+  for (let i = 0; i < segments.length; i++) {
+    const seg = segments[i];
+    if (seg.startsWith("[...") && seg.endsWith("]")) {
+      if (i !== segments.length - 1) {
+        throw new Error(
+          `Catch-all segment "${seg}" in "${pattern}" must be the last segment.`
+        );
+      }
+      regexParts.push("(.+)");
+      continue;
+    }
+    if (seg.startsWith("[") && seg.endsWith("]")) {
+      regexParts.push("([^/]+)");
+      continue;
+    }
+    const escaped = seg.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+    regexParts.push(escaped);
+  }
+  const regexSource = "^/" + regexParts.join("/") + "/?$";
+  return new RegExp(regexSource);
+}
+function matchRouteClient(pathWithSearch, routes) {
+  const [pathname] = pathWithSearch.split("?");
+  for (const r of routes) {
+    const regex = buildClientRegexFromPattern(r.pattern);
+    const match = regex.exec(pathname);
+    if (!match) continue;
+    const params = {};
+    r.paramNames.forEach((name, idx) => {
+      params[name] = decodeURIComponent(match[idx + 1] || "");
+    });
+    return { route: r, params };
+  }
+  return null;
+}
+
+// modules/runtime/client/metadata.ts
+function applyMetadata(md) {
+  if (!md) return;
+  if (md.title) {
+    document.title = md.title;
+  }
+  if (md.description) {
+    let meta = document.querySelector(
+      'meta[name="description"]'
+    );
+    if (!meta) {
+      meta = document.createElement("meta");
+      meta.name = "description";
+      document.head.appendChild(meta);
+    }
+    meta.content = md.description;
+  }
+}
+
+// modules/runtime/client/AppShell.tsx
+var import_react = require("react");
+
+// modules/runtime/client/RouterView.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function RouterView({ state }) {
+  if (!state.route) {
+    if (state.components === null) {
+      return null;
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { children: "404 - Route not found" });
+  }
+  if (!state.components) {
+    return null;
+  }
+  const { Page, layouts } = state.components;
+  const { params, props } = state;
+  let element = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Page, { params, ...props });
+  const layoutChain = layouts.slice().reverse();
+  for (const Layout of layoutChain) {
+    element = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Layout, { params, ...props, children: element });
+  }
+  return element;
+}
+
+// modules/react/cache/client-data-cache/index.ts
+var CACHE_KEY = "__FW_DATA_CACHE__";
+var MAX_CACHE_SIZE = 100;
+function getCacheStore() {
+  if (typeof window !== "undefined") {
+    if (!window[CACHE_KEY]) {
+      window[CACHE_KEY] = {
+        data: /* @__PURE__ */ new Map(),
+        index: /* @__PURE__ */ new Map(),
+        lru: []
+      };
+    }
+    return window[CACHE_KEY];
+  }
+  return {
+    data: /* @__PURE__ */ new Map(),
+    index: /* @__PURE__ */ new Map(),
+    lru: []
+  };
+}
+var cacheStore = getCacheStore();
+var dataCache = cacheStore.data;
+var pathIndex = cacheStore.index;
+var lru = cacheStore.lru;
+function extractPathBase(key) {
+  return key.split("?")[0];
+}
+function addToIndex(key) {
+  const pathBase = extractPathBase(key);
+  if (!pathIndex.has(pathBase)) {
+    pathIndex.set(pathBase, /* @__PURE__ */ new Set());
+  }
+  pathIndex.get(pathBase).add(key);
+}
+function removeFromIndex(key) {
+  const pathBase = extractPathBase(key);
+  const keys = pathIndex.get(pathBase);
+  if (keys) {
+    keys.delete(key);
+    if (keys.size === 0) {
+      pathIndex.delete(pathBase);
+    }
+  }
+}
+function updateLRU(key) {
+  const index = lru.indexOf(key);
+  if (index !== -1) {
+    lru.splice(index, 1);
+  }
+  lru.push(key);
+}
+function evictOldest() {
+  while (lru.length >= MAX_CACHE_SIZE && lru.length > 0) {
+    const oldestKey = lru.shift();
+    dataCache.delete(oldestKey);
+    removeFromIndex(oldestKey);
+  }
+}
+function setCacheEntry(key, entry) {
+  const existingEntry = dataCache.get(key);
+  const wasFulfilled = existingEntry?.status === "fulfilled";
+  dataCache.set(key, entry);
+  if (entry.status === "fulfilled") {
+    if (!wasFulfilled) {
+      addToIndex(key);
+    }
+    updateLRU(key);
+    evictOldest();
+  } else if (wasFulfilled) {
+    removeFromIndex(key);
+  }
+}
+function deleteCacheEntry(key) {
+  if (dataCache.has(key)) {
+    dataCache.delete(key);
+    removeFromIndex(key);
+    const lruIndex = lru.indexOf(key);
+    if (lruIndex !== -1) {
+      lru.splice(lruIndex, 1);
+    }
+  }
+}
+function buildDataUrl(url) {
+  return url + (url.includes("?") ? "&" : "?") + "__fw_data=1";
+}
+async function fetchRouteDataOnce(url) {
+  const dataUrl = buildDataUrl(url);
+  const res = await fetch(dataUrl, {
+    headers: {
+      "x-fw-data": "1",
+      Accept: "application/json"
+    }
+  });
+  let json = {};
+  try {
+    const text = await res.text();
+    if (text) {
+      json = JSON.parse(text);
+    }
+  } catch (parseError) {
+    console.error(
+      "[client][cache] Failed to parse response as JSON:",
+      parseError
+    );
+  }
+  const result = {
+    ok: res.ok,
+    status: res.status,
+    json
+  };
+  return result;
+}
+async function getRouteData(url, options) {
+  const key = buildDataUrl(url);
+  if (options?.revalidate) {
+    deleteCacheEntry(key);
+  }
+  const entry = dataCache.get(key);
+  if (entry) {
+    if (entry.status === "fulfilled") {
+      updateLRU(key);
+      return entry.value;
+    }
+    if (entry.status === "pending") {
+      return entry.promise;
+    }
+  }
+  const promise = fetchRouteDataOnce(url).then((value) => {
+    setCacheEntry(key, { status: "fulfilled", value });
+    return value;
+  }).catch((error) => {
+    console.error("[client][cache] Error fetching route data:", error);
+    dataCache.set(key, { status: "rejected", error });
+    throw error;
+  });
+  dataCache.set(key, { status: "pending", promise });
+  return promise;
+}
+
+// modules/runtime/client/navigation.ts
+async function handleErrorRoute(nextUrl, json, errorRoute, setState) {
+  try {
+    const components = await errorRoute.load();
+    let theme = "light";
+    if (typeof document !== "undefined") {
+      const cookieMatch = document.cookie.match(/theme=([^;]+)/);
+      if (cookieMatch) {
+        theme = cookieMatch[1];
+      } else if (json.theme) {
+        theme = json.theme;
+      } else {
+        const currentTheme = getCurrentTheme();
+        if (currentTheme) theme = currentTheme;
+      }
+    } else if (json.theme) {
+      theme = json.theme;
+    }
+    const errorProps = {
+      ...json.props || {
+        error: json.message || "An error occurred"
+      },
+      theme
+    };
+    const windowData = {
+      pathname: nextUrl,
+      params: json.params || {},
+      props: errorProps,
+      metadata: json.metadata ?? null,
+      theme,
+      notFound: false,
+      error: true
+    };
+    setWindowData(windowData);
+    setState({
+      url: nextUrl,
+      route: errorRoute,
+      params: json.params || {},
+      components,
+      props: errorProps
+    });
+    return true;
+  } catch (loadError) {
+    console.error(
+      "[client] Error loading error route components:",
+      loadError
+    );
+    window.location.href = nextUrl;
+    return false;
+  }
+}
+async function handleNotFoundRoute(nextUrl, json, notFoundRoute, setState) {
+  let theme = "light";
+  if (typeof document !== "undefined") {
+    const cookieMatch = document.cookie.match(/theme=([^;]+)/);
+    if (cookieMatch) {
+      theme = cookieMatch[1];
+    } else if (json.theme) {
+      theme = json.theme;
+    } else {
+      const currentTheme = getCurrentTheme();
+      if (currentTheme) theme = currentTheme;
+    }
+  } else if (json.theme) {
+    theme = json.theme;
+  }
+  const notFoundProps = {
+    ...json.props ?? {},
+    theme
+  };
+  const windowData = {
+    pathname: nextUrl,
+    params: {},
+    props: notFoundProps,
+    metadata: json.metadata ?? null,
+    theme,
+    notFound: true,
+    error: false
+  };
+  setWindowData(windowData);
+  if (notFoundRoute) {
+    const components = await notFoundRoute.load();
+    setState({
+      url: nextUrl,
+      route: notFoundRoute,
+      params: {},
+      components,
+      props: notFoundProps
+    });
+  } else {
+    setState({
+      url: nextUrl,
+      route: null,
+      params: {},
+      components: null,
+      props: {}
+    });
+  }
+}
+async function handleNormalRoute(nextUrl, json, routes, setState) {
+  applyMetadata(json.metadata ?? null);
+  let theme = "light";
+  if (typeof document !== "undefined") {
+    const cookieMatch = document.cookie.match(/theme=([^;]+)/);
+    if (cookieMatch) {
+      theme = cookieMatch[1];
+    } else if (json.theme) {
+      theme = json.theme;
+    } else {
+      const currentTheme = getCurrentTheme();
+      if (currentTheme) {
+        theme = currentTheme;
+      }
+    }
+  } else if (json.theme) {
+    theme = json.theme;
+  }
+  const newProps = {
+    ...json.props ?? {},
+    theme
+    // Always include theme
+  };
+  const matched = matchRouteClient(nextUrl, routes);
+  if (!matched) {
+    window.location.href = nextUrl;
+    return false;
+  }
+  const windowData = {
+    pathname: nextUrl,
+    params: matched.params,
+    props: newProps,
+    metadata: json.metadata ?? null,
+    theme,
+    notFound: false,
+    error: false
+  };
+  setWindowData(windowData);
+  const components = await matched.route.load();
+  window.scrollTo({
+    top: 0,
+    behavior: "smooth"
+  });
+  setState({
+    url: nextUrl,
+    route: matched.route,
+    params: matched.params,
+    components,
+    props: newProps
+  });
+  return true;
+}
+async function navigate(nextUrl, handlers, options) {
+  const { setState, routes, notFoundRoute, errorRoute } = handlers;
+  try {
+    const { ok, json } = await getRouteData(nextUrl, {
+      revalidate: options?.revalidate
+    });
+    if (json && json.error) {
+      console.log("[client] Error detected in response:", json);
+      if (errorRoute) {
+        const handled = await handleErrorRoute(
+          nextUrl,
+          json,
+          errorRoute,
+          setState
+        );
+        if (handled) return;
+      } else {
+        console.warn(
+          "[client] Error route not available, reloading page.",
+          errorRoute
+        );
+        window.location.href = nextUrl;
+        return;
+      }
+    }
+    if (!ok) {
+      if (json && json.redirect) {
+        window.location.href = json.redirect.destination;
+        return;
+      }
+      window.location.href = nextUrl;
+      return;
+    }
+    if (json.redirect) {
+      window.location.href = json.redirect.destination;
+      return;
+    }
+    if (json.notFound) {
+      await handleNotFoundRoute(nextUrl, json, notFoundRoute, setState);
+      return;
+    }
+    await handleNormalRoute(nextUrl, json, routes, setState);
+  } catch (err) {
+    console.error("[client] Error fetching FW data:", err);
+    window.location.href = nextUrl;
+  }
+}
+function createClickHandler(navigate2) {
+  return function handleClick(ev) {
+    if (ev.defaultPrevented) return;
+    if (ev.button !== 0) return;
+    if (ev.metaKey || ev.ctrlKey || ev.shiftKey || ev.altKey) return;
+    const target = ev.target;
+    if (!target) return;
+    const anchor = target.closest("a[href]");
+    if (!anchor) return;
+    const href = anchor.getAttribute("href");
+    if (!href) return;
+    if (href.startsWith("#")) return;
+    const url = new URL(href, window.location.href);
+    if (url.origin !== window.location.origin) return;
+    if (anchor.target && anchor.target !== "_self") return;
+    ev.preventDefault();
+    const nextUrl = url.pathname + url.search;
+    const currentUrl = window.location.pathname + window.location.search;
+    if (nextUrl === currentUrl) return;
+    const shouldRevalidate = anchor.hasAttribute("data-revalidate") && anchor.getAttribute("data-revalidate") !== "false";
+    window.history.pushState({}, "", nextUrl);
+    navigate2(nextUrl, shouldRevalidate ? { revalidate: true } : void 0);
+  };
+}
+function createPopStateHandler(navigate2) {
+  return function handlePopState() {
+    const nextUrl = window.location.pathname + window.location.search;
+    navigate2(nextUrl);
+  };
+}
+
+// modules/runtime/client/AppShell.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function AppShell({
+  initialState,
+  routes,
+  notFoundRoute,
+  errorRoute
+}) {
+  const [state, setState] = (0, import_react.useState)(initialState);
+  (0, import_react.useEffect)(() => {
+    const handlers = {
+      setState,
+      routes,
+      notFoundRoute,
+      errorRoute
+    };
+    async function handleNavigate(nextUrl, options) {
+      await navigate(nextUrl, handlers, options);
+    }
+    const handleClick = createClickHandler(handleNavigate);
+    const handlePopState = createPopStateHandler(handleNavigate);
+    window.addEventListener("click", handleClick);
+    window.addEventListener("popstate", handlePopState);
+    return () => {
+      window.removeEventListener("click", handleClick);
+      window.removeEventListener("popstate", handlePopState);
+    };
+  }, [routes, notFoundRoute, errorRoute]);
+  const isError = state.route === errorRoute;
+  const isNotFound = state.route === notFoundRoute;
+  const routeType = isError ? "error" : isNotFound ? "notfound" : "normal";
+  const routeKey = `${state.url}:${routeType}`;
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(RouterView, { state }, routeKey);
+}
+
+// modules/runtime/client/bootstrap.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+async function loadInitialRoute(initialUrl, initialData, routes, notFoundRoute, errorRoute) {
+  const isInitialNotFound = initialData?.notFound === true;
+  const isInitialError = initialData?.error === true;
+  let initialRoute = null;
+  let initialParams = {};
+  let initialComponents = null;
+  if (isInitialError && errorRoute) {
+    initialRoute = errorRoute;
+    initialParams = initialData?.params ?? {};
+    initialComponents = await errorRoute.load();
+  } else if (isInitialNotFound && notFoundRoute) {
+    initialRoute = notFoundRoute;
+    initialParams = {};
+    initialComponents = await notFoundRoute.load();
+  } else {
+    const match = matchRouteClient(initialUrl, routes);
+    if (match) {
+      initialRoute = match.route;
+      initialParams = match.params;
+      initialComponents = await match.route.load();
+    } else if (notFoundRoute) {
+      initialRoute = notFoundRoute;
+      initialParams = {};
+      initialComponents = await notFoundRoute.load();
+    } else {
+      console.warn(
+        `[client] No route match found for ${initialUrl}. Available routes:`,
+        routes.map((r) => r.pattern)
+      );
+    }
+  }
+  return {
+    url: initialUrl,
+    route: initialRoute,
+    params: initialParams,
+    components: initialComponents,
+    props: initialData?.props ?? {}
+  };
+}
+function bootstrapClient(routes, notFoundRoute, errorRoute = null) {
+  (async function bootstrap() {
+    const container = document.getElementById(APP_CONTAINER_ID);
+    const initialData = getWindowData();
+    if (!container) {
+      console.error(`Container #${APP_CONTAINER_ID} not found for hydration`);
+      return;
+    }
+    const initialUrl = window.location.pathname + window.location.search;
+    try {
+      const initialState = await loadInitialRoute(
+        initialUrl,
+        initialData,
+        routes,
+        notFoundRoute,
+        errorRoute
+      );
+      if (initialData?.metadata) {
+        applyMetadata(initialData.metadata);
+      }
+      (0, import_client.hydrateRoot)(
+        container,
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          AppShell,
+          {
+            initialState,
+            routes,
+            notFoundRoute,
+            errorRoute
+          }
+        )
+      );
+    } catch (error) {
+      console.error(
+        "[client] Error loading initial route components for",
+        initialUrl,
+        error
+      );
+      window.location.reload();
+    }
+  })();
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  bootstrapClient
+});
+//# sourceMappingURL=runtime.cjs.map