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

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

@@ -0,0 +1,417 @@
+import { code } from "ts-poet";
+import { FSCodegen } from "../utils/fs-codegen.js";
+export function getVinxiFolder(opts) {
+    return (opts.mode === "development" ? "dev" : "prod") + (opts.serverless ? "" : "-spa");
+}
+export async function runVinxiCodegen(opts) {
+    const codegen = createVinxiCodegen(opts);
+    await codegen.run();
+    codegen.stop();
+}
+export function createVinxiCodegen(opts) {
+    const project = opts.project;
+    const folder = ".eddev/" + getVinxiFolder(opts);
+    const codegen = new FSCodegen(opts.project, {
+        outDir: folder,
+    });
+    if (opts.serverless) {
+        codegen.registerFile({
+            name: "context.ts",
+            generate: () => {
+                const args = {
+                    dev: true,
+                    origin: project.origin,
+                    replaceUrls: {
+                        from: project.origin,
+                        to: opts.endpoint ?? "",
+                        prefixes: [
+                            { prefix: "/wp-content/uploads", replace: project.config?.serverless.uploads === "proxy" },
+                            { prefix: "/wp-content/plugins", replace: project.config?.serverless.plugins === "proxy" },
+                        ],
+                    },
+                };
+                return code /* tsx */ `
+          import { ServerContext } from "eddev/server"
+          import { getManifest } from "vinxi/manifest"
+
+          export const serverContext = new ServerContext({${Object.entries(args)
+                    .map(([key, value]) => `${key}: ${JSON.stringify(value)}`)
+                    .join(",\n")},
+            getManifest
+          })
+        `.toString();
+            },
+        });
+    }
+    if (opts.serverless) {
+        codegen.registerFile({
+            name: "react-shim.js",
+            generate: code /* tsx */ `
+        import React from "react"
+        import ReactDOM from "react-dom/client"
+        Object.assign(React, window.React)
+        Object.assign(ReactDOM, window.ReactDOM)
+      `,
+        });
+    }
+    codegen.registerFile({
+        name: "entry.admin.tsx",
+        generate: () => {
+            return code /* tsx */ `
+        ${opts.serverless ? `import "./react-shim.js"` : ""}
+        ${opts.serverless ? `import "vinxi/client"` : ""}
+        import "../../views/index.css"
+        import "./manifest/admin"
+        import "./manifest/blocks"
+        import "./manifest/styles"
+        import bootAdmin from "eddev/_internal/boot-admin.js"
+
+        bootAdmin()
+      `;
+        },
+    });
+    codegen.registerFile({
+        name: "entry.client.tsx",
+        generate: () => {
+            if (opts.serverless) {
+                /**
+                 * Client entry for SSR mode
+                 */
+                return code /* tsx */ `
+          /// <reference types="vinxi/types/client" />
+          /**
+           * SSR-mode frontend entry.
+           * Hydrates the main app, including the html/head/body elements.
+           * Also ensures that the assets used during SSR are loaded.
+           */
+          import "vinxi/client"
+          import "../../views/index.css"
+          import "./manifest/blocks"
+          import "./manifest/views"
+          
+          import * as React from "react"
+          import { Root, hydrateRoot } from "react-dom/client"
+          import { SSRClientRoot } from "eddev/_internal/ssr-root-client.js"
+          import { getManifest } from "vinxi/manifest"
+          import { createAssets } from "@vinxi/react"
+          import { devToolsStore } from 'eddev/devtools'
+
+          // Set up a dynamic entry which will load the configured tailwind manifest
+          devToolsStore.loadTailwindConfig = () => import('./manifest/tailwind-config.js')
+
+          // Create the asset renderer, which will ensure scripts/styles are mounted correctly
+          function getAssets() {
+            const Assets = createAssets(getManifest("client").handler, getManifest("client"))
+            return <React.Suspense><Assets /></React.Suspense>
+          }
+
+          window.$reactRoot =
+            window.$reactRoot ||
+            hydrateRoot(
+              document,
+              <SSRClientRoot assets={getAssets()} />,
+            )
+
+          if (import.meta.hot) {
+            import.meta.hot.accept((mod) => {
+              if (mod) {
+                const Assets = createAssets(getManifest("client").handler, getManifest("client"))
+                const app = <SSRClientRoot assets={getAssets()} />
+                window.$reactRoot?.render(app)
+              }
+            })
+          }
+
+          declare global {
+            interface Window {
+              $reactRoot?: Root
+            }
+          }
+
+        `;
+            }
+            else {
+                return code /* tsx */ `
+          /**
+           * SPA-mode frontend entry.
+           * Renders the main app into the empty <div id='root'> element, and expects window._PAGE_DATA to be set.
+           */
+          import "./manifest/blocks"
+          import "./manifest/views"
+          import "../../views/index.css"
+          import { devToolsStore } from 'eddev/devtools'
+          import { createRoot } from "react-dom/client"
+          import { SPARoot } from "eddev/_internal/spa-root.js"
+          import * as React from "react"
+
+          devToolsStore.loadTailwindConfig = () => import('./manifest/tailwind-config')
+
+          createRoot(document.getElementById("root")!).render(<SPARoot />)
+        `;
+            }
+        },
+    });
+    if (opts.serverless) {
+        codegen.registerFile({
+            name: "handler.data-api.ts",
+            generate: code /* tsx */ `
+        /// <reference types="vinxi/types/server" />
+        import { createRouter, eventHandler, getRouterParam, getQuery, getWebRequest, getRequestHeaders } from "vinxi/http"
+        import { serverContext } from "./context.js"
+
+        const router = createRouter()
+          .get(
+            "/route/",
+            eventHandler(async (event) => {
+              const id = "/"
+
+              return await serverContext.fetchRouteData({
+                pathname: id,
+                withAppData: false,
+              })
+            }),
+          )
+          .get(
+            "/route/**:name",
+            eventHandler(async (event) => {
+              const id = "/" + getRouterParam(event, "name")
+
+              return await serverContext.fetchRouteData({
+                pathname: id,
+                withAppData: false,
+              })
+            }),
+          )
+          .get(
+            "/query/**:name",
+            eventHandler(async (event) => {
+              const id = "/" + getRouterParam(event, "name")
+              const paramString = getQuery(event).params
+
+              const params = typeof paramString === "string" && paramString.length ? JSON.parse(paramString) : {}
+
+              return await serverContext.fetchNamedQuery({
+                name: id,
+                params: params,
+                headers: getRequestHeaders(event),
+              })
+            }),
+          )
+          .post(
+            "/mutation/**:name",
+            eventHandler(async (event) => {
+              const id = "/" + getRouterParam(event, "name")
+              const body = await getWebRequest(event).json()
+              return await serverContext.fetchMutation({
+                name: id,
+                body,
+                headers: {},
+              })
+            }),
+          )
+
+        export default router.handler
+
+      `,
+        });
+    }
+    if (opts.serverless) {
+        codegen.registerFile({
+            name: "handler.ssr-page.ts",
+            generate: code /* tsx */ `
+      /// <reference types="vinxi/types/server" />
+      import "../../views/index.css"
+      import "./manifest/blocks.js"
+      import "./manifest/styles.js"
+      import "./manifest/views.js"
+
+      import { renderPageToSSRStream, proxyWpAdmin } from "eddev/server"
+      import { eventHandler, setResponseHeader, setResponseStatus, getRequestURL } from "vinxi/http"
+      import { serverContext } from "./context.js"
+      import { getManifest } from "vinxi/manifest"
+
+      export default eventHandler({
+        handler: async (event) => {
+          const url = getRequestURL(event)
+
+          if (url.pathname.includes('.')) {
+            return proxyWpAdmin(event, serverContext)
+          }
+
+          const response = await serverContext.fetchRouteData({
+            pathname: url.pathname,
+            withAppData: true,
+            headers: {},
+            query: {},
+          })
+          if (response.ok) {
+            setResponseStatus(event, response.status)
+            setResponseHeader(event, "Content-Type", "text/html; charset=utf-8")
+            return renderPageToSSRStream(url.pathname, await response.json(), serverContext)
+          } else {
+            return response
+          }
+        },
+      })
+
+    `,
+        });
+    }
+    if (opts.serverless) {
+        codegen.registerFile({
+            name: "handler.wp-proxy.ts",
+            generate: code /* tsx */ `
+      /// <reference types="vinxi/types/server" />
+      import { proxyWpAdmin } from "eddev/server"
+      import { eventHandler } from "vinxi/http"
+      import { serverContext } from "./context.js"
+
+      export default eventHandler(async (event) => {
+        return proxyWpAdmin(event, serverContext)
+      })
+    `,
+        });
+    }
+    codegen.registerFile({
+        name: "manifest/blocks.ts",
+        generate: async () => {
+            const blockManifest = await project.blocks.get();
+            return code /* ts */ `
+        import { blockManifestReader } from 'eddev/_internal'
+        import { dynamic } from 'eddev/dynamic'
+        import core from '../../../blocks/_core'
+
+        const manifest = {
+          ${Object.entries(blockManifest.blocks)
+                .filter(([name]) => !name.match(/^_[a-z]+$/i))
+                .map(([name, block]) => {
+                const importStatement = `dynamic(() => import(${JSON.stringify("../../../" + block.fileName)}))`;
+                return JSON.stringify(block.acfName) + ": " + importStatement;
+            })
+                .join(",\n")},
+          ...core
+        }
+
+        const info = {
+          ${Object.entries(blockManifest.blocks)
+                .filter(([name]) => !name.match(/^_[a-z]+$/i))
+                .map(([name, block]) => {
+                return (JSON.stringify(block.acfName) +
+                    ": " +
+                    JSON.stringify({
+                        slug: block.slug,
+                        tags: block.tags,
+                        flags: block.flags ?? {},
+                    }));
+            })
+                .join(",\n")}
+        }
+
+        blockManifestReader.set(manifest, info)
+
+        export default manifest
+
+        if (import.meta.hot) {
+          import.meta.hot.accept()
+        }
+      `;
+        },
+        subscribe: project.blocks.subscribe,
+    });
+    codegen.registerFile({
+        name: "manifest/admin.ts",
+        generate: async () => {
+            const fieldManifest = await project.fields.get();
+            const widgetManifest = await project.widgets.get();
+            return code /* ts */ `
+          import { adminManifestReader } from 'eddev/_internal'
+          import editorConfig from '../../../blocks/_editor'
+
+          const fields = {${Object.entries(fieldManifest.fields)
+                .map(([name, field]) => {
+                const importStatement = `() => import(${JSON.stringify("../../../" + field.fileName)}).then(m => m.default)`;
+                return JSON.stringify(field.slug) + ": " + importStatement;
+            })
+                .join(",\n")}}
+          const widgets = {${Object.entries(widgetManifest.widgets)
+                .map(([name, widget]) => {
+                const importStatement = `() => import(${JSON.stringify("../../../" + widget.fileName)}).then(m => m.default)`;
+                return JSON.stringify(widget.slug) + ": " + importStatement;
+            })
+                .join(",\n")}}
+
+          const manifest = {
+            fields,
+            widgets,
+            editorConfig
+          }
+
+          adminManifestReader.set(manifest)
+          
+          export default manifest
+
+          export { editorConfig }
+
+          if (import.meta.hot) {
+            import.meta.hot.accept()
+          }
+        `;
+        },
+        subscribe: (callback) => {
+            const unsub = [project.fields.subscribe(callback), project.widgets.subscribe(callback)];
+            return () => unsub.forEach((u) => u());
+        },
+    });
+    codegen.registerFile({
+        name: "manifest/views.ts",
+        generate: async () => {
+            const viewManifest = await project.views.get();
+            return code /* ts */ `
+        import { viewManifestReader } from 'eddev/_internal'
+        import { dynamic } from 'eddev/dynamic'
+        const manifest = {${Object.entries(viewManifest.views)
+                .map(([name, view]) => {
+                const importStatement = `dynamic(() => import(${JSON.stringify("../../../" + view.fileName)}))`;
+                return JSON.stringify(view.slug) + ": " + importStatement;
+            })
+                .join(",\n")}}
+
+        viewManifestReader.value = manifest
+        
+        export default manifest
+
+        if (import.meta.hot) {
+          import.meta.hot.accept()
+        }
+      `;
+        },
+        subscribe: project.views.subscribe,
+    });
+    codegen.registerFile({
+        name: "manifest/styles.ts",
+        generate: async () => {
+            return code /* ts */ `
+        export const getCssText = undefined
+        export const editorGlobalStyles = () => {}      
+      `;
+        },
+    });
+    codegen.registerFile({
+        name: "manifest/tailwind-config.ts",
+        generate: async () => {
+            return code /* ts */ `
+        import tw from "../../../tailwind.config.ts"
+        import resolveConfig from 'tailwindcss/resolveConfig'
+        import { devToolsStore } from 'eddev/devtools'
+
+        const value = resolveConfig(tw)
+        devToolsStore.tailwindConfig = value
+
+        if (import.meta.hot) {
+          import.meta.hot.accept()
+        }
+      `;
+        },
+    });
+    return codegen;
+}

package/dist/node/graphql/graphql-codegen.d.ts

@@ -1,5 +1,5 @@
 import { Project } from "../project/project.js";
-export declare const graphqlLog: import("../utils/statefulLog.js").StatefulLog<GraphQLGenerator>;
+export declare const graphqlLog: import("../utils/stateful-log.js").StatefulLog<GraphQLGenerator>;
 export declare class GraphQLGenerator {
     project: Project;
     private needsRegenerate;

package/dist/node/graphql/graphql-codegen.js

@@ -10,9 +10,9 @@ import * as typescriptPlugin from "@graphql-codegen/typescript";
 import * as typescriptOperationsPlugin from "@graphql-codegen/typescript-operations";
 import chalk from "chalk";
 import { code } from "ts-poet";
-import { highlightCode } from "../utils/highlightCode.js";
-import { createConsole } from "../utils/statefulLog.js";
-import { watchFileTreeForChanges } from "../utils/watchFileTree.js";
+import { highlightCode } from "../utils/highlight-code.js";
+import { createConsole } from "../utils/stateful-log.js";
+import { watchFileTreeForChanges } from "../utils/watch-file-tree.js";
 import pluginFiles from "./plugins/gql-plugin-files.js";
 import pluginNoDuplicates from "./plugins/gql-plugin-no-duplicates.js";
 import pluginQueries from "./plugins/gql-plugin-queries.js";

package/dist/node/graphql/graphql-schema-loader.js

@@ -1,8 +1,6 @@
 import { loadSchema } from "@graphql-tools/load";
 import { UrlLoader } from "@graphql-tools/url-loader";
 import { introspectionFromSchema } from "graphql";
-import { Agent } from "https";
-import fetch from "node-fetch";
 import { graphqlLog as console } from "./graphql-codegen.js";
 import chalk from "chalk";
 import { hash } from "object-code";
@@ -23,22 +21,21 @@ export class GraphQLSchemaLoader {
         console.info(`${this.lastHash ? "Reloading" : "Loading"} GraphQL schema from ${chalk.yellowBright(this.url)}`);
         const rawSchema = await loadSchema(this.url, {
             loaders: [new UrlLoader()],
-            fetch: (url, opts) => {
-                const httpsAgent = new Agent({
-                    rejectUnauthorized: false,
-                });
-                return fetch(url, {
-                    ...opts,
-                    agent: function (_parsedURL) {
-                        if (_parsedURL.protocol == "http:") {
-                            return undefined;
-                        }
-                        else {
-                            return httpsAgent;
-                        }
-                    },
-                });
-            },
+            // fetch: (url: string, opts: any) => {
+            //   const httpsAgent = new Agent({
+            //     rejectUnauthorized: false,
+            //   })
+            //   return fetch(url, {
+            //     ...opts,
+            //     agent: function (_parsedURL) {
+            //       if (_parsedURL.protocol == "http:") {
+            //         return undefined
+            //       } else {
+            //         return httpsAgent
+            //       }
+            //     },
+            //   })
+            // },
         }).catch((e) => {
             return e;
         });

package/dist/node/project/config.js

@@ -4,7 +4,7 @@ import { z } from "zod";
 import { zodToJsonSchema } from "zod-to-json-schema";
 import { cliMode } from "../cli/cli-mode.js";
 import { fs } from "../utils/fs.js";
-import { isDeploying } from "../utils/isDeploying.js";
+import { isDeploying } from "../utils/is-deploying.js";
 import { projectLog as console } from "./project.js";
 export const EDConfigSchema = z.object({
     $schema: z.string().optional(),

package/dist/node/project/env.d.ts

@@ -35,5 +35,5 @@ export declare const ProjectEnvUtils: {
         valid: false;
     };
     getSafe<T extends ProjectEnvKey>(key: T): Required<ProjectEnvMap[T]> | undefined;
-    get<T extends ProjectEnvKey>(key: T, cons?: import("../utils/statefulLog.js").StatefulLog<import("./project.js").Project>): z.infer<(typeof fields)[T]>;
+    get<T extends ProjectEnvKey>(key: T, cons?: import("../utils/stateful-log.js").StatefulLog<import("./project.js").Project>): z.infer<(typeof fields)[T]>;
 };

package/dist/node/project/env.js

@@ -1,7 +1,7 @@
 import { z } from "zod";
 import { cliMode } from "../cli/cli-mode.js";
 import { projectLog as console } from "./project.js";
-import { formatZodError } from "../utils/formatZodError.js";
+import { formatZodError } from "../utils/format-zod-error.js";
 const portNumber = z
     .string()
     .default("0")

package/dist/node/project/favicons.d.ts

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

package/dist/node/project/favicons.js

@@ -1 +1 @@
-"use strict";
+export {};

package/dist/node/project/manifest/block-manifest.js

@@ -1,8 +1,8 @@
 import { camelCase, kebabCase } from "change-case-all";
 import { cliMode } from "../../cli/cli-mode.js";
 import { BlockMetaSchema } from "../../types/block-type.js";
-import { metaExtractor } from "../../utils/export-extractor.js";
-import { formatZodError } from "../../utils/formatZodError.js";
+import { metaExtractor } from "../../utils/ts-export-extractor.js";
+import { formatZodError } from "../../utils/format-zod-error.js";
 import { fs } from "../../utils/fs.js";
 import { createManifestGenerator } from "./manifest.js";
 export function loadBlockManifest(project) {

package/dist/node/project/manifest/manifest.d.ts

@@ -1,4 +1,4 @@
-import { FileEvent } from "../../utils/watchFileTree.js";
+import { FileEvent } from "../../utils/watch-file-tree.js";
 type ManifestEntry<TEntryData> = {
     key: string;
     relativePath: string;

package/dist/node/project/manifest/manifest.js

@@ -1,4 +1,4 @@
-import { getFileTree, watchFileTree } from "../../utils/watchFileTree.js";
+import { getFileTree, watchFileTree } from "../../utils/watch-file-tree.js";
 import { relative } from "path";
 export function createManifestGenerator(args) {
     let subscribers = new Set();

package/dist/node/project/manifest/view-manifest.js

@@ -1,9 +1,9 @@
 import { basename } from "node:path";
 import { cliMode } from "../../cli/cli-mode.js";
 import { ViewMetaSchema } from "../../types/view-type.js";
-import { metaExtractor } from "../../utils/export-extractor.js";
-import { formatZodError } from "../../utils/formatZodError.js";
+import { formatZodError } from "../../utils/format-zod-error.js";
 import { fs } from "../../utils/fs.js";
+import { metaExtractor } from "../../utils/ts-export-extractor.js";
 import { createManifestGenerator } from "./manifest.js";
 export function loadViewManifest(project) {
     return createManifestGenerator({

package/dist/node/project/project.d.ts

@@ -1,9 +1,9 @@
 import { EDConfig } from "./config.js";
 import { BlockManifestGenerator } from "./manifest/block-manifest.js";
-import { ViewManifestGenerator } from "./manifest/view-manifest.js";
 import { FieldManifestGenerator } from "./manifest/field-manifest.js";
+import { ViewManifestGenerator } from "./manifest/view-manifest.js";
 import { WidgetManifestGenerator } from "./manifest/widget-manifest.js";
-export declare const projectLog: import("../utils/statefulLog.js").StatefulLog<Project>;
+export declare const projectLog: import("../utils/stateful-log.js").StatefulLog<Project>;
 type ProjectArgs = {
     rootDir: string;
     reportPluginCompatibility?: boolean;
@@ -18,6 +18,7 @@ export declare class Project {
     publicUrl: string;
     repoUrl: string;
     configFile: string;
+    origin: string;
     config?: EDConfig;
     blocks: BlockManifestGenerator;
     views: ViewManifestGenerator;

package/dist/node/project/project.js

@@ -1,19 +1,16 @@
-import * as clack from "@clack/prompts";
+import { objFormat } from "obj-console";
 import { relative, resolve } from "path";
 import { undent } from "undent";
-import { cliMode } from "../cli/cli-mode.js";
-// import { console } from "../utils/console.js"
-import { objFormat } from "obj-console";
-import { getRepoInfo } from "../utils/getRepoInfo.js";
-import { isDeploying } from "../utils/isDeploying.js";
-import { createConsole } from "../utils/statefulLog.js";
+import { getRepoInfo } from "../utils/get-repo-info.js";
+import { isDeploying } from "../utils/is-deploying.js";
+import { createConsole } from "../utils/stateful-log.js";
 import { Configurator } from "./config.js";
-import { loadBlockManifest } from "./manifest/block-manifest.js";
-import { loadViewManifest } from "./manifest/view-manifest.js";
-import { WPInfo } from "./wp-info.js";
 import { ProjectEnvUtils } from "./env.js";
+import { loadBlockManifest } from "./manifest/block-manifest.js";
 import { loadFieldManifest } from "./manifest/field-manifest.js";
+import { loadViewManifest } from "./manifest/view-manifest.js";
 import { loadWidgetManifest } from "./manifest/widget-manifest.js";
+import { WPInfo } from "./wp-info.js";
 const console = createConsole("Project", "project");
 export const projectLog = console;
 /**
@@ -26,6 +23,7 @@ export class Project {
     publicUrl = "";
     repoUrl = "";
     configFile = "";
+    origin = "";
     config;
     blocks;
     views;
@@ -35,6 +33,7 @@ export class Project {
     reportPluginCompatibility = false;
     constructor(opts) {
         this.rootDir = opts.rootDir;
+        this.origin = ProjectEnvUtils.get("SITE_URL");
         this.reportPluginCompatibility = opts.reportPluginCompatibility || false;
         this.blocks = loadBlockManifest(this);
         this.views = loadViewManifest(this);
@@ -62,15 +61,14 @@ export class Project {
           
           You should rename the folder to match the repo name, or vice versa.
         `);
-            if (cliMode.interactive) {
-                await clack.confirm({
-                    message: `Ignore and continue anyway?`,
-                });
-            }
-            else {
-                console.flush();
-                process.exit(1);
-            }
+            // if (cliMode.interactive) {
+            //   await clack.confirm({
+            //     message: `Ignore and continue anyway?`,
+            //   })
+            // } else {
+            //   console.flush()
+            //   process.exit(1)
+            // }
         }
         /**
          * Load configuration

package/dist/node/project/wp-info.js

@@ -1,5 +1,4 @@
 import { resolveURL } from "ufo";
-import { getUnsafeFetch } from "../utils/unsafe-fetch.js";
 export class WPInfo {
     siteUrl;
     cached;
@@ -10,7 +9,6 @@ export class WPInfo {
         if (this.cached && !force)
             return this.cached;
         const url = resolveURL(this.siteUrl, "/wp-json/ed/v1/dev/site-info");
-        const fetch = getUnsafeFetch(this.siteUrl);
         const response = await fetch(url);
         const result = (await response.json());
         this.cached = result;