eddev 2.0.0-beta.2 → 2.0.0-beta.21

package/dist/app/lib/routing/components/SSRRouter.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Suspense } from "react";
-import { RouterContext, RouterStateContext } from "../context";
-import { useRouter } from "../hooks/useRouter";
-import { useRouterState } from "../hooks/useRouterState";
-import { AppRenderer } from "./RouteRenderer";
+import { RouterContext, RouterStateContext } from "../context.js";
+import { useRouter } from "../hooks/useRouter.js";
+import { useRouterState } from "../hooks/useRouterState.js";
+import { AppRenderer } from "./RouteRenderer.js";
 export function SSRRouter(props) {
     const router = useRouter();
     const routerState = useRouterState();

package/dist/app/lib/routing/components/ScrollRestoration.js

@@ -1,4 +1,4 @@
-import { useRouterEvents } from "../hooks/useRouterEvents";
+import { useRouterEvents } from "../hooks/useRouterEvents.js";
 /**
  * Enables scroll restoration when navigation backwards, as well as resetting scroll position when navigating forwards.
  */

package/dist/app/lib/routing/context.d.ts

@@ -1,5 +1,5 @@
 import { Context } from "react";
-import { RouterAPI, RouterAPIState } from "./types";
+import { RouterAPI, RouterAPIState } from "./types.js";
 export declare const RouterContext: Context<RouterAPI>;
 export declare const RouterStateContext: Context<RouterAPIState>;
-export declare const RouteItemContext: Context<import("./types").TypedRouteState<"_unknown", {}>>;
+export declare const RouteItemContext: Context<import("./types.js").TypedRouteState<"_unknown", {}>>;

package/dist/app/lib/routing/context.js

@@ -1,5 +1,5 @@
 import { createContext } from "react";
-import { RouteLoader } from "./loader";
+import { RouteLoader } from "./loader.js";
 const NOOP_ROUTE = {
     component: () => null,
     id: "initial",

package/dist/app/lib/routing/hooks/useRestorableState.js

@@ -1,5 +1,6 @@
 import { useState } from "react";
-import { useRoute, useRouterEvents } from "..";
+import { useRouterEvents } from "./useRouterEvents.js";
+import { useRoute } from "./useRoute.js";
 /**
  * Works exactly like useState, but allows back and forward navigation to restore the previous state.
  * You must pass a unique ID as an additional first parameter to ensure the state is restored correctly.

package/dist/app/lib/routing/hooks/useRoute.d.ts

@@ -1,2 +1,2 @@
-import { RouteState } from "../types";
+import type { RouteState } from "../types.js";
 export declare function useRoute(): RouteState;

package/dist/app/lib/routing/hooks/useRoute.js

@@ -1,5 +1,5 @@
 import { useContext } from "react";
-import { RouteItemContext } from "../context";
+import { RouteItemContext } from "../context.js";
 export function useRoute() {
     return useContext(RouteItemContext);
 }

package/dist/app/lib/routing/hooks/useRouteTransition.d.ts

@@ -1,4 +1,4 @@
-import type { RouteState } from "../types";
+import type { RouteState } from "../types.js";
 type TransitionFunction = (currentRoute: RouteState, nextRoute: RouteState) => void | Promise<any | void>;
 export declare function useRouteTransition(func: TransitionFunction): void;
 export {};

package/dist/app/lib/routing/hooks/useRouteTransition.js

@@ -1,5 +1,5 @@
 import { useEffect, useRef } from "react";
-import { useRouter } from "./useRouter";
+import { useRouter } from "./useRouter.js";
 export function useRouteTransition(func) {
     const subscribe = useRouter((r) => r.subscribe);
     const handler = useRef(func);

package/dist/app/lib/routing/hooks/useRouter.d.ts

@@ -1,2 +1,2 @@
-import { RouterAPI } from "../types";
+import { RouterAPI } from "../types.js";
 export declare function useRouter<T = RouterAPI>(selector?: (r: RouterAPI) => T): T;

package/dist/app/lib/routing/hooks/useRouter.js

@@ -1,5 +1,5 @@
 import { useContext } from "react";
-import { RouterContext } from "../context";
+import { RouterContext } from "../context.js";
 export function useRouter(selector) {
     const router = useContext(RouterContext);
     if (selector) {

package/dist/app/lib/routing/hooks/useRouterEvents.d.ts

@@ -1,2 +1,2 @@
-import type { RouterEvent } from "../types";
+import type { RouterEvent } from "../types.js";
 export declare function useRouterEvents(handler: (event: RouterEvent) => void): void;

package/dist/app/lib/routing/hooks/useRouterEvents.js

@@ -1,5 +1,5 @@
 import { useEffect, useRef } from "react";
-import { useRouter } from "./useRouter";
+import { useRouter } from "./useRouter.js";
 export function useRouterEvents(handler) {
     const subscribe = useRouter((r) => r.subscribe);
     const ref = useRef(handler);

package/dist/app/lib/routing/hooks/useRouterState.d.ts

@@ -1,2 +1,2 @@
-import { RouterAPIState } from "../types";
+import { RouterAPIState } from "../types.js";
 export declare function useRouterState<T = RouterAPIState>(selector?: (state: RouterAPIState) => T): T;

package/dist/app/lib/routing/hooks/useRouterState.js

@@ -1,5 +1,5 @@
 import { useContext } from "react";
-import { RouterStateContext } from "../context";
+import { RouterStateContext } from "../context.js";
 export function useRouterState(selector) {
     const ctx = useContext(RouterStateContext);
     if (selector)

package/dist/app/lib/routing/hooks/useSearchParams.js

@@ -1,6 +1,6 @@
 import { useMemo } from "react";
-import { useRoute } from "./useRoute";
-import { useRouter } from "./useRouter";
+import { useRoute } from "./useRoute.js";
+import { useRouter } from "./useRouter.js";
 export function useSearchParams(defaultValue) {
     const route = useRoute();
     const replaceQuery = useRouter((r) => r.replaceQuery);

package/dist/app/lib/routing/index.d.ts

@@ -1,13 +1,13 @@
-export * from "./types";
-export * from "./components/Link";
-export * from "./components/ScrollRestoration";
-export * from "./components/RouteRenderer";
-export * from "./components/ClientOnly";
-export * from "./hooks/useRoute";
-export * from "./hooks/useRouteTransition";
-export * from "./hooks/useRouter";
-export * from "./hooks/useRouterEvents";
-export * from "./hooks/useRouterState";
-export * from "./hooks/useRestorableState";
-export * from "./hooks/useIsSSR";
-export * from "./hooks/useSearchParams";
+export * from "./types.js";
+export * from "./components/Link.js";
+export * from "./components/ScrollRestoration.js";
+export * from "./components/RouteRenderer.js";
+export * from "./components/ClientOnly.js";
+export * from "./hooks/useRoute.js";
+export * from "./hooks/useRouteTransition.js";
+export * from "./hooks/useRouter.js";
+export * from "./hooks/useRouterEvents.js";
+export * from "./hooks/useRouterState.js";
+export * from "./hooks/useRestorableState.js";
+export * from "./hooks/useIsSSR.js";
+export * from "./hooks/useSearchParams.js";

package/dist/app/lib/routing/index.js

@@ -1,13 +1,13 @@
-export * from "./types";
-export * from "./components/Link";
-export * from "./components/ScrollRestoration";
-export * from "./components/RouteRenderer";
-export * from "./components/ClientOnly";
-export * from "./hooks/useRoute";
-export * from "./hooks/useRouteTransition";
-export * from "./hooks/useRouter";
-export * from "./hooks/useRouterEvents";
-export * from "./hooks/useRouterState";
-export * from "./hooks/useRestorableState";
-export * from "./hooks/useIsSSR";
-export * from "./hooks/useSearchParams";
+export * from "./types.js";
+export * from "./components/Link.js";
+export * from "./components/ScrollRestoration.js";
+export * from "./components/RouteRenderer.js";
+export * from "./components/ClientOnly.js";
+export * from "./hooks/useRoute.js";
+export * from "./hooks/useRouteTransition.js";
+export * from "./hooks/useRouter.js";
+export * from "./hooks/useRouterEvents.js";
+export * from "./hooks/useRouterState.js";
+export * from "./hooks/useRestorableState.js";
+export * from "./hooks/useIsSSR.js";
+export * from "./hooks/useSearchParams.js";

package/dist/app/lib/routing/loader.d.ts

@@ -1,6 +1,6 @@
 import { FunctionComponent, PropsWithChildren } from "react";
-import { DynamicComponent } from "../dynamic/dynamic";
-import { RouteData } from "./types";
+import { DynamicComponent } from "../dynamic/dynamic.js";
+import { RouteData } from "./types.js";
 export type RouteCacheEntry = {
     data: RouteData;
     component: FunctionComponent;

package/dist/app/lib/routing/loader.js

@@ -1,5 +1,5 @@
 import { parseURL, stringifyParsedURL, stringifyQuery, withTrailingSlash } from "ufo";
-import { viewManifestReader } from "../internal";
+import { viewManifestReader } from "../internal/read-view-manifest.js";
 export class RouteError extends Error {
     message;
     statusCode;
@@ -31,10 +31,12 @@ export class RouteLoader {
         const origin = parseURL(sampleUrl);
         let propsPath = withTrailingSlash(pathname);
         let query = {};
-        if (opts.serverless) {
-            query["_debug"] = opts.debug ? "1" : "0";
-            query["_props"] = opts.appData ? "all" : "1";
-            query["_ssr"] = "1";
+        if (env.serverless && env.client) {
+            propsPath = "/_data/route" + propsPath;
+            query = {};
+            // query["_debug"] = opts.debug ? "1" : "0"
+            // query["_props"] = opts.appData ? "all" : "1"
+            // query["_ssr"] = "1"
         }
         else {
             query["_debug"] = opts.debug ? "1" : "0";

package/dist/app/lib/routing/types.d.ts

@@ -1,6 +1,6 @@
 import { FunctionComponent } from "react";
-import type { RouteLoader } from "./loader";
-import { LinkHandlerMode, PointerOrMouseEvent } from "./utils";
+import type { RouteLoader } from "./loader.js";
+import { LinkHandlerMode, PointerOrMouseEvent } from "./utils.js";
 export type ParsedRouteTags = Record<"title" | "meta" | "script" | "style" | "link", {
     [key: string]: string;
 }[]>;

package/dist/app/lib/routing/utils.d.ts

@@ -1,5 +1,5 @@
 import { MouseEvent as ReactMouseEvent, PointerEvent as ReactPointerEvent } from "react";
-import { RouteLink, RouteState } from "./types";
+import { RouteLink, RouteState } from "./types.js";
 export declare function isSameOrigin(url: string): boolean;
 export type PointerOrMouseEvent = MouseEvent | PointerEvent | ReactMouseEvent | ReactPointerEvent;
 export type LinkHandlerMode = {

package/dist/app/lib/views/index.d.ts

@@ -1 +1 @@
-export * from "./defineView";
+export * from "./defineView.js";

package/dist/app/lib/views/index.js

@@ -1 +1 @@
-export * from "./defineView";
+export * from "./defineView.js";

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

@@ -0,0 +1,3 @@
+export * from "./render-ssr-page.js";
+export * from "./server-context.js";
+export * from "./proxy-wp-admin.js";

package/dist/app/server/index.js

@@ -0,0 +1,3 @@
+export * from "./render-ssr-page.js";
+export * from "./server-context.js";
+export * from "./proxy-wp-admin.js";

package/dist/app/server/proxy-wp-admin.d.ts

@@ -0,0 +1,3 @@
+import { EventHandlerRequest, H3Event } from "vinxi/http";
+import { ServerContext } from "./server-context.js";
+export declare function proxyWpAdmin(event: H3Event<EventHandlerRequest>, serverContext: ServerContext): Promise<Response>;

package/dist/app/server/proxy-wp-admin.js

@@ -0,0 +1,105 @@
+/// <reference types="vinxi/types/server" />
+import { splitSetCookieString } from "cookie-es";
+import { getProxyRequestHeaders, getRequestURL, getWebRequest } from "vinxi/http";
+export async function proxyWpAdmin(event, serverContext) {
+    const replaceUrls = serverContext.replaceUrls;
+    const req = getWebRequest(event);
+    const proxyUrl = serverContext.getOriginUrl(getRequestURL(event).href);
+    // Prepare request headers to be sent to the origin server
+    const proxyHeaders = getProxyRequestHeaders(event);
+    proxyHeaders["X-ED-Dev-Proxy"] = "true";
+    // Forward the request to the origin server
+    const response = await fetch(proxyUrl, {
+        method: req.method,
+        referrer: req.referrer,
+        referrerPolicy: req.referrerPolicy,
+        headers: proxyHeaders,
+        body: req.method.match(/get|head|options/i) ? undefined : await req.blob(),
+        redirect: "manual",
+        cache: "no-cache",
+    });
+    const contentType = response.headers.get("content-type");
+    let body;
+    let res = { status: response.status, statusText: response.statusText, headers: new Headers() };
+    const cookies = [];
+    response.headers.forEach((value, key) => {
+        if (key === "content-encoding" || key === "content-length" || key === "transfer-encoding") {
+            return;
+        }
+        if (key === "set-cookie") {
+            cookies.push(...splitSetCookieString(value));
+            return;
+        }
+        if (key === "location" && replaceUrls) {
+            value = replaceUrls(value);
+        }
+        res.headers.set(key, value);
+    });
+    // Set cookies in the response headers
+    // TODO: May need to rewrite cookie domain here before setting.
+    if (cookies.length > 0) {
+        for (const cookie of cookies) {
+            res.headers.append("set-cookie", cookie);
+        }
+    }
+    // Replace URLs pointing to the origin server from the response itself
+    // This is only done for text-based content types, like application/json, text/plain, text/html etc
+    if (contentType?.match(/(application|text)\//)) {
+        if (replaceUrls) {
+            body = replaceUrls((await response.text()) ?? "");
+        }
+        // If the content type is text/html, inject the Vite assets into the response — assuming the placeholder comments are found
+        if (contentType.startsWith("text/html")) {
+            const clientManifest = serverContext.getManifest("admin");
+            const assets = await clientManifest.inputs[clientManifest.handler].assets();
+            body = body.replace("<!---VITE_HEADER--->", () => assets.map((asset) => renderAsset(asset)).join("\n"));
+            body = body.replace("<!---VITE_FOOTER--->", () => renderAsset({
+                tag: "script",
+                attrs: {
+                    type: "module",
+                    src: clientManifest.inputs[clientManifest.handler].output.path,
+                },
+                children: "",
+            }));
+        }
+    }
+    else {
+        // Otherwise just stream the response as is
+        body = response.body;
+    }
+    return new Response(body, res);
+}
+function printElement(element, props, innerText) {
+    if (typeof innerText === "string") {
+        return `<${element}${Object.entries(props)
+            .map(([key, value]) => ` ${key}="${value}"`)
+            .join("")}>${innerText}</${element}>`;
+    }
+    else {
+        return `<${element}${Object.entries(props)
+            .map(([key, value]) => ` ${key}="${value}"`)
+            .join("")} />`;
+    }
+}
+function renderAsset({ tag, attrs: { key, ...attrs } = {}, children, }) {
+    switch (tag) {
+        case "script":
+            if (attrs.src) {
+                return printElement("script", { ...attrs, key: attrs.src }, "");
+            }
+            else {
+                return printElement("script", {
+                    ...attrs,
+                    key: key,
+                }, children ?? "");
+            }
+        case "link":
+            return printElement("link", { ...attrs, key: key });
+        case "style":
+            return printElement("style", {
+                ...attrs,
+                key: key,
+            }, children ?? "");
+    }
+    return "";
+}

package/dist/app/server/render-ssr-page.d.ts

@@ -0,0 +1,3 @@
+import type { RouteData } from "../lib/routing/types.js";
+import { ServerContext } from "./server-context.js";
+export declare function renderPageToSSRStream(pathname: string, initialData: RouteData, serverContext: ServerContext): Promise<unknown>;

package/dist/app/server/render-ssr-page.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { renderAsset } from "@vinxi/react";
+import { Suspense } from "react";
+import { renderToPipeableStream } from "react-dom/server";
+import { SSRRoot } from "../entry/ssr-root.js";
+import { RouteLoader } from "../lib/routing/loader.js";
+export async function renderPageToSSRStream(pathname, initialData, serverContext) {
+    const clientManifest = serverContext.getManifest("client");
+    const assets = await clientManifest.inputs[clientManifest.handler].assets();
+    const jsx = (_jsx(SSRRoot, { assets: _jsx(Suspense, { children: assets.map((m) => renderAsset(m)) }), pathname: pathname, initialData: initialData, loader: new RouteLoader() }));
+    const stream = await new Promise(async (resolve) => {
+        const stream = renderToPipeableStream(jsx, {
+            onShellReady() {
+                resolve(stream);
+            },
+            bootstrapModules: [clientManifest.inputs[clientManifest.handler].output.path],
+            bootstrapScriptContent: `window.manifest = ${JSON.stringify(await clientManifest.json())}; window._PAGE_DATA = ${JSON.stringify(initialData)}`,
+        });
+    });
+    return stream;
+}

package/dist/app/server/server-context.d.ts

@@ -0,0 +1,37 @@
+import { RequestHeaders } from "vinxi/http";
+import { UrlReplacerConf } from "./utils/replace-host.js";
+import { Manifest } from "vinxi/dist/types/types/manifest";
+export type ServerContextArgs = {
+    dev: boolean;
+    origin: string;
+    getManifest: (name: string) => Manifest;
+    replaceUrls?: UrlReplacerConf;
+};
+export declare class ServerContext {
+    dev: boolean;
+    origin: string;
+    getManifest: (name: string) => Manifest;
+    replaceUrls?: (text: string) => string;
+    constructor(conf: ServerContextArgs);
+    getOriginUrl(url: string): string;
+    fetchOrigin(url: string, opts?: RequestInit & {
+        replaceUrls?: boolean;
+    }): Promise<Response>;
+    fetchRouteData(req: {
+        pathname: string;
+        query?: Record<string, any>;
+        headers?: RequestHeaders;
+        withAppData?: boolean;
+    }): Promise<Response>;
+    extractRequestHeaders(req?: RequestHeaders): Partial<Record<import("vinxi/http").HTTPHeaderName, string | undefined>>;
+    fetchNamedQuery(req: {
+        name: string;
+        params: object;
+        headers: RequestHeaders;
+    }): Promise<Response>;
+    fetchMutation(req: {
+        name: string;
+        body: object;
+        headers: RequestHeaders;
+    }): Promise<Response>;
+}

package/dist/app/server/server-context.js

@@ -0,0 +1,118 @@
+import { parseURL, stringifyParsedURL, withQuery } from "ufo";
+import { filterHeader } from "./utils/headers.js";
+import { createUrlReplacer } from "./utils/replace-host.js";
+const PROXY_RESPONSE_HEADERS = ["content-type", "set-cookie", /^x-/, "cache-control"];
+const PROXY_REQUEST_HEADERS = [
+    "content-type",
+    "accept",
+    "accept-encoding",
+    "accept-language",
+    "origin",
+    "referer",
+    "user-agent",
+    "authorization",
+];
+export class ServerContext {
+    dev;
+    origin;
+    getManifest;
+    replaceUrls;
+    constructor(conf) {
+        this.dev = conf.dev;
+        this.origin = conf.origin;
+        this.getManifest = conf.getManifest;
+        if (conf.replaceUrls) {
+            this.replaceUrls = createUrlReplacer(conf.replaceUrls);
+        }
+    }
+    getOriginUrl(url) {
+        const parsed = parseURL(url);
+        const parsedOrigin = parseURL(this.origin);
+        parsed.host = parsedOrigin.host;
+        parsed.protocol = parsedOrigin.protocol;
+        return stringifyParsedURL(parsed);
+    }
+    async fetchOrigin(url, opts) {
+        url = this.getOriginUrl(url);
+        const response = await fetch(url, {
+            ...opts,
+            headers: {
+                "Content-Type": "application/json",
+                Accept: "application/json",
+                ...opts?.headers,
+            },
+        });
+        if (!response.ok) {
+            return response;
+        }
+        const headers = {};
+        response.headers.forEach((value, key) => {
+            if (filterHeader(key, PROXY_RESPONSE_HEADERS)) {
+                headers[key] = value;
+            }
+        });
+        let text = await response.text();
+        if (opts?.replaceUrls && this.replaceUrls) {
+            text = this.replaceUrls(text);
+        }
+        return new Response(text, {
+            status: response.status,
+            statusText: response.statusText,
+            headers,
+        });
+    }
+    async fetchRouteData(req) {
+        const fetchUrl = withQuery(req.pathname, {
+            ...req.query,
+            _props: req.withAppData ? "all" : "1",
+            _ssr: "1",
+            _debug: this.dev ? "1" : undefined,
+        });
+        return this.fetchOrigin(fetchUrl, {
+            cache: "no-cache",
+            replaceUrls: true,
+            headers: {
+                "Content-Type": "application/json",
+                Accept: "application/json",
+                ...this.extractRequestHeaders(req.headers),
+            },
+        });
+    }
+    extractRequestHeaders(req) {
+        const headers = {};
+        if (req) {
+            for (let key of PROXY_REQUEST_HEADERS) {
+                if (req[key]) {
+                    headers[key] = req[key];
+                }
+            }
+        }
+        return headers;
+    }
+    async fetchNamedQuery(req) {
+        const url = `/wp-json/ed/v1/query/${req.name}?params=${encodeURIComponent(JSON.stringify(req.params))}`;
+        return this.fetchOrigin(url, {
+            cache: "no-cache",
+            replaceUrls: true,
+            headers: {
+                ...this.extractRequestHeaders(req.headers),
+                "Content-Type": "application/json",
+                Accept: "application/json",
+            },
+        });
+    }
+    async fetchMutation(req) {
+        const url = `/wp-json/ed/v1/mutation/${req.name}`;
+        return this.fetchOrigin(url, {
+            method: "POST",
+            cache: "no-cache",
+            replaceUrls: true,
+            headers: {
+                ...this.extractRequestHeaders(req.headers),
+                "Content-Type": "application/json",
+                Accept: "application/json",
+            },
+            body: JSON.stringify(req.body),
+        });
+    }
+}

package/dist/app/server/utils/headers.d.ts

@@ -2,3 +2,4 @@ export declare function filterHeader(key: string, allowed: (string | RegExp)[]):
 export declare const BRANDED_HEADERS: {
     "X-Powered-By": string;
 };
+export declare function extractHeaders(rawHeaders: Headers): Record<string, string>;

package/dist/app/server/utils/headers.js

@@ -9,3 +9,20 @@ export function filterHeader(key, allowed) {
 export const BRANDED_HEADERS = {
     "X-Powered-By": "ed.studio",
 };
+const IGNORE_REQUEST_HEADERS = [
+    "host",
+    "connection",
+    "accept-encoding",
+    "accept-language",
+    "origin",
+    "referer",
+    "user-agent",
+];
+export function extractHeaders(rawHeaders) {
+    const headers = {};
+    rawHeaders.forEach((value, key) => {
+        headers[key] = value;
+    });
+    IGNORE_REQUEST_HEADERS.forEach((key) => delete headers[key]);
+    return headers;
+}

package/dist/app/server/utils/replace-host.d.ts

@@ -1,8 +1,10 @@
 export type UrlReplacerConf = {
     from: string;
     to: string;
-    https: boolean;
-    ignoreUploads: boolean;
-    ignorePlugins: boolean;
+    /** A dictionary of prefixes (eg /wp-content), and whether to replace them (true/false) */
+    prefixes: {
+        prefix: string;
+        replace: boolean;
+    }[];
 };
-export declare function createUrlReplacer(conf: UrlReplacerConf): (value: string) => string;
+export declare function createUrlReplacer(conf: UrlReplacerConf): (text: string) => string;