xanix 0.0.0 → 1.0.0

package/dist/hooks/useSearchParams.js

@@ -0,0 +1,66 @@
+import { navigate } from "../navigate.js";
+import useDocument from "./useDocument.js";
+const getParams = (req) => {
+    return new URLSearchParams(__XANIX_SERVER__ ? req.url.split("?")[1] || "" : window.location.search);
+};
+const buildUrl = (params) => {
+    const search = params.toString();
+    return (window.location.pathname +
+        (search ? `?${search}` : "") +
+        window.location.hash);
+};
+const useSearchParams = () => {
+    const { request } = useDocument();
+    const update = (newParams) => {
+        navigate(buildUrl(newParams));
+    };
+    return {
+        get: (key) => getParams(request).get(key),
+        getAll: () => {
+            const p = {};
+            for (const [key, value] of getParams(request).entries()) {
+                if (!p[key]) {
+                    p[key] = [];
+                }
+                p[key].push(value);
+            }
+            return p;
+        },
+        has: (key) => getParams(request).has(key),
+        set: (key, value) => {
+            const newParams = new URLSearchParams(getParams(request));
+            if (!value) {
+                newParams.delete(key);
+                update(newParams);
+            }
+            else if (!newParams.has(key)) {
+                newParams.set(key, value);
+                update(newParams);
+            }
+        },
+        sets: (entries) => {
+            const newParams = new URLSearchParams(getParams(request));
+            for (const [key, value] of Object.entries(entries)) {
+                newParams.set(key, value);
+            }
+            update(newParams);
+        },
+        delete: (key) => {
+            const newParams = new URLSearchParams(getParams(request));
+            newParams.delete(key);
+            update(newParams);
+        },
+        deletes: (keys) => {
+            const newParams = new URLSearchParams(getParams(request));
+            for (const key of keys) {
+                newParams.delete(key);
+            }
+            update(newParams);
+        },
+        clear: () => {
+            update(new URLSearchParams());
+        },
+        toString: () => getParams(request).toString(),
+    };
+};
+export default useSearchParams;

package/dist/index.d.ts

@@ -0,0 +1,23 @@
+import Link from "./components/Link.js";
+import Document, { DocumentProps } from "./components/Document.js";
+import Head from "./components/Head.js";
+import Body from "./components/Body.js";
+import Script from "./components/Script.js";
+import useDocument from "./hooks/useDocument.js";
+import useLocation from "./hooks/useLocation.js";
+import useParams from "./hooks/useParams.js";
+import usePathname from "./hooks/usePathname.js";
+import useSearchParams from "./hooks/useSearchParams.js";
+import usePage from "./hooks/usePage.js";
+import useRequest from "./hooks/useRequest.js";
+import useHeaders from "./hooks/useHeaders.js";
+import useCookies from "./hooks/useCookies.js";
+import useData from "./hooks/useData.js";
+import { navigate, back, forward, preload, onNavigateStart, onNavigateEnd, reload } from "./navigate.js";
+export declare const isClient: boolean;
+export declare const isServer: boolean;
+export declare const isDevelopment: boolean;
+export declare const isProduction: boolean;
+export { Link, Document, Head, Body, Script, useDocument, useLocation, useParams, usePathname, useSearchParams, usePage, useRequest, useHeaders, useCookies, useData, navigate, back, forward, preload, onNavigateStart, onNavigateEnd, reload, };
+export type * from "./types";
+export type { DocumentProps };

package/dist/index.js

@@ -0,0 +1,27 @@
+import Link from "./components/Link.js";
+import Document from "./components/Document.js";
+import Head from "./components/Head.js";
+import Body from "./components/Body.js";
+import Script from "./components/Script.js";
+// hooks
+import useDocument from "./hooks/useDocument.js";
+import useLocation from "./hooks/useLocation.js";
+import useParams from "./hooks/useParams.js";
+import usePathname from "./hooks/usePathname.js";
+import useSearchParams from "./hooks/useSearchParams.js";
+import usePage from "./hooks/usePage.js";
+import useRequest from "./hooks/useRequest.js";
+import useHeaders from "./hooks/useHeaders.js";
+import useCookies from "./hooks/useCookies.js";
+import useData from "./hooks/useData.js";
+// navigate
+import { navigate, back, forward, preload, onNavigateStart, onNavigateEnd, reload, } from "./navigate.js";
+export const isClient = __XANIX_CLIENT__;
+export const isServer = __XANIX_SERVER__;
+export const isDevelopment = __XANIX_DEV__;
+export const isProduction = __XANIX_PROD__;
+export { Link, Document, Head, Body, Script, 
+// hooks
+useDocument, useLocation, useParams, usePathname, useSearchParams, usePage, useRequest, useHeaders, useCookies, useData, 
+// navigate
+navigate, back, forward, preload, onNavigateStart, onNavigateEnd, reload, };

package/dist/loader.d.ts

@@ -0,0 +1,11 @@
+type PageId = string;
+type LoaderEntry = {
+    args: any[];
+    callback: () => any;
+    data: any;
+};
+declare const loader: {
+    get: (pageId: PageId) => any;
+    set: (pageId: PageId, entry: LoaderEntry) => void;
+};
+export default loader;

package/dist/loader.js

@@ -0,0 +1,16 @@
+let global = __XANIX_SERVER__ ? globalThis : window;
+global.$XANIX_PAGE_LOADERS$ = new Map();
+const _ = global.$XANIX_PAGE_LOADERS$;
+const get = (pageId) => {
+    if (!_.has(pageId)) {
+        _.set(pageId, new Map());
+    }
+    return _.get(pageId);
+};
+const set = (pageId, entry) => {
+    const loader = get(pageId);
+    const uid = entry.callback.toString();
+    loader.set(uid, entry);
+};
+const loader = { get, set };
+export default loader;

package/dist/navigate.d.ts

@@ -0,0 +1,7 @@
+export declare const navigate: (path: string, replace?: boolean) => void;
+export declare const back: () => void;
+export declare const forward: () => void;
+export declare const preload: (path: string) => Promise<void>;
+export declare const reload: (hard?: boolean) => void;
+export declare const onNavigateStart: (callback: () => void) => void;
+export declare const onNavigateEnd: (callback: () => void) => void;

package/dist/navigate.js

@@ -0,0 +1,31 @@
+export const navigate = (path, replace = false) => {
+    window.dispatchEvent(new CustomEvent("xanix:navigate", {
+        detail: { path, replace },
+    }));
+};
+export const back = () => {
+    window.history.back();
+};
+export const forward = () => {
+    window.history.forward();
+};
+export const preload = async (path) => {
+    window.dispatchEvent(new CustomEvent("xanix:preload", { detail: { path } }));
+};
+export const reload = (hard = false) => {
+    if (hard) {
+        window.location.reload();
+        return;
+    }
+    window.dispatchEvent(new CustomEvent("xanix:reload"));
+};
+export const onNavigateStart = (callback) => {
+    if (__XANIX_CLIENT__) {
+        window.addEventListener("xanix:navigate:start", callback);
+    }
+};
+export const onNavigateEnd = (callback) => {
+    if (__XANIX_CLIENT__) {
+        window.addEventListener("xanix:navigate:end", callback);
+    }
+};

package/dist/navigation/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./navigate.js";
+export * from "./useLocation.js";

package/dist/navigation/index.js

@@ -0,0 +1,2 @@
+export * from "./navigate.js";
+export * from "./useLocation.js";

package/dist/navigation/navigate.d.ts

@@ -0,0 +1,7 @@
+export declare const navigate: (path: string, replace?: boolean) => void;
+export declare const back: () => void;
+export declare const forward: () => void;
+export declare const preload: (path: string) => Promise<void>;
+export declare const reload: (hard?: boolean) => void;
+export declare const onNavigateStart: (callback: () => void) => void;
+export declare const onNavigateEnd: (callback: () => void) => void;

package/dist/navigation/navigate.js

@@ -0,0 +1,31 @@
+export const navigate = (path, replace = false) => {
+    window.dispatchEvent(new CustomEvent("xanix:navigate", {
+        detail: { path, replace },
+    }));
+};
+export const back = () => {
+    window.history.back();
+};
+export const forward = () => {
+    window.history.forward();
+};
+export const preload = async (path) => {
+    window.dispatchEvent(new CustomEvent("xanix:preload", { detail: { path } }));
+};
+export const reload = (hard = false) => {
+    if (hard) {
+        window.location.reload();
+        return;
+    }
+    window.dispatchEvent(new CustomEvent("xanix:reload"));
+};
+export const onNavigateStart = (callback) => {
+    if (typeof window === "undefined")
+        return;
+    window.addEventListener("xanix:navigate:start", callback);
+};
+export const onNavigateEnd = (callback) => {
+    if (typeof window === "undefined")
+        return;
+    window.addEventListener("xanix:navigate:end", callback);
+};

package/dist/navigation/useLocation.d.ts

@@ -0,0 +1 @@
+export declare const useLocation: () => URL;

package/dist/navigation/useLocation.js

@@ -0,0 +1,22 @@
+import { useDocument } from "../document/index.js";
+import { useState, useEffect } from "react";
+export const useLocation = () => {
+    const _document = useDocument();
+    const req = _document?.request;
+    let _url;
+    if (req) {
+        _url = new URL(req.originalUrl, `${req.protocol}://${req.get("host")}`);
+    }
+    else {
+        _url = new URL(window.location.href);
+    }
+    const [url, setUrl] = useState(_url);
+    useEffect(() => {
+        const onNavigate = () => setUrl(new URL(window.location.href));
+        window.addEventListener("xanix:navigate:end", onNavigate);
+        return () => {
+            window.removeEventListener("xanix:navigate:end", onNavigate);
+        };
+    }, []);
+    return url;
+};

package/dist/router/index.d.ts

@@ -0,0 +1 @@
+export * from "./useSearchParams.js";

package/dist/router/index.js

@@ -0,0 +1 @@
+export * from "./useSearchParams.js";

package/dist/router/useParams.d.ts

@@ -0,0 +1,9 @@
+export declare const useParams: () => {
+    get: (key: string) => string | null;
+    set: (key: string, value: string) => void;
+    sets: (entries: Record<string, string>) => void;
+    delete: (key: string) => void;
+    deletes: (keys: string[]) => void;
+    clear: () => void;
+    has: (key: string) => boolean;
+};

package/dist/router/useParams.js

@@ -0,0 +1,50 @@
+import { navigate } from "../navigation/navigate.js";
+import { useEffect, useState } from "react";
+const getParams = () => {
+    return new URLSearchParams(window.location.search);
+};
+export const useParams = () => {
+    const [params, setParams] = useState(getParams());
+    useEffect(() => {
+        const onNavigate = () => setParams(getParams());
+        window.addEventListener("xanix:navigate:end", onNavigate);
+        return () => {
+            window.removeEventListener("xanix:navigate:end", onNavigate);
+        };
+    }, []);
+    return {
+        get: (key) => params.get(key),
+        set: (key, value) => {
+            const newParams = new URLSearchParams(params.toString());
+            newParams.set(key, value);
+            navigate(window.location.pathname + "?" + newParams.toString());
+        },
+        sets: (entries) => {
+            const newParams = new URLSearchParams(params.toString());
+            for (const [key, value] of Object.entries(entries)) {
+                newParams.set(key, value);
+            }
+            navigate(window.location.pathname + "?" + newParams.toString());
+        },
+        delete: (key) => {
+            const newParams = new URLSearchParams(params.toString());
+            newParams.delete(key);
+            setParams(newParams);
+            navigate(window.location.pathname + "?" + newParams.toString());
+        },
+        deletes: (keys) => {
+            const newParams = new URLSearchParams(params.toString());
+            for (const key of keys) {
+                newParams.delete(key);
+            }
+            setParams(newParams);
+            navigate(window.location.pathname + "?" + newParams.toString());
+        },
+        clear: () => {
+            const newParams = new URLSearchParams();
+            setParams(newParams);
+            navigate(window.location.pathname + "?" + newParams.toString());
+        },
+        has: (key) => params.has(key),
+    };
+};

package/dist/router/useSearchParams .d.ts

@@ -0,0 +1,9 @@
+export declare const useParams: () => {
+    get: (key: string) => string | null;
+    set: (key: string, value: string) => void;
+    sets: (entries: Record<string, string>) => void;
+    delete: (key: string) => void;
+    deletes: (keys: string[]) => void;
+    clear: () => void;
+    has: (key: string) => boolean;
+};

package/dist/router/useSearchParams .js

@@ -0,0 +1,50 @@
+import { navigate } from "../navigation/navigate.js";
+import { useEffect, useState } from "react";
+const getParams = () => {
+    return new URLSearchParams(window.location.search);
+};
+export const useParams = () => {
+    const [params, setParams] = useState(getParams());
+    useEffect(() => {
+        const onNavigate = () => setParams(getParams());
+        window.addEventListener("xanix:navigate:end", onNavigate);
+        return () => {
+            window.removeEventListener("xanix:navigate:end", onNavigate);
+        };
+    }, []);
+    return {
+        get: (key) => params.get(key),
+        set: (key, value) => {
+            const newParams = new URLSearchParams(params.toString());
+            newParams.set(key, value);
+            navigate(window.location.pathname + "?" + newParams.toString());
+        },
+        sets: (entries) => {
+            const newParams = new URLSearchParams(params.toString());
+            for (const [key, value] of Object.entries(entries)) {
+                newParams.set(key, value);
+            }
+            navigate(window.location.pathname + "?" + newParams.toString());
+        },
+        delete: (key) => {
+            const newParams = new URLSearchParams(params.toString());
+            newParams.delete(key);
+            setParams(newParams);
+            navigate(window.location.pathname + "?" + newParams.toString());
+        },
+        deletes: (keys) => {
+            const newParams = new URLSearchParams(params.toString());
+            for (const key of keys) {
+                newParams.delete(key);
+            }
+            setParams(newParams);
+            navigate(window.location.pathname + "?" + newParams.toString());
+        },
+        clear: () => {
+            const newParams = new URLSearchParams();
+            setParams(newParams);
+            navigate(window.location.pathname + "?" + newParams.toString());
+        },
+        has: (key) => params.has(key),
+    };
+};

package/dist/router/useSearchParams.d.ts

@@ -0,0 +1,11 @@
+export declare const useSearchParams: () => {
+    get: (key: string) => string | null;
+    getAll: () => any;
+    has: (key: string) => boolean;
+    set: (key: string, value: string) => void;
+    sets: (entries: Record<string, string>) => void;
+    delete: (key: string) => void;
+    deletes: (keys: string[]) => void;
+    clear: () => void;
+    toString: () => string;
+};

package/dist/router/useSearchParams.js

@@ -0,0 +1,80 @@
+import { navigate } from "../navigation/navigate.js";
+import { useEffect, useState } from "react";
+import useDocument from "../document/useDocument.js";
+const getParams = () => {
+    return new URLSearchParams(window.location.search);
+};
+const buildUrl = (params) => {
+    const search = params.toString();
+    return (window.location.pathname +
+        (search ? `?${search}` : "") +
+        window.location.hash);
+};
+export const useSearchParams = () => {
+    const { request } = useDocument();
+    let _params;
+    if (request) {
+        _params = new URLSearchParams(request.url.split("?")[1] || "");
+    }
+    else {
+        _params = getParams();
+    }
+    const [params, setParams] = useState(_params);
+    useEffect(() => {
+        const onNavigate = () => {
+            setParams(getParams());
+        };
+        window.addEventListener("xanix:navigate:end", onNavigate);
+        window.addEventListener("popstate", onNavigate);
+        return () => {
+            window.removeEventListener("xanix:navigate:end", onNavigate);
+            window.removeEventListener("popstate", onNavigate);
+        };
+    }, []);
+    const update = (newParams) => {
+        setParams(newParams);
+        navigate(buildUrl(newParams));
+    };
+    return {
+        get: (key) => params.get(key),
+        getAll: () => {
+            const p = {};
+            for (const [key, value] of params.entries()) {
+                if (!p[key]) {
+                    p[key] = [];
+                }
+                p[key].push(value);
+            }
+            return p;
+        },
+        has: (key) => params.has(key),
+        set: (key, value) => {
+            const newParams = new URLSearchParams(params);
+            newParams.set(key, value);
+            update(newParams);
+        },
+        sets: (entries) => {
+            const newParams = new URLSearchParams(params);
+            for (const [key, value] of Object.entries(entries)) {
+                newParams.set(key, value);
+            }
+            update(newParams);
+        },
+        delete: (key) => {
+            const newParams = new URLSearchParams(params);
+            newParams.delete(key);
+            update(newParams);
+        },
+        deletes: (keys) => {
+            const newParams = new URLSearchParams(params);
+            for (const key of keys) {
+                newParams.delete(key);
+            }
+            update(newParams);
+        },
+        clear: () => {
+            update(new URLSearchParams());
+        },
+        toString: () => params.toString(),
+    };
+};

package/dist/server/index.js

@@ -0,0 +1 @@
+"use strict";

package/dist/server/page.d.ts

@@ -0,0 +1,9 @@
+interface XanixPageProps {
+    pageId: string;
+    req: any;
+    res: any;
+    Component: (props: Record<string, any>) => React.ReactElement;
+    props: Record<string, any>;
+}
+export default function xanix_page({ pageId, req, res, Component, props, }: XanixPageProps): Promise<string | undefined>;
+export {};

package/dist/server/page.js

@@ -0,0 +1,60 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { renderToPipeableStream } from "react-dom/server";
+import readManifest from "./readManifest.js";
+import { PassThrough } from "node:stream";
+import path from "node:path";
+import { pathToFileURL } from "node:url";
+function renderPage(element) {
+    return new Promise((resolve, reject) => {
+        let html = "";
+        const stream = new PassThrough();
+        stream.on("data", (chunk) => {
+            html += chunk.toString();
+        });
+        stream.on("end", () => {
+            resolve(html);
+        });
+        stream.on("error", reject);
+        const { pipe } = renderToPipeableStream(element, {
+            onAllReady() {
+                pipe(stream);
+            },
+            onError(error) {
+                console.error("SSR error:", error);
+            },
+        });
+    });
+}
+export default async function xanix_page({ pageId, req, res, Component, props, }) {
+    const manifest = await readManifest();
+    const { title, meta } = req.XanixPageData;
+    const entry = manifest.entries.find((item) => item.id === pageId);
+    const method = req.method.toUpperCase();
+    if (method !== "GET") {
+        res.status(405).send("Method Not Allowed");
+        return;
+    }
+    if (!entry) {
+        throw new Error(`Xanix client entry "${pageId}" was not found in the manifest.`);
+    }
+    if ("x-navigation" in req.headers) {
+        res.setHeader("Content-Type", "application/json");
+        return JSON.stringify({
+            pageId,
+            props,
+            title: title ?? entry.name.replaceAll("-", " "),
+            meta,
+            request: null,
+        });
+    }
+    const Document = (await import(pathToFileURL(path.join(process.cwd(), ".xanix", "xanix-document.js"))
+        .href)).default;
+    const html = await renderPage(_jsx(Document, { document: {
+            pageId,
+            props,
+            title: title ?? entry.name.replaceAll("-", " "),
+            meta,
+            request: req,
+        }, children: _jsx(Component, { ...props }) }));
+    return `<!DOCTYPE html>${html}`;
+}

package/dist/server/readManifest.d.ts

@@ -0,0 +1,14 @@
+interface XanixManifestEntry {
+    id: string;
+    name: string;
+    file: string;
+    path: string;
+    build: string;
+    export: string;
+}
+interface XanixManifest {
+    version: number;
+    entries: XanixManifestEntry[];
+}
+declare function readManifest(): Promise<XanixManifest>;
+export default readManifest;

package/dist/server/readManifest.js

@@ -0,0 +1,8 @@
+import fs from "node:fs/promises";
+import path from "node:path";
+async function readManifest() {
+    const manifestPath = path.resolve(process.cwd(), ".xanix", "client-manifest.json");
+    const source = await fs.readFile(manifestPath, "utf8");
+    return JSON.parse(source);
+}
+export default readManifest;

package/dist/server/runtime/createServer.d.ts

@@ -0,0 +1,12 @@
+import express from "express";
+export interface XanixProps {
+    clientId: string;
+    req: any;
+    res: any;
+    component: React.ReactElement;
+}
+type Options = {
+    mode: "watch" | "start";
+};
+declare function createXanixServer({ mode }: Options): express.Express;
+export default createXanixServer;

package/dist/server/runtime/createServer.js

@@ -0,0 +1,48 @@
+import express from "express";
+import dataLoader from "../../dataLoader.js";
+function createXanixServer({ mode }) {
+    const app = express();
+    if (mode === "watch") {
+        app.use("/.xanix/client", express.static(".xanix/client"));
+        app.use("/assets", express.static(".xanix/assets"));
+        app.use("/.xanix/cache", express.static(".xanix/cache"));
+    }
+    else {
+        app.use("/.xanix/client", express.static(".xanix/client", {
+            maxAge: "1y",
+            immutable: true,
+            etag: true,
+        }));
+        app.use("/assets", express.static(".xanix/assets", {
+            maxAge: "1y",
+            immutable: true,
+            etag: true,
+        }));
+    }
+    app.post("/.xanix/__data__/:xanixId", express.json(), async (req, res) => {
+        const { xanixId } = req.params;
+        const args = req.body;
+        const data = await dataLoader.result(xanixId, args);
+        res.json({ data });
+    });
+    app.use((req, res, next) => {
+        let data = {
+            title: null,
+            meta: [],
+        };
+        if (!req.page) {
+            req.page = {
+                setTitle(title) {
+                    data.title = title;
+                },
+                setMeta(name, content) {
+                    data.meta.push({ name, content });
+                },
+            };
+            req.XanixPageData = data;
+        }
+        next();
+    });
+    return app;
+}
+export default createXanixServer;

package/dist/server/runtime/index.d.ts

@@ -0,0 +1,3 @@
+import createXanixServer from "./createServer.js";
+import xanixPage from "./xanixPage.js";
+export { createXanixServer, xanixPage };

package/dist/server/runtime/index.js

@@ -0,0 +1,3 @@
+import createXanixServer from "./createServer.js";
+import xanixPage from "./xanixPage.js";
+export { createXanixServer, xanixPage };