exta2 0.0.1-beta.29

package/dist/router.d.ts

@@ -0,0 +1,49 @@
+import * as $exta_router from '$exta-router';
+import { PageManifest } from '$exta-manifest';
+
+declare global {
+    interface Window {
+        __EXTA_PAGEMAP__: Record<string, string>;
+    }
+}
+declare function loadPageData(page: string): Promise<any>;
+declare function useLocation(): string;
+declare function useURL(): URL;
+declare function usePathname(): string;
+declare function useSearchQuery(): URLSearchParams;
+declare function useHash(): string;
+declare function useRouter(): {
+    location: string;
+    push: (() => void) | ((path: any) => void);
+    replace: (() => void) | ((path: any) => void);
+};
+declare function useParams(): any;
+declare class Router {
+    routes: PageManifest[];
+    layout: any;
+    error: any;
+    modules: Record<string, any>;
+    data: Map<string, any>;
+    loadedModules: Map<string, any>;
+    constructor(routes: PageManifest[]);
+    prefetch(url: string): Promise<void>;
+    getHref(page: PageManifest): string;
+    preload(page: PageManifest): void;
+    preloadAllPages(): void;
+    loadLayout(): Promise<any>;
+    loadError(): Promise<any>;
+    findPage(url: string): any;
+    goto(href: string): Promise<{
+        module: Record<string, any>;
+        data: any;
+    }>;
+}
+declare const router: Router;
+declare global {
+    interface Window {
+        _exta_router: $exta_router.Router;
+        _exta_useRouter: typeof $exta_router.useRouter;
+    }
+}
+
+export { Router, loadPageData, router, useHash, useLocation, useParams, usePathname, useRouter, useSearchQuery, useURL };

package/dist/router.js

@@ -0,0 +1,270 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var router_exports = {};
+__export(router_exports, {
+  Router: () => Router,
+  loadPageData: () => loadPageData,
+  router: () => router,
+  useHash: () => useHash,
+  useLocation: () => useLocation,
+  useParams: () => useParams,
+  usePathname: () => usePathname,
+  useRouter: () => useRouter,
+  useSearchQuery: () => useSearchQuery,
+  useURL: () => useURL
+});
+module.exports = __toCommonJS(router_exports);
+var import_exta_manifest = require("$exta-manifest");
+var import_exta_pages = __toESM(require("$exta-pages"), 1);
+var import_react = __toESM(require("react"), 1);
+var import_react2 = __toESM(require("react"), 1);
+var import_react3 = __toESM(require("react"), 1);
+const import_meta = {};
+function normalizePath(path) {
+  path = path.replace(/\\/g, "/");
+  let parts = path.split("/").filter(Boolean), stack = [];
+  for (let part of parts)
+    part !== "." && (part === ".." ? stack.pop() : stack.push(part));
+  return "/" + stack.join("/");
+}
+function isSamePathClient(pathA, pathB) {
+  let normalizedA = normalizePath(pathA), normalizedB = normalizePath(pathB);
+  return normalizedA.toLowerCase() === normalizedB.toLowerCase();
+}
+function removeExtension(path) {
+  let lastDotIndex = path.lastIndexOf(".");
+  return lastDotIndex === -1 ? path : path.slice(0, lastDotIndex);
+}
+var DefaultLayout = ({ children }) => import_react2.default.createElement(import_react2.default.Fragment, null, children);
+var containerStyle = {
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center",
+  width: "100%",
+  height: "100vh",
+  textAlign: "center",
+  flexDirection: "column"
+}, defaultProps = {
+  status: 404,
+  message: "Page not found"
+}, DefaultError = ({ status, message } = defaultProps) => (status = status ?? defaultProps.status, message = message ?? defaultProps.message, import_react3.default.createElement("div", { style: containerStyle }, [
+  import_react3.default.createElement("h1", { key: "status" }, String(status)),
+  import_react3.default.createElement("p", { key: "message" }, message)
+]));
+function matchUrlToRoute(url, routeResult) {
+  let { regex, params } = routeResult, match = regex.exec(url);
+  if (!match)
+    return null;
+  let result = {};
+  for (let i = 0; i < params.length; i++) {
+    let paramName = params[i], capturedValue = match[i + 1];
+    if (paramName.startsWith("..."))
+      throw new Error(
+        "[... file names are not supported due to static data generation issues."
+      );
+    result[paramName] = capturedValue;
+  }
+  return result;
+}
+var findPage = (url, _manifest_object) => {
+  let sortedManifest = [..._manifest_object].sort(
+    (a, b) => a.params.length - b.params.length
+  );
+  for (let route of sortedManifest)
+    if (route.regexp.test(decodeURIComponent(url)) && !route.path.startsWith("[") && !route.path.endsWith("]"))
+      return route;
+  return null;
+};
+var isServerSide = typeof window > "u", staticManifest = isServerSide ? {} : JSON.parse(document.getElementById("__STATIC_MANIFEST__")?.innerText || "{}");
+function prettyURL(path) {
+  return path === "." && (path = ""), path.startsWith("/") || (path = `/${path}`), path.endsWith("/") && (path = path.slice(0, -1)), path;
+}
+async function loadPageData(page) {
+  if (import_meta.env.DEV)
+    return await (await fetch(`/.exta/__page_data?page=${page}`)).json();
+  {
+    let id = staticManifest[page.replace(/\//g, "_") + ".json"];
+    if (id === null)
+      return { props: {} };
+    if (id === void 0)
+      return { props: {}, status: 404 };
+    let target = `/data/${id}.json`;
+    try {
+      return { props: await (await fetch(target)).json() };
+    } catch (__e) {
+      return console.error(`Cannot find page (fetching ${target}) - ${__e.message}`), { props: {}, status: 404 };
+    }
+  }
+}
+function createHistoryStore() {
+  if (isServerSide)
+    return {
+      subscribe() {
+        return () => {
+        };
+      },
+      getSnapshot() {
+        return global.__EXTA_SSR_DATA__.pathname;
+      },
+      push() {
+      },
+      replace() {
+      }
+    };
+  let listeners = /* @__PURE__ */ new Set(), notify = () => {
+    for (let l of listeners)
+      l();
+  }, wrap = (method) => {
+    let original = history[method];
+    return function(...args) {
+      original.apply(this, args), notify();
+    };
+  };
+  return history.pushState = wrap("pushState"), history.replaceState = wrap("replaceState"), window.addEventListener("popstate", notify), {
+    subscribe(listener) {
+      return listeners.add(listener), () => listeners.delete(listener);
+    },
+    getSnapshot() {
+      return decodeURIComponent(
+        window.location.pathname + window.location.search + window.location.hash
+      );
+    },
+    push(path) {
+      if (path.startsWith("#")) {
+        location.hash = path;
+        return;
+      }
+      history.pushState({}, "", path), notify();
+    },
+    replace(path) {
+      history.replaceState({}, "", path), notify();
+    }
+  };
+}
+var historyStore = createHistoryStore();
+function useLocationSelector(selector) {
+  return isServerSide ? selector(global.__EXTA_SSR_DATA__.pathname || "/.exta/ssr:unknown") : import_react.default.useSyncExternalStore(
+    historyStore.subscribe,
+    () => selector(historyStore.getSnapshot()),
+    () => selector(global?.__EXTA_SSR_DATA__?.pathname || "/.exta/ssr:unknown")
+  );
+}
+function useLocation() {
+  return useLocationSelector((url) => url);
+}
+function useURL() {
+  let url = useLocation();
+  return import_react.default.useMemo(() => new URL(url, "http://localhost"), [url]);
+}
+function usePathname() {
+  return useLocationSelector((url) => new URL(url, "http://localhost").pathname);
+}
+function useSearchQuery() {
+  let search = useLocationSelector((url) => new URL(url, "http://localhost").search);
+  return import_react.default.useMemo(() => new URLSearchParams(search), [search]);
+}
+function useHash() {
+  return useLocationSelector((url) => new URL(url, "http://localhost").hash);
+}
+function useRouter() {
+  return {
+    location: useLocation(),
+    push: historyStore.push,
+    replace: historyStore.replace
+  };
+}
+function useParams() {
+  if (isServerSide)
+    return global.__EXTA_SSR_DATA__.params || {};
+  let location2 = usePathname(), page = window._exta_router.findPage(location2);
+  if (!page) {
+    let message = `[exta-router] Cannot generate params: Route match for "${location2}" is missing required data.`;
+    throw new Error(message);
+  }
+  return matchUrlToRoute(location2, { params: page.params, regex: page.regexp });
+}
+var Router = class {
+  routes;
+  // layout component
+  layout;
+  // error page
+  error;
+  modules = {};
+  data = /* @__PURE__ */ new Map();
+  loadedModules = /* @__PURE__ */ new Map();
+  constructor(routes) {
+    this.routes = routes;
+  }
+  async prefetch(url) {
+    let _url = prettyURL(url);
+    this.data.has(_url) || this.data.set(_url, await loadPageData(url));
+  }
+  getHref(page) {
+    if (import_meta.env.DEV)
+      return `/.exta/${page.buildPath.replace(/\\/g, "/")}`;
+    let windowObject = window.__EXTA_PAGEMAP__;
+    for (let pageMapKey in windowObject)
+      if (isSamePathClient(removeExtension(pageMapKey), removeExtension(page.originalPath)))
+        return `/${windowObject[pageMapKey]}`;
+  }
+  preload(page) {
+    let href = this.getHref(page);
+    if (!href)
+      return;
+    let preloaded = document.getElementsByTagName("link");
+    for (let preloadScript of [...preloaded])
+      if (preloadScript.href === new URL(href, window.location.origin).href)
+        return;
+    let preload = document.createElement("link");
+    preload.rel = "prefetch", preload.href = href, document.head.appendChild(preload);
+  }
+  preloadAllPages() {
+    for (let route of this.routes)
+      this.preload(route);
+  }
+  async loadLayout() {
+    return this.layout ? this.layout : (import_exta_pages.default["[layout]"] ? this.layout = await import_exta_pages.default["[layout]"]() : this.layout = { _page: DefaultLayout }, this.layout);
+  }
+  async loadError() {
+    return this.error ? this.error : (import_exta_pages.default["[error]"] ? this.error = await import_exta_pages.default["[error]"]() : this.error = { _page: DefaultError }, this.error);
+  }
+  findPage(url) {
+    return url = url.toLowerCase(), findPage(url, this.routes);
+  }
+  async goto(href) {
+    let url = decodeURIComponent(
+      new URL(href, window.location.origin).pathname
+    ).toLowerCase(), page = this.findPage(url);
+    if (await this.loadLayout(), await this.loadError(), !page)
+      return;
+    let pageModule = this.loadedModules.has(page.path) ? this.loadedModules.get(page.path) : this.loadedModules.set(page.path, await import_exta_pages.default[page.path]()).get(page.path), _url = prettyURL(url), data = this.data.has(_url) ? this.data.get(_url) : this.data.set(_url, await loadPageData(url)).get(_url);
+    if (this.modules[page.path] = pageModule, data?.status !== 404)
+      return { module: this.modules, data };
+  }
+}, router = new Router(import_exta_manifest.PAGES_MANIFEST);
+isServerSide || (window._exta_router = router, window._exta_useRouter = useRouter);

package/dist/router.mjs

@@ -0,0 +1,253 @@
+// packages/exta/src/client/router.ts
+import { PAGES_MANIFEST as manifest } from "$exta-manifest";
+import pages from "$exta-pages";
+import React3 from "react";
+
+// packages/exta/src/utils/clientPath.ts
+function normalizePath(path) {
+  path = path.replace(/\\/g, "/");
+  let parts = path.split("/").filter(Boolean), stack = [];
+  for (let part of parts)
+    part !== "." && (part === ".." ? stack.pop() : stack.push(part));
+  return "/" + stack.join("/");
+}
+function isSamePathClient(pathA, pathB) {
+  let normalizedA = normalizePath(pathA), normalizedB = normalizePath(pathB);
+  return normalizedA.toLowerCase() === normalizedB.toLowerCase();
+}
+function removeExtension(path) {
+  let lastDotIndex = path.lastIndexOf(".");
+  return lastDotIndex === -1 ? path : path.slice(0, lastDotIndex);
+}
+
+// packages/exta/src/client/components/_layout..ts
+import React from "react";
+var DefaultLayout = ({ children }) => React.createElement(React.Fragment, null, children);
+
+// packages/exta/src/client/components/_error.ts
+import React2 from "react";
+var containerStyle = {
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center",
+  width: "100%",
+  height: "100vh",
+  textAlign: "center",
+  flexDirection: "column"
+}, defaultProps = {
+  status: 404,
+  message: "Page not found"
+}, DefaultError = ({ status, message } = defaultProps) => (status = status ?? defaultProps.status, message = message ?? defaultProps.message, React2.createElement("div", { style: containerStyle }, [
+  React2.createElement("h1", { key: "status" }, String(status)),
+  React2.createElement("p", { key: "message" }, message)
+]));
+
+// packages/exta/src/utils/params.ts
+function matchUrlToRoute(url, routeResult) {
+  let { regex, params } = routeResult, match = regex.exec(url);
+  if (!match)
+    return null;
+  let result = {};
+  for (let i = 0; i < params.length; i++) {
+    let paramName = params[i], capturedValue = match[i + 1];
+    if (paramName.startsWith("..."))
+      throw new Error(
+        "[... file names are not supported due to static data generation issues."
+      );
+    result[paramName] = capturedValue;
+  }
+  return result;
+}
+
+// packages/exta/src/utils/find.ts
+var findPage = (url, _manifest_object) => {
+  let sortedManifest = [..._manifest_object].sort(
+    (a, b) => a.params.length - b.params.length
+  );
+  for (let route of sortedManifest)
+    if (route.regexp.test(decodeURIComponent(url)) && !route.path.startsWith("[") && !route.path.endsWith("]"))
+      return route;
+  return null;
+};
+
+// packages/exta/src/client/router.ts
+var isServerSide = typeof window > "u", staticManifest = isServerSide ? {} : JSON.parse(document.getElementById("__STATIC_MANIFEST__")?.innerText || "{}");
+function prettyURL(path) {
+  return path === "." && (path = ""), path.startsWith("/") || (path = `/${path}`), path.endsWith("/") && (path = path.slice(0, -1)), path;
+}
+async function loadPageData(page) {
+  if (import.meta.env.DEV)
+    return await (await fetch(`/.exta/__page_data?page=${page}`)).json();
+  {
+    let id = staticManifest[page.replace(/\//g, "_") + ".json"];
+    if (id === null)
+      return { props: {} };
+    if (id === void 0)
+      return { props: {}, status: 404 };
+    let target = `/data/${id}.json`;
+    try {
+      return { props: await (await fetch(target)).json() };
+    } catch (__e) {
+      return console.error(`Cannot find page (fetching ${target}) - ${__e.message}`), { props: {}, status: 404 };
+    }
+  }
+}
+function createHistoryStore() {
+  if (isServerSide)
+    return {
+      subscribe() {
+        return () => {
+        };
+      },
+      getSnapshot() {
+        return global.__EXTA_SSR_DATA__.pathname;
+      },
+      push() {
+      },
+      replace() {
+      }
+    };
+  let listeners = /* @__PURE__ */ new Set(), notify = () => {
+    for (let l of listeners)
+      l();
+  }, wrap = (method) => {
+    let original = history[method];
+    return function(...args) {
+      original.apply(this, args), notify();
+    };
+  };
+  return history.pushState = wrap("pushState"), history.replaceState = wrap("replaceState"), window.addEventListener("popstate", notify), {
+    subscribe(listener) {
+      return listeners.add(listener), () => listeners.delete(listener);
+    },
+    getSnapshot() {
+      return decodeURIComponent(
+        window.location.pathname + window.location.search + window.location.hash
+      );
+    },
+    push(path) {
+      if (path.startsWith("#")) {
+        location.hash = path;
+        return;
+      }
+      history.pushState({}, "", path), notify();
+    },
+    replace(path) {
+      history.replaceState({}, "", path), notify();
+    }
+  };
+}
+var historyStore = createHistoryStore();
+function useLocationSelector(selector) {
+  return isServerSide ? selector(global.__EXTA_SSR_DATA__.pathname || "/.exta/ssr:unknown") : React3.useSyncExternalStore(
+    historyStore.subscribe,
+    () => selector(historyStore.getSnapshot()),
+    () => selector(global?.__EXTA_SSR_DATA__?.pathname || "/.exta/ssr:unknown")
+  );
+}
+function useLocation() {
+  return useLocationSelector((url) => url);
+}
+function useURL() {
+  let url = useLocation();
+  return React3.useMemo(() => new URL(url, "http://localhost"), [url]);
+}
+function usePathname() {
+  return useLocationSelector((url) => new URL(url, "http://localhost").pathname);
+}
+function useSearchQuery() {
+  let search = useLocationSelector((url) => new URL(url, "http://localhost").search);
+  return React3.useMemo(() => new URLSearchParams(search), [search]);
+}
+function useHash() {
+  return useLocationSelector((url) => new URL(url, "http://localhost").hash);
+}
+function useRouter() {
+  return {
+    location: useLocation(),
+    push: historyStore.push,
+    replace: historyStore.replace
+  };
+}
+function useParams() {
+  if (isServerSide)
+    return global.__EXTA_SSR_DATA__.params || {};
+  let location2 = usePathname(), page = window._exta_router.findPage(location2);
+  if (!page) {
+    let message = `[exta-router] Cannot generate params: Route match for "${location2}" is missing required data.`;
+    throw new Error(message);
+  }
+  return matchUrlToRoute(location2, { params: page.params, regex: page.regexp });
+}
+var Router = class {
+  routes;
+  // layout component
+  layout;
+  // error page
+  error;
+  modules = {};
+  data = /* @__PURE__ */ new Map();
+  loadedModules = /* @__PURE__ */ new Map();
+  constructor(routes) {
+    this.routes = routes;
+  }
+  async prefetch(url) {
+    let _url = prettyURL(url);
+    this.data.has(_url) || this.data.set(_url, await loadPageData(url));
+  }
+  getHref(page) {
+    if (import.meta.env.DEV)
+      return `/.exta/${page.buildPath.replace(/\\/g, "/")}`;
+    let windowObject = window.__EXTA_PAGEMAP__;
+    for (let pageMapKey in windowObject)
+      if (isSamePathClient(removeExtension(pageMapKey), removeExtension(page.originalPath)))
+        return `/${windowObject[pageMapKey]}`;
+  }
+  preload(page) {
+    let href = this.getHref(page);
+    if (!href)
+      return;
+    let preloaded = document.getElementsByTagName("link");
+    for (let preloadScript of [...preloaded])
+      if (preloadScript.href === new URL(href, window.location.origin).href)
+        return;
+    let preload = document.createElement("link");
+    preload.rel = "prefetch", preload.href = href, document.head.appendChild(preload);
+  }
+  preloadAllPages() {
+    for (let route of this.routes)
+      this.preload(route);
+  }
+  async loadLayout() {
+    return this.layout ? this.layout : (pages["[layout]"] ? this.layout = await pages["[layout]"]() : this.layout = { _page: DefaultLayout }, this.layout);
+  }
+  async loadError() {
+    return this.error ? this.error : (pages["[error]"] ? this.error = await pages["[error]"]() : this.error = { _page: DefaultError }, this.error);
+  }
+  findPage(url) {
+    return url = url.toLowerCase(), findPage(url, this.routes);
+  }
+  async goto(href) {
+    let url = decodeURIComponent(
+      new URL(href, window.location.origin).pathname
+    ).toLowerCase(), page = this.findPage(url);
+    if (await this.loadLayout(), await this.loadError(), !page)
+      return;
+    let pageModule = this.loadedModules.has(page.path) ? this.loadedModules.get(page.path) : this.loadedModules.set(page.path, await pages[page.path]()).get(page.path), _url = prettyURL(url), data = this.data.has(_url) ? this.data.get(_url) : this.data.set(_url, await loadPageData(url)).get(_url);
+    if (this.modules[page.path] = pageModule, data?.status !== 404)
+      return { module: this.modules, data };
+  }
+}, router = new Router(manifest);
+isServerSide || (window._exta_router = router, window._exta_useRouter = useRouter);
+export {
+  Router,
+  loadPageData,
+  router,
+  useHash,
+  useLocation,
+  useParams,
+  usePathname,
+  useRouter,
+  useSearchQuery,
+  useURL
+};