eddev 2.0.0-beta.77 → 2.0.0-beta.78

package/dist/app/entry/HydrationOverlay.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { OverlayProps } from "./types";
+export declare function HydrationOverlay({ integrations }: OverlayProps): React.ReactPortal | null;

package/dist/app/entry/HydrationOverlay.js

@@ -0,0 +1,98 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// @ts-ignore
+import beautify from "beautify";
+import { createPortal } from "react-dom";
+import { useEffect, useState } from "react";
+import ReactDiffViewer, { DiffMethod } from "react-diff-viewer-continued";
+import { hydrationDebug } from "../utils/hydration-debugger";
+import { useSnapshot } from "valtio";
+// Remove emotion-inserted style tags from the HTML string from the server
+// as they get removed before hydration, so they shouldn't show in the diff
+// (pollutes the diff and makes it unusable)
+function removeEmotionStyleTags(htmlString = "") {
+    const regex = /<style\s+data-emotion(?:="[^"]*"|[^>])*>[\s\S]*?<\/style>/g;
+    return htmlString.replace(regex, "");
+}
+const DiffViewer = ReactDiffViewer.default
+    ? ReactDiffViewer.default
+    : ReactDiffViewer;
+export function HydrationOverlay({ integrations }) {
+    const [SSRHtml, setSSRHtml] = useState("");
+    const [CSRHtml, setCSRHtml] = useState("");
+    const [showModal, setShowModal] = useState(true);
+    const [hasHydrationMismatch, setHasHydrationMismatch] = useState(false);
+    useEffect(() => {
+        // @ts-ignore
+        const ssrHtml = hydrationDebug.initialHTML;
+        // hydrationDebug.add({ error: new Error(), info: null })
+        // @ts-ignore
+        // window.BUILDER_HYDRATION_OVERLAY.CSR_HTML = document.querySelector("#_app")?.innerHTML
+        // @ts-ignore
+        const newCSRHtml = document.querySelector("#_app")?.innerHTML;
+        if (!ssrHtml || !newCSRHtml)
+            return;
+        const newSSR = beautify(ssrHtml, { format: "html" });
+        setSSRHtml(newSSR);
+        const newCSR = beautify(newCSRHtml, { format: "html" });
+        setCSRHtml(newCSR);
+        setShowModal(true);
+        // @ts-ignore
+        if (hydrationDebug.events.length > 0) {
+            console.log("Showing modal?");
+            setHasHydrationMismatch(true);
+        }
+    }, []);
+    const hideModal = () => {
+        setShowModal(false);
+    };
+    const renderModal = showModal && hasHydrationMismatch && typeof document !== "undefined";
+    const events = useSnapshot(hydrationDebug.events);
+    if (!renderModal) {
+        return null;
+    }
+    const renderOverlay = () => {
+        return (_jsx("div", { style: {
+                position: "absolute",
+                top: 0,
+                left: 0,
+                right: 0,
+                bottom: 0,
+                zIndex: 999998,
+                background: "rgba(0,0,0,0.5)",
+                cursor: "pointer",
+                display: "flex",
+                flexDirection: "column",
+                fontFamily: "monospace",
+                direction: "ltr",
+            }, onClick: hideModal, children: _jsx("div", { style: {
+                    zIndex: 999999,
+                    margin: "4rem 6rem",
+                    backgroundColor: "white",
+                    borderRadius: "0.5rem",
+                    overflow: "auto",
+                    cursor: "auto",
+                    color: "#212529",
+                }, onClick: (e) => {
+                    e.stopPropagation();
+                }, children: _jsxs("div", { style: { display: "flex", flexDirection: "column" }, children: [_jsxs("div", { style: {
+                                display: "flex",
+                                justifyContent: "space-between",
+                                borderBottom: "1px solid black",
+                                alignItems: "center",
+                            }, children: [_jsx("div", { style: {
+                                        fontSize: "2rem",
+                                        fontWeight: "bold",
+                                        padding: "1rem",
+                                    }, children: "Hydration Mismatch Occurred" }), _jsx("button", { style: {
+                                        all: "unset",
+                                        cursor: "pointer",
+                                        padding: "0.5rem",
+                                        marginRight: "1rem",
+                                        backgroundColor: "#212529",
+                                        borderRadius: "0.25rem",
+                                        color: "white",
+                                    }, onClick: hideModal, children: "CLOSE" })] }), _jsx("div", { style: { position: "relative", width: "100%" }, children: _jsx(DiffViewer, { oldValue: SSRHtml, newValue: CSRHtml, leftTitle: "Server-Side Render", rightTitle: "Client-Side Render", compareMethod: DiffMethod.WORDS }) })] }) }) }));
+    };
+    return createPortal(renderOverlay(), document.body);
+}

package/dist/app/entry/hydration-script.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/app/entry/hydration-script.js

@@ -0,0 +1,18 @@
+import { hydrationDebug } from "../utils/hydration-debugger";
+//@ts-nocheck
+// window.addEventListener("error", (event) => {
+//   const msg = event.message.toLowerCase()
+//   const isHydrationMsg = msg.includes("hydration") || msg.includes("hydrating")
+//   if (isHydrationMsg) {
+//     hydrationDebug.add({
+//       error: event.error,
+//       info: null,
+//     })
+//   }
+// })
+const root = document.getElementById("_app");
+if (root) {
+    hydrationDebug.initialHTML = root.innerHTML;
+}
+// @ts-ignore
+window.hydrationDebug = hydrationDebug;

package/dist/app/entry/ssr-root-client.js

@@ -7,7 +7,7 @@ import { clientMetaTags } from "../lib/routing/context.js";
 import { APIProvider } from "../utils/APIProvider.js";
 import { MetaTags } from "./MetaTags.js";
 export function SSRClientRoot(props) {
-    return (_jsxs("html", { lang: "en", children: [_jsxs("head", { children: [_jsx(DynamicMetaTags, { tags: props.metaTags }), _jsx(Trackers, { position: "head" }), props.assets] }), _jsxs("body", { children: [_jsx(Trackers, { position: "body" }), _jsxs(APIProvider, { children: [_jsx(Suspense, { children: _jsx(BrowserRouter, {}) }), _jsx(DevUILoader, {})] }), _jsx(Trackers, { position: "footer" })] })] }));
+    return (_jsxs("html", { lang: "en", children: [_jsxs("head", { children: [_jsx(DynamicMetaTags, { tags: props.metaTags }), _jsx(Trackers, { position: "head" }), props.assets] }), _jsxs("body", { children: [_jsx(Trackers, { position: "body" }), _jsx(APIProvider, { children: _jsx(Suspense, { children: _jsx(BrowserRouter, {}) }) }), _jsx(DevUILoader, {}), _jsx(Trackers, { position: "footer" })] })] }));
 }
 function DynamicMetaTags(props) {
     const dynamicTags = useSnapshot(clientMetaTags).tags;

package/dist/app/lib/blocks/ContentBlocks.js

@@ -63,7 +63,7 @@ export const ContentBlocks = memo((props) => {
                 }
             }
             // Attempt to wrap the block
-            return (_jsxs(Fragment, { children: [spaceBefore, _jsx(BlockErrorBoundary, { block: block, blockContext: ctx, children: blockNode }), spaceAfter] }, index));
+            return (_jsxs(Fragment, { children: [spaceBefore, _jsx(BlockErrorBoundary, { block: block, blockContext: ctx, children: blockNode }), spaceAfter] }, block.slug + "_" + index));
         });
     }, [blocks, props.wrapBlock, props.spacer]);
     if (env.admin) {

package/dist/app/lib/devtools/components/GridIndicator.js

@@ -18,9 +18,11 @@ export function GridIndicator() {
     for (let i = 0; i < 12; i++) {
         cols.push(_jsx("div", { style: { height: "100%", backgroundColor: "rgba(255,0,0,0.1)" } }));
     }
-    useLayoutEffect(() => {
-        document.documentElement.classList.toggle("debug-grid", enabled);
-    }, [enabled]);
+    if (env.client) {
+        useLayoutEffect(() => {
+            document.documentElement.classList.toggle("debug-grid", enabled);
+        }, [enabled]);
+    }
     if (!enabled)
         return null;
     return (_jsx("div", { style: { position: "fixed", inset: 0, zIndex: 999999999, pointerEvents: "none" }, children: _jsx("div", { className: "grid-auto debug-display", style: { height: "100%" }, children: cols }) }));

package/dist/app/lib/devtools/hooks/useTailwind.d.ts

@@ -883,20 +883,32 @@ export declare function useTailwindConfig(): {
         readonly corePlugins?: readonly (import("tailwindcss/types/generated/corePluginList.js").CorePluginList | undefined)[] | {
             readonly filter?: boolean | undefined;
             readonly fill?: boolean | undefined;
-            readonly translate?: boolean | undefined;
-            readonly content?: boolean | undefined;
-            readonly height?: boolean | undefined;
-            readonly width?: boolean | undefined;
+            readonly position?: boolean | undefined;
+            readonly zIndex?: boolean | undefined;
+            readonly space?: boolean | undefined;
             readonly cursor?: boolean | undefined;
             readonly display?: boolean | undefined;
+            readonly flex?: boolean | undefined;
+            readonly flexDirection?: boolean | undefined;
             readonly fontFamily?: boolean | undefined;
+            readonly margin?: boolean | undefined;
+            readonly backgroundColor?: boolean | undefined;
+            readonly borderRadius?: boolean | undefined;
+            readonly overflow?: boolean | undefined;
+            readonly justifyContent?: boolean | undefined;
+            readonly inset?: boolean | undefined;
+            readonly alignItems?: boolean | undefined;
+            readonly width?: boolean | undefined;
             readonly fontSize?: boolean | undefined;
-            readonly fontStyle?: boolean | undefined;
             readonly fontWeight?: boolean | undefined;
+            readonly padding?: boolean | undefined;
+            readonly translate?: boolean | undefined;
+            readonly content?: boolean | undefined;
+            readonly height?: boolean | undefined;
+            readonly fontStyle?: boolean | undefined;
             readonly letterSpacing?: boolean | undefined;
             readonly opacity?: boolean | undefined;
             readonly order?: boolean | undefined;
-            readonly overflow?: boolean | undefined;
             readonly pointerEvents?: boolean | undefined;
             readonly rotate?: boolean | undefined;
             readonly scale?: boolean | undefined;
@@ -906,22 +918,15 @@ export declare function useTailwindConfig(): {
             readonly transform?: boolean | undefined;
             readonly visibility?: boolean | undefined;
             readonly size?: boolean | undefined;
-            readonly backgroundColor?: boolean | undefined;
-            readonly inset?: boolean | undefined;
             readonly invert?: boolean | undefined;
             readonly outlineOffset?: boolean | undefined;
-            readonly borderRadius?: boolean | undefined;
-            readonly padding?: boolean | undefined;
-            readonly flex?: boolean | undefined;
             readonly blur?: boolean | undefined;
             readonly resize?: boolean | undefined;
-            readonly position?: boolean | undefined;
             readonly columns?: boolean | undefined;
             readonly preflight?: boolean | undefined;
             readonly container?: boolean | undefined;
             readonly accessibility?: boolean | undefined;
             readonly isolation?: boolean | undefined;
-            readonly zIndex?: boolean | undefined;
             readonly gridColumn?: boolean | undefined;
             readonly gridColumnStart?: boolean | undefined;
             readonly gridColumnEnd?: boolean | undefined;
@@ -930,7 +935,6 @@ export declare function useTailwindConfig(): {
             readonly gridRowEnd?: boolean | undefined;
             readonly float?: boolean | undefined;
             readonly clear?: boolean | undefined;
-            readonly margin?: boolean | undefined;
             readonly boxSizing?: boolean | undefined;
             readonly lineClamp?: boolean | undefined;
             readonly aspectRatio?: boolean | undefined;
@@ -967,16 +971,12 @@ export declare function useTailwindConfig(): {
             readonly gridAutoRows?: boolean | undefined;
             readonly gridTemplateColumns?: boolean | undefined;
             readonly gridTemplateRows?: boolean | undefined;
-            readonly flexDirection?: boolean | undefined;
             readonly flexWrap?: boolean | undefined;
             readonly placeContent?: boolean | undefined;
             readonly placeItems?: boolean | undefined;
             readonly alignContent?: boolean | undefined;
-            readonly alignItems?: boolean | undefined;
-            readonly justifyContent?: boolean | undefined;
             readonly justifyItems?: boolean | undefined;
             readonly gap?: boolean | undefined;
-            readonly space?: boolean | undefined;
             readonly divideWidth?: boolean | undefined;
             readonly divideStyle?: boolean | undefined;
             readonly divideColor?: boolean | undefined;
@@ -1928,20 +1928,32 @@ export declare function useTailwindConfig(): {
                 readonly corePlugins?: readonly (import("tailwindcss/types/generated/corePluginList.js").CorePluginList | undefined)[] | {
                     readonly filter?: boolean | undefined;
                     readonly fill?: boolean | undefined;
-                    readonly translate?: boolean | undefined;
-                    readonly content?: boolean | undefined;
-                    readonly height?: boolean | undefined;
-                    readonly width?: boolean | undefined;
+                    readonly position?: boolean | undefined;
+                    readonly zIndex?: boolean | undefined;
+                    readonly space?: boolean | undefined;
                     readonly cursor?: boolean | undefined;
                     readonly display?: boolean | undefined;
+                    readonly flex?: boolean | undefined;
+                    readonly flexDirection?: boolean | undefined;
                     readonly fontFamily?: boolean | undefined;
+                    readonly margin?: boolean | undefined;
+                    readonly backgroundColor?: boolean | undefined;
+                    readonly borderRadius?: boolean | undefined;
+                    readonly overflow?: boolean | undefined;
+                    readonly justifyContent?: boolean | undefined;
+                    readonly inset?: boolean | undefined;
+                    readonly alignItems?: boolean | undefined;
+                    readonly width?: boolean | undefined;
                     readonly fontSize?: boolean | undefined;
-                    readonly fontStyle?: boolean | undefined;
                     readonly fontWeight?: boolean | undefined;
+                    readonly padding?: boolean | undefined;
+                    readonly translate?: boolean | undefined;
+                    readonly content?: boolean | undefined;
+                    readonly height?: boolean | undefined;
+                    readonly fontStyle?: boolean | undefined;
                     readonly letterSpacing?: boolean | undefined;
                     readonly opacity?: boolean | undefined;
                     readonly order?: boolean | undefined;
-                    readonly overflow?: boolean | undefined;
                     readonly pointerEvents?: boolean | undefined;
                     readonly rotate?: boolean | undefined;
                     readonly scale?: boolean | undefined;
@@ -1951,22 +1963,15 @@ export declare function useTailwindConfig(): {
                     readonly transform?: boolean | undefined;
                     readonly visibility?: boolean | undefined;
                     readonly size?: boolean | undefined;
-                    readonly backgroundColor?: boolean | undefined;
-                    readonly inset?: boolean | undefined;
                     readonly invert?: boolean | undefined;
                     readonly outlineOffset?: boolean | undefined;
-                    readonly borderRadius?: boolean | undefined;
-                    readonly padding?: boolean | undefined;
-                    readonly flex?: boolean | undefined;
                     readonly blur?: boolean | undefined;
                     readonly resize?: boolean | undefined;
-                    readonly position?: boolean | undefined;
                     readonly columns?: boolean | undefined;
                     readonly preflight?: boolean | undefined;
                     readonly container?: boolean | undefined;
                     readonly accessibility?: boolean | undefined;
                     readonly isolation?: boolean | undefined;
-                    readonly zIndex?: boolean | undefined;
                     readonly gridColumn?: boolean | undefined;
                     readonly gridColumnStart?: boolean | undefined;
                     readonly gridColumnEnd?: boolean | undefined;
@@ -1975,7 +1980,6 @@ export declare function useTailwindConfig(): {
                     readonly gridRowEnd?: boolean | undefined;
                     readonly float?: boolean | undefined;
                     readonly clear?: boolean | undefined;
-                    readonly margin?: boolean | undefined;
                     readonly boxSizing?: boolean | undefined;
                     readonly lineClamp?: boolean | undefined;
                     readonly aspectRatio?: boolean | undefined;
@@ -2012,16 +2016,12 @@ export declare function useTailwindConfig(): {
                     readonly gridAutoRows?: boolean | undefined;
                     readonly gridTemplateColumns?: boolean | undefined;
                     readonly gridTemplateRows?: boolean | undefined;
-                    readonly flexDirection?: boolean | undefined;
                     readonly flexWrap?: boolean | undefined;
                     readonly placeContent?: boolean | undefined;
                     readonly placeItems?: boolean | undefined;
                     readonly alignContent?: boolean | undefined;
-                    readonly alignItems?: boolean | undefined;
-                    readonly justifyContent?: boolean | undefined;
                     readonly justifyItems?: boolean | undefined;
                     readonly gap?: boolean | undefined;
-                    readonly space?: boolean | undefined;
                     readonly divideWidth?: boolean | undefined;
                     readonly divideStyle?: boolean | undefined;
                     readonly divideColor?: boolean | undefined;
@@ -2948,20 +2948,32 @@ export declare function useTailwindConfig(): {
     readonly corePlugins?: readonly (import("tailwindcss/types/generated/corePluginList.js").CorePluginList | undefined)[] | {
         readonly filter?: boolean | undefined;
         readonly fill?: boolean | undefined;
-        readonly translate?: boolean | undefined;
-        readonly content?: boolean | undefined;
-        readonly height?: boolean | undefined;
-        readonly width?: boolean | undefined;
+        readonly position?: boolean | undefined;
+        readonly zIndex?: boolean | undefined;
+        readonly space?: boolean | undefined;
         readonly cursor?: boolean | undefined;
         readonly display?: boolean | undefined;
+        readonly flex?: boolean | undefined;
+        readonly flexDirection?: boolean | undefined;
         readonly fontFamily?: boolean | undefined;
+        readonly margin?: boolean | undefined;
+        readonly backgroundColor?: boolean | undefined;
+        readonly borderRadius?: boolean | undefined;
+        readonly overflow?: boolean | undefined;
+        readonly justifyContent?: boolean | undefined;
+        readonly inset?: boolean | undefined;
+        readonly alignItems?: boolean | undefined;
+        readonly width?: boolean | undefined;
         readonly fontSize?: boolean | undefined;
-        readonly fontStyle?: boolean | undefined;
         readonly fontWeight?: boolean | undefined;
+        readonly padding?: boolean | undefined;
+        readonly translate?: boolean | undefined;
+        readonly content?: boolean | undefined;
+        readonly height?: boolean | undefined;
+        readonly fontStyle?: boolean | undefined;
         readonly letterSpacing?: boolean | undefined;
         readonly opacity?: boolean | undefined;
         readonly order?: boolean | undefined;
-        readonly overflow?: boolean | undefined;
         readonly pointerEvents?: boolean | undefined;
         readonly rotate?: boolean | undefined;
         readonly scale?: boolean | undefined;
@@ -2971,22 +2983,15 @@ export declare function useTailwindConfig(): {
         readonly transform?: boolean | undefined;
         readonly visibility?: boolean | undefined;
         readonly size?: boolean | undefined;
-        readonly backgroundColor?: boolean | undefined;
-        readonly inset?: boolean | undefined;
         readonly invert?: boolean | undefined;
         readonly outlineOffset?: boolean | undefined;
-        readonly borderRadius?: boolean | undefined;
-        readonly padding?: boolean | undefined;
-        readonly flex?: boolean | undefined;
         readonly blur?: boolean | undefined;
         readonly resize?: boolean | undefined;
-        readonly position?: boolean | undefined;
         readonly columns?: boolean | undefined;
         readonly preflight?: boolean | undefined;
         readonly container?: boolean | undefined;
         readonly accessibility?: boolean | undefined;
         readonly isolation?: boolean | undefined;
-        readonly zIndex?: boolean | undefined;
         readonly gridColumn?: boolean | undefined;
         readonly gridColumnStart?: boolean | undefined;
         readonly gridColumnEnd?: boolean | undefined;
@@ -2995,7 +3000,6 @@ export declare function useTailwindConfig(): {
         readonly gridRowEnd?: boolean | undefined;
         readonly float?: boolean | undefined;
         readonly clear?: boolean | undefined;
-        readonly margin?: boolean | undefined;
         readonly boxSizing?: boolean | undefined;
         readonly lineClamp?: boolean | undefined;
         readonly aspectRatio?: boolean | undefined;
@@ -3032,16 +3036,12 @@ export declare function useTailwindConfig(): {
         readonly gridAutoRows?: boolean | undefined;
         readonly gridTemplateColumns?: boolean | undefined;
         readonly gridTemplateRows?: boolean | undefined;
-        readonly flexDirection?: boolean | undefined;
         readonly flexWrap?: boolean | undefined;
         readonly placeContent?: boolean | undefined;
         readonly placeItems?: boolean | undefined;
         readonly alignContent?: boolean | undefined;
-        readonly alignItems?: boolean | undefined;
-        readonly justifyContent?: boolean | undefined;
         readonly justifyItems?: boolean | undefined;
         readonly gap?: boolean | undefined;
-        readonly space?: boolean | undefined;
         readonly divideWidth?: boolean | undefined;
         readonly divideStyle?: boolean | undefined;
         readonly divideColor?: boolean | undefined;
@@ -3993,20 +3993,32 @@ export declare function useTailwindConfig(): {
             readonly corePlugins?: readonly (import("tailwindcss/types/generated/corePluginList.js").CorePluginList | undefined)[] | {
                 readonly filter?: boolean | undefined;
                 readonly fill?: boolean | undefined;
-                readonly translate?: boolean | undefined;
-                readonly content?: boolean | undefined;
-                readonly height?: boolean | undefined;
-                readonly width?: boolean | undefined;
+                readonly position?: boolean | undefined;
+                readonly zIndex?: boolean | undefined;
+                readonly space?: boolean | undefined;
                 readonly cursor?: boolean | undefined;
                 readonly display?: boolean | undefined;
+                readonly flex?: boolean | undefined;
+                readonly flexDirection?: boolean | undefined;
                 readonly fontFamily?: boolean | undefined;
+                readonly margin?: boolean | undefined;
+                readonly backgroundColor?: boolean | undefined;
+                readonly borderRadius?: boolean | undefined;
+                readonly overflow?: boolean | undefined;
+                readonly justifyContent?: boolean | undefined;
+                readonly inset?: boolean | undefined;
+                readonly alignItems?: boolean | undefined;
+                readonly width?: boolean | undefined;
                 readonly fontSize?: boolean | undefined;
-                readonly fontStyle?: boolean | undefined;
                 readonly fontWeight?: boolean | undefined;
+                readonly padding?: boolean | undefined;
+                readonly translate?: boolean | undefined;
+                readonly content?: boolean | undefined;
+                readonly height?: boolean | undefined;
+                readonly fontStyle?: boolean | undefined;
                 readonly letterSpacing?: boolean | undefined;
                 readonly opacity?: boolean | undefined;
                 readonly order?: boolean | undefined;
-                readonly overflow?: boolean | undefined;
                 readonly pointerEvents?: boolean | undefined;
                 readonly rotate?: boolean | undefined;
                 readonly scale?: boolean | undefined;
@@ -4016,22 +4028,15 @@ export declare function useTailwindConfig(): {
                 readonly transform?: boolean | undefined;
                 readonly visibility?: boolean | undefined;
                 readonly size?: boolean | undefined;
-                readonly backgroundColor?: boolean | undefined;
-                readonly inset?: boolean | undefined;
                 readonly invert?: boolean | undefined;
                 readonly outlineOffset?: boolean | undefined;
-                readonly borderRadius?: boolean | undefined;
-                readonly padding?: boolean | undefined;
-                readonly flex?: boolean | undefined;
                 readonly blur?: boolean | undefined;
                 readonly resize?: boolean | undefined;
-                readonly position?: boolean | undefined;
                 readonly columns?: boolean | undefined;
                 readonly preflight?: boolean | undefined;
                 readonly container?: boolean | undefined;
                 readonly accessibility?: boolean | undefined;
                 readonly isolation?: boolean | undefined;
-                readonly zIndex?: boolean | undefined;
                 readonly gridColumn?: boolean | undefined;
                 readonly gridColumnStart?: boolean | undefined;
                 readonly gridColumnEnd?: boolean | undefined;
@@ -4040,7 +4045,6 @@ export declare function useTailwindConfig(): {
                 readonly gridRowEnd?: boolean | undefined;
                 readonly float?: boolean | undefined;
                 readonly clear?: boolean | undefined;
-                readonly margin?: boolean | undefined;
                 readonly boxSizing?: boolean | undefined;
                 readonly lineClamp?: boolean | undefined;
                 readonly aspectRatio?: boolean | undefined;
@@ -4077,16 +4081,12 @@ export declare function useTailwindConfig(): {
                 readonly gridAutoRows?: boolean | undefined;
                 readonly gridTemplateColumns?: boolean | undefined;
                 readonly gridTemplateRows?: boolean | undefined;
-                readonly flexDirection?: boolean | undefined;
                 readonly flexWrap?: boolean | undefined;
                 readonly placeContent?: boolean | undefined;
                 readonly placeItems?: boolean | undefined;
                 readonly alignContent?: boolean | undefined;
-                readonly alignItems?: boolean | undefined;
-                readonly justifyContent?: boolean | undefined;
                 readonly justifyItems?: boolean | undefined;
                 readonly gap?: boolean | undefined;
-                readonly space?: boolean | undefined;
                 readonly divideWidth?: boolean | undefined;
                 readonly divideStyle?: boolean | undefined;
                 readonly divideColor?: boolean | undefined;

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

@@ -14,6 +14,7 @@ type RenderErrorPageArgs = {
     pathname: string;
     code: number;
     title: string;
+    newOrigin?: string;
 };
 export declare function renderErrorPage(args: RenderErrorPageArgs): Promise<Response>;
 export {};

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

@@ -26,7 +26,7 @@ export async function getSsrStream(args) {
                 console.error(err);
             },
             bootstrapModules: [clientManifest.inputs[clientManifest.handler].output.path],
-            bootstrapScriptContent: `window.manifest = ${JSON.stringify(await clientManifest.json())};\nwindow._PAGE_DATA = ${JSON.stringify(args.initialData)};\nwindow._TRACKERS = ${JSON.stringify(args.initialData.trackers)}`,
+            bootstrapScriptContent: `window.manifest = ${JSON.stringify(await clientManifest.json())};\nwindow._PAGE_DATA = ${JSON.stringify(args.initialData)};\nwindow._TRACKERS = ${JSON.stringify(args.initialData.trackers)};`,
         });
     });
     return new ReadableStream({
@@ -102,42 +102,6 @@ export async function renderErrorPage(args) {
     return renderPage({
         pathname: "/_error",
         statusCode: args.code,
+        newOrigin: args.newOrigin,
     });
-    // const serverContext = ServerContext.main
-    // let headers = new Headers()
-    // let responseInit: ResponseInit = {
-    //   headers,
-    // }
-    // try {
-    //   const { appData, trackers } = await serverContext.fetchAppData()
-    //   let data: RouteDataWithTrackers
-    //   data = {
-    //     view: "_error",
-    //     viewType: "react",
-    //     viewData: {},
-    //     appData,
-    //     trackers,
-    //   }
-    //   responseInit.status = 500
-    //   headers.set("Content-Type", "text/html; charset=utf-8")
-    //   const stream = await getSsrStream({
-    //     ...args,
-    //     initialData: data,
-    //   })
-    //   return new Response(stream, responseInit)
-    // } catch (err) {
-    //   console.error(err)
-    //   return new Response(
-    //     '<!DOCTYPE html><html><head><title>500 Internal Server Error</title></head><body><h1>500 Internal Server Error</h1><p>"' +
-    //       String(err) +
-    //       '"</p></body></html>',
-    //     {
-    //       status: 500,
-    //       statusText: "Internal Server Error",
-    //       headers: {
-    //         "Content-Type": "text/html; charset=utf-8",
-    //       },
-    //     },
-    //   )
-    // }
 }

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

@@ -130,6 +130,7 @@ export class ServerContext {
                     resultData = {
                         redirect: location,
                         status: status,
+                        data: "",
                     };
                 }
                 if (resultData && typeof resultData === "object") {

package/dist/app/utils/hydration-debugger.d.ts

@@ -0,0 +1,13 @@
+export type HydrationErrorSnapshot = {
+    html: string;
+    error: Error;
+    info: any;
+};
+export declare const hydrationDebug: {
+    initialHTML: string;
+    events: HydrationErrorSnapshot[];
+    add(item: {
+        error: Error;
+        info: any;
+    }): void;
+};

package/dist/app/utils/hydration-debugger.js

@@ -0,0 +1,11 @@
+import { proxy } from "valtio";
+export const hydrationDebug = proxy({
+    initialHTML: "",
+    events: [],
+    add(item) {
+        hydrationDebug.events.push({
+            html: document.querySelector("#_app")?.innerHTML ?? "",
+            ...item,
+        });
+    },
+});

package/dist/node/cli/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "2.0.0-beta.77";
+export declare const VERSION = "2.0.0-beta.78";

package/dist/node/cli/version.js

@@ -1 +1 @@
-export const VERSION = "2.0.0-beta.77";
+export const VERSION = "2.0.0-beta.78";

package/dist/node/compiler/bundler.admin.js

@@ -21,6 +21,7 @@ export class AdminBundler {
             outDir: relative(this.project.rootDir, "./dist/cms/"),
             serverless: false,
             target: "cms",
+            client: true,
         });
         console.verbose("Vite config:", baseConfig);
         await build(mergeConfig(baseConfig, defineConfig({

package/dist/node/compiler/bundler.frontend.js

@@ -21,6 +21,7 @@ export class FrontendBundler {
             outDir: relative(this.project.rootDir, "./dist/frontend/"),
             serverless: false,
             target: "frontend",
+            client: true,
         });
         console.verbose("Vite config:", baseConfig);
         await build(mergeConfig(baseConfig, defineConfig({

package/dist/node/compiler/get-vite-config.d.ts

@@ -8,6 +8,7 @@ export type Args = {
     outDir?: string;
     publicUrl: string;
     console: StatefulLog<any>;
+    client: boolean;
 };
 export declare function envPlugin(args: Args): PluginOption;
 export declare function reactPlugin(): PluginOption[];

package/dist/node/compiler/get-vite-config.js

@@ -8,7 +8,7 @@ import tsconfigPaths from "vite-tsconfig-paths";
 import { cliMode } from "../cli/cli-mode.js";
 export function envPlugin(args) {
     const envDefines = {
-        client: args.serverless ? "!import.meta.env.SSR" : "true",
+        client: args.client ? "true" : "false",
         serverless: args.serverless ? "true" : "false",
         dev: args.mode === "development" ? "true" : "false",
         admin: args.target === "cms" ? "true" : "false",
@@ -28,7 +28,9 @@ export function envPlugin(args) {
         return result;
     };
     return replace({
-        values: expandDefines(envDefines, ["process.env.", "process.", "env."]),
+        values: {
+            ...expandDefines(envDefines, ["process.env.", "process.", "env."]),
+        },
         preventAssignment: true,
     });
 }
@@ -90,8 +92,13 @@ export function ssrPlugin() {
             };
             config.ssr = {
                 ...config.ssr,
-                // @ts-ignore
-                noExternal: ["eddev", "vinxi", "react-use", ...(config?.optimizeDeps?.noExternal ?? [])],
+                noExternal: [
+                    "eddev",
+                    "vinxi",
+                    "react-use",
+                    // @ts-ignore
+                    ...(config?.optimizeDeps?.noExternal ?? []),
+                ],
                 optimizeDeps: {
                     exclude: ["eddev", "vinxi"],
                 },

package/dist/node/compiler/vinxi-app.js

@@ -158,6 +158,7 @@ export function createVinxiApp(args) {
                         publicUrl: args.publicUrl,
                         serverless: true,
                         target: "frontend",
+                        client: true,
                     }),
                 ],
                 base: "/_build",
@@ -175,6 +176,7 @@ export function createVinxiApp(args) {
                         publicUrl: args.publicUrl,
                         serverless: true,
                         target: "cms",
+                        client: true,
                     }),
                 ],
                 base: "/_admin",
@@ -210,6 +212,7 @@ export function createVinxiApp(args) {
                         publicUrl: args.publicUrl,
                         serverless: true,
                         target: "frontend",
+                        client: false,
                     }),
                 ],
             },

package/dist/node/types/block-type.d.ts

@@ -52,7 +52,7 @@ export declare const BlockMetaSchema: z.ZodObject<{
     dynamic: boolean;
     cache: boolean;
     allowMultiple: boolean;
-    frontendMode: "hidden" | "default" | "childrenOnly";
+    frontendMode: "default" | "hidden" | "childrenOnly";
     inserter: boolean;
     icon?: string | undefined;
     description?: string | undefined;
@@ -88,7 +88,7 @@ export declare const BlockMetaSchema: z.ZodObject<{
         postTypes: string[];
         fieldName: string;
     } | undefined;
-    frontendMode?: "hidden" | "default" | "childrenOnly" | undefined;
+    frontendMode?: "default" | "hidden" | "childrenOnly" | undefined;
     inserter?: boolean | undefined;
 }>;
 export type BlockMetadata = z.infer<typeof BlockMetaSchema>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eddev",
-  "version": "2.0.0-beta.77",
+  "version": "2.0.0-beta.78",
   "description": "",
   "main": "index.js",
   "type": "module",