xanix 0.0.0 → 1.0.0

package/dist/dataLoader.js

@@ -0,0 +1,46 @@
+let global = typeof window === "undefined" ? globalThis : window;
+global.$XANIXDT_INITIALED = new Map();
+global.$XANIXDT = new Map();
+global.$XANIXDT_PAGES = new Map();
+const register = (xanixId, callback) => {
+    global.$XANIXDT.set(xanixId, { args: {}, callback });
+    return xanixId;
+};
+const registerPage = (pageId, xanixId, args) => {
+    if (!global.$XANIXDT_PAGES.has(pageId)) {
+        global.$XANIXDT_PAGES.set(pageId, []);
+    }
+    global.$XANIXDT_PAGES.get(pageId).push(xanixId);
+    global.$XANIXDT.get(xanixId).args = args;
+    return xanixId;
+};
+const results = async (pageId) => {
+    global.$XANIXDT_INITIALED.set(pageId, true);
+    const page = global.$XANIXDT_PAGES.get(pageId) || [];
+    const datas = {};
+    await Promise.all(page.map(async (xanixId) => {
+        const { callback, args } = global.$XANIXDT.get(xanixId);
+        const data = await callback(args);
+        datas[xanixId] = data;
+    }));
+    return datas;
+};
+const result = async (xanixId, args) => {
+    const item = global.$XANIXDT.get(xanixId);
+    if (item) {
+        const { callback, args: storedArgs } = item;
+        const data = await callback(args ?? storedArgs);
+        return data;
+    }
+};
+const isInit = (pageId) => {
+    return global.$XANIXDT_INITIALED.get(pageId) ?? false;
+};
+const dataLoader = {
+    results,
+    result,
+    isInit,
+    register,
+    registerPage,
+};
+export default dataLoader;

package/dist/document/BaseDocument.d.ts

@@ -0,0 +1,3 @@
+import { DocumentProps } from "./Document.js";
+declare const BaseDocument: ({ document, children }: DocumentProps) => import("react").JSX.Element;
+export default BaseDocument;

package/dist/document/BaseDocument.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Head from "./Head.js";
+import Body from "./Body.js";
+import Document from "./Document.js";
+const BaseDocument = ({ document, children }) => {
+    return (_jsxs(Document, { document: document, children: [_jsxs(Head, { children: [_jsx("meta", { charSet: "UTF-8" }), _jsx("meta", { name: "viewport", content: "width=device-width, initial-scale=1.0" })] }), _jsx(Body, { children: children })] }));
+};
+export default BaseDocument;

package/dist/document/Body.d.ts

@@ -0,0 +1,5 @@
+type BodyProps = {
+    children?: React.ReactNode;
+};
+declare const Body: ({ children }: BodyProps) => string | number | bigint | boolean | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("react").JSX.Element | null | undefined;
+export default Body;

package/dist/document/Body.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+const Body = ({ children }) => {
+    const isClient = typeof window !== "undefined";
+    if (isClient) {
+        return children;
+    }
+    return _jsx("body", { children: children });
+};
+export default Body;

package/dist/document/Document/Document.d.ts

@@ -0,0 +1,7 @@
+import { DocumentContextData } from "../context.js";
+export type DocumentProps = {
+    children?: React.ReactNode;
+    document: DocumentContextData;
+};
+declare const Document: ({ children, document }: DocumentProps) => import("react").JSX.Element;
+export default Document;

package/dist/document/Document/Document.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DocumentProvider } from "../context.js";
+const Document = ({ children, document }) => {
+    const isClient = typeof window !== "undefined";
+    if (isClient) {
+        return _jsx(DocumentProvider, { value: document, children: children });
+    }
+    return (_jsx(DocumentProvider, { value: document, children: _jsx("html", { children: children }) }));
+};
+export default Document;

package/dist/document/Document/context.d.ts

@@ -0,0 +1,17 @@
+export type DocumentContextData = {
+    pageId: string;
+    props: Record<string, any>;
+    title: string;
+    meta: Array<{
+        name: string;
+        content: string;
+    }>;
+    request?: Express.Request;
+};
+export declare const DocumentContext: import("react").Context<DocumentContextData | null>;
+export declare const useDocument: () => DocumentContextData;
+export type DocumentProviderProps = {
+    children: React.ReactNode;
+    value: DocumentContextData;
+};
+export declare const DocumentProvider: ({ children, value, }: DocumentProviderProps) => import("react").JSX.Element;

package/dist/document/Document/context.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext } from "react";
+export const DocumentContext = createContext(null);
+export const useDocument = () => {
+    const context = useContext(DocumentContext);
+    if (!context) {
+        throw new Error("useDocument must be used within a DocumentProvider");
+    }
+    return context;
+};
+export const DocumentProvider = ({ children, value, }) => {
+    return (_jsx(DocumentContext.Provider, { value: value, children: children }));
+};

package/dist/document/Document/index.d.ts

@@ -0,0 +1,7 @@
+import { DocumentContextData } from "../context.js";
+export type DocumentProps = {
+    children?: React.ReactNode;
+    document: DocumentContextData;
+};
+declare const Document: ({ children, document }: DocumentProps) => import("react").JSX.Element;
+export default Document;

package/dist/document/Document/index.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DocumentProvider } from "../context.js";
+const Document = ({ children, document }) => {
+    const isClient = typeof window !== "undefined";
+    if (isClient) {
+        return _jsx(DocumentProvider, { value: document, children: children });
+    }
+    return (_jsx(DocumentProvider, { value: document, children: _jsx("html", { children: children }) }));
+};
+export default Document;

package/dist/document/Document.d.ts

@@ -0,0 +1,7 @@
+import { DocumentContextData } from "./DocumentContext.js";
+export type DocumentProps = {
+    children?: React.ReactNode;
+    document: DocumentContextData;
+};
+declare const Document: ({ children, document }: DocumentProps) => import("react").JSX.Element;
+export default Document;

package/dist/document/Document.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DocumentProvider } from "./DocumentContext.js";
+const Document = ({ children, document }) => {
+    const isClient = typeof window !== "undefined";
+    if (isClient) {
+        return _jsx(DocumentProvider, { value: document, children: children });
+    }
+    return (_jsx(DocumentProvider, { value: document, children: _jsx("html", { children: children }) }));
+};
+export default Document;

package/dist/document/DocumentContext.d.ts

@@ -0,0 +1,17 @@
+import type { Request } from "express";
+export type DocumentContextData = {
+    pageId: string;
+    props: Record<string, any>;
+    title: string;
+    meta: Array<{
+        name: string;
+        content: string;
+    }>;
+    request?: Request;
+};
+export declare const DocumentContext: import("react").Context<DocumentContextData | null>;
+export type DocumentProviderProps = {
+    children: React.ReactNode;
+    value: DocumentContextData;
+};
+export declare const DocumentProvider: ({ children, value, }: DocumentProviderProps) => import("react").JSX.Element;

package/dist/document/DocumentContext.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext } from "react";
+export const DocumentContext = createContext(null);
+export const DocumentProvider = ({ children, value, }) => {
+    return (_jsx(DocumentContext.Provider, { value: value, children: children }));
+};

package/dist/document/Head.d.ts

@@ -0,0 +1,5 @@
+type HeadProps = {
+    children?: React.ReactNode;
+};
+declare const Head: ({ children }: HeadProps) => import("react").JSX.Element;
+export default Head;

package/dist/document/Head.js

@@ -0,0 +1,40 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect } from "react";
+import useDocument from "./useDocument.js";
+const Head = ({ children }) => {
+    const { title, meta, pageId, props } = useDocument();
+    useEffect(() => {
+        document.title = title || "";
+        meta?.forEach(({ name, content }) => {
+            let element = document.querySelector(`meta[name="${name}"]`);
+            if (!element) {
+                element = document.createElement("meta");
+                element.setAttribute("name", name);
+                document.head.appendChild(element);
+            }
+            element.setAttribute("content", content);
+        });
+        // add children
+        const head = document.head;
+        if (children) {
+            const container = document.createElement("div");
+            container.innerHTML = children;
+            Array.from(container.children).forEach((child) => {
+                head.appendChild(child);
+            });
+        }
+    }, [children]);
+    if (typeof window !== "undefined")
+        return _jsx(_Fragment, {});
+    return (_jsxs("head", { children: [_jsx("title", { children: title }), meta?.map(({ name, content }) => (_jsx("meta", { name: name, content: content }, name))), children, _jsx("script", { id: pageId, dangerouslySetInnerHTML: {
+                    __html: `window.XANIX_DOCUMENT = ${JSON.stringify({
+                        pageId,
+                        props,
+                        meta,
+                        title,
+                        request: null,
+                    })};
+        `,
+                } }), _jsx("script", { type: "module", src: "/.xanix/client/xanix-runtime.js" })] }));
+};
+export default Head;

package/dist/document/Link.d.ts

@@ -0,0 +1,7 @@
+import { HTMLProps } from "react";
+export type LinkProps = Omit<HTMLProps<HTMLAnchorElement>, "href" | "preload"> & {
+    preload?: boolean;
+    href: string;
+};
+declare const Link: ({ children, preload, ...props }: LinkProps) => import("react").JSX.Element;
+export default Link;

package/dist/document/Link.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef } from "react";
+import { navigate } from "../navigation/navigate.js";
+const Link = ({ children, preload, ...props }) => {
+    const ref = useRef(null);
+    useEffect(() => {
+        const load = () => {
+            window.dispatchEvent(new CustomEvent("xanix:preload", { detail: { path: props.href } }));
+        };
+        if (preload && ref.current) {
+            ref.current.addEventListener("mouseenter", load);
+        }
+        return () => {
+            if (preload && ref.current) {
+                ref.current.removeEventListener("mouseenter", load);
+            }
+        };
+    }, []);
+    if (preload) {
+        props.onMouseEnter;
+    }
+    return (_jsx("a", { ref: ref, ...props, onClick: (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+            navigate(props.href);
+        }, children: children }));
+};
+export default Link;

package/dist/document/Script.d.ts

@@ -0,0 +1,3 @@
+type ScriptProps = React.DetailedHTMLProps<React.ScriptHTMLAttributes<HTMLScriptElement>, HTMLScriptElement>;
+declare const Script: ({ children, ...props }: ScriptProps) => import("react").JSX.Element;
+export default Script;

package/dist/document/Script.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+const Script = ({ children, ...props }) => {
+    return _jsx("script", { ...props, children: children });
+};
+export default Script;

package/dist/document/context.d.ts

@@ -0,0 +1,17 @@
+export type DocumentContextData = {
+    pageId: string;
+    props: Record<string, any>;
+    title: string;
+    meta: Array<{
+        name: string;
+        content: string;
+    }>;
+    request?: Express.Request;
+};
+export declare const DocumentContext: import("react").Context<DocumentContextData | null>;
+export declare const useDocument: () => DocumentContextData;
+export type DocumentProviderProps = {
+    children: React.ReactNode;
+    value: DocumentContextData;
+};
+export declare const DocumentProvider: ({ children, value, }: DocumentProviderProps) => import("react").JSX.Element;

package/dist/document/context.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext } from "react";
+export const DocumentContext = createContext(null);
+export const useDocument = () => {
+    const context = useContext(DocumentContext);
+    if (!context) {
+        throw new Error("useDocument must be used within a DocumentProvider");
+    }
+    return context;
+};
+export const DocumentProvider = ({ children, value, }) => {
+    return (_jsx(DocumentContext.Provider, { value: value, children: children }));
+};

package/dist/document/index.d.ts

@@ -0,0 +1,8 @@
+import Document, { DocumentProps } from "./Document.js";
+import useDocument from "./useDocument.js";
+import Head from "./Head.js";
+import Body from "./Body.js";
+import Link from "./Link.js";
+import Script from "./Script.js";
+export { Document, Head, Body, Link, Script, useDocument };
+export type { DocumentProps };

package/dist/document/index.js

@@ -0,0 +1,7 @@
+import Document from "./Document.js";
+import useDocument from "./useDocument.js";
+import Head from "./Head.js";
+import Body from "./Body.js";
+import Link from "./Link.js";
+import Script from "./Script.js";
+export { Document, Head, Body, Link, Script, useDocument };

package/dist/document/useDocument.d.ts

@@ -0,0 +1,2 @@
+declare const useDocument: () => import("./DocumentContext").DocumentContextData;
+export default useDocument;

package/dist/document/useDocument.js

@@ -0,0 +1,10 @@
+import { DocumentContext } from "./DocumentContext";
+import { useContext } from "react";
+const useDocument = () => {
+    const context = useContext(DocumentContext);
+    if (!context) {
+        throw new Error("useDocument must be used within a DocumentProvider");
+    }
+    return context;
+};
+export default useDocument;

package/dist/hooks/useCookies.d.ts

@@ -0,0 +1,2 @@
+declare const useCookies: () => Record<string, string> | undefined;
+export default useCookies;

package/dist/hooks/useCookies.js

@@ -0,0 +1,11 @@
+import useHeaders from "./useHeaders.js";
+const useCookies = () => {
+    const headers = useHeaders();
+    let cookies = __XANIX_SERVER__ ? headers?.cookie : document.cookie;
+    return cookies?.split(";").reduce((cookies, cookie) => {
+        const [name, value] = cookie.split("=");
+        cookies[name.trim()] = value;
+        return cookies;
+    }, {});
+};
+export default useCookies;

package/dist/hooks/useData.d.ts

@@ -0,0 +1,18 @@
+type Callback = (args: Record<string, any>) => Promise<any>;
+declare const useData: {
+    (_callback: Callback, _args?: Record<string, any>): {
+        data: any;
+        loading: boolean;
+        reload: () => Promise<void>;
+    };
+    register(xanixId: string, callback: Callback): ((args?: Record<string, any>) => Promise<{
+        data: any;
+        loading: boolean;
+        reload: () => Promise<void>;
+    }>) | ((args?: Record<string, any>) => {
+        data: any;
+        loading: boolean;
+        reload: () => Promise<void>;
+    });
+};
+export default useData;

package/dist/hooks/useData.js

@@ -0,0 +1,69 @@
+import usePage from "./usePage.js";
+import React, { useEffect, useRef } from "react";
+import useDocument from "./useDocument.js";
+import loader from "../dataLoader.js";
+const useData = (_callback, _args) => {
+    return {};
+};
+useData.register = (xanixId, callback) => {
+    if (__XANIX_SERVER__) {
+        loader.register(xanixId, callback);
+    }
+    if (__XANIX_SERVER__) {
+        return async (args) => {
+            const page = usePage();
+            const doc = useDocument();
+            loader.registerPage(page.pageId, xanixId, args ?? {});
+            const pageData = doc.pageData || {};
+            const itemData = pageData[xanixId];
+            return {
+                data: itemData,
+                loading: false,
+                reload: async () => { },
+            };
+        };
+    }
+    else {
+        return (args) => {
+            const doc = useDocument();
+            const pageData = doc.pageData || {};
+            const itemData = pageData[xanixId];
+            const [loading, setLoading] = React.useState(!itemData);
+            const [data, setData] = React.useState(itemData);
+            const init = useRef(false);
+            const reload = async () => {
+                setLoading(true);
+                const res = await fetch(`/.xanix/__data__/${xanixId}`, {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify(args ?? {}),
+                });
+                try {
+                    const result = await res.json();
+                    setData(result.data);
+                }
+                catch (error) {
+                    console.error(error);
+                }
+                setLoading(false);
+            };
+            useEffect(() => {
+                if (init.current) {
+                    reload();
+                }
+                else if (!itemData) {
+                    reload();
+                }
+                init.current = true;
+            }, [JSON.stringify(args)]);
+            return {
+                data,
+                loading,
+                reload,
+            };
+        };
+    }
+};
+export default useData;

package/dist/hooks/useDocument.d.ts

@@ -0,0 +1,2 @@
+declare const useDocument: () => import("../components/DocumentContext.js").DocumentContextData;
+export default useDocument;

package/dist/hooks/useDocument.js

@@ -0,0 +1,10 @@
+import { DocumentContext } from "../components/DocumentContext.js";
+import { useContext } from "react";
+const useDocument = () => {
+    const context = useContext(DocumentContext);
+    if (!context) {
+        throw new Error("useDocument must be used within a DocumentProvider");
+    }
+    return context;
+};
+export default useDocument;

package/dist/hooks/useHeaders.d.ts

@@ -0,0 +1,2 @@
+declare const useHeaders: () => import("node:http").IncomingHttpHeaders | undefined;
+export default useHeaders;

package/dist/hooks/useHeaders.js

@@ -0,0 +1,9 @@
+import useRequest from "./useRequest.js";
+const useHeaders = () => {
+    const request = useRequest();
+    if (__XANIX_SERVER__) {
+        return request?.headers;
+    }
+    return {};
+};
+export default useHeaders;

package/dist/hooks/useLocation.d.ts

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

package/dist/hooks/useLocation.js

@@ -0,0 +1,25 @@
+import { useState, useEffect } from "react";
+import useRequest from "./useRequest.js";
+const useLocation = () => {
+    const req = useRequest();
+    let _url = __XANIX_SERVER__
+        ? new URL(req.originalUrl, `${req.protocol}://${req.get("host")}`)
+        : new URL(window.location.href);
+    const [url, setUrl] = useState(_url);
+    useEffect(() => {
+        const onNavigate = (e) => {
+            const path = e.detail.path;
+            const url = new URL(path, window.location.origin);
+            const newUrl = new URL(window.location.href);
+            if (url.href === newUrl.href)
+                return;
+            setUrl(newUrl);
+        };
+        window.addEventListener("xanix:navigate:end", onNavigate);
+        return () => {
+            window.removeEventListener("xanix:navigate:end", onNavigate);
+        };
+    }, []);
+    return url;
+};
+export default useLocation;

package/dist/hooks/usePage.d.ts

@@ -0,0 +1,5 @@
+declare const usePage: () => {
+    pageId: any;
+    props: any;
+};
+export default usePage;

package/dist/hooks/usePage.js

@@ -0,0 +1,9 @@
+import useDocument from "./useDocument.js";
+const usePage = () => {
+    const { pageId, props } = useDocument();
+    return {
+        pageId,
+        props,
+    };
+};
+export default usePage;

package/dist/hooks/useParams.d.ts

@@ -0,0 +1,2 @@
+declare const useParams: () => Record<string, string>;
+export default useParams;

package/dist/hooks/useParams.js

@@ -0,0 +1,6 @@
+import useDocument from "../hooks/useDocument.js";
+const useParams = () => {
+    const { params } = useDocument();
+    return params;
+};
+export default useParams;

package/dist/hooks/usePathname.d.ts

@@ -0,0 +1,2 @@
+declare const usePathname: () => string | undefined;
+export default usePathname;

package/dist/hooks/usePathname.js

@@ -0,0 +1,9 @@
+import useRequest from "./useRequest.js";
+const usePathname = () => {
+    if (__XANIX_CLIENT__) {
+        return window.location.pathname;
+    }
+    const request = useRequest();
+    return request?.path;
+};
+export default usePathname;

package/dist/hooks/useRequest.d.ts

@@ -0,0 +1,2 @@
+declare const useRequest: () => import("express").Request<import("express-serve-static-core").ParamsDictionary, any, any, import("qs").ParsedQs, Record<string, any>> | undefined;
+export default useRequest;

package/dist/hooks/useRequest.js

@@ -0,0 +1,8 @@
+import useDocument from "./useDocument.js";
+const useRequest = () => {
+    const { request } = useDocument();
+    if (__XANIX_SERVER__) {
+        return request;
+    }
+};
+export default useRequest;

package/dist/hooks/useSearchParams.d.ts

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