eddev 0.3.35 → 2.0.0-beta.2

package/bin/eddev.js

@@ -1,4 +1,2 @@
 #!/usr/bin/env node
-
-// @ts-ignore
-require("../cli/cli")
+import "../dist/node/cli/cli.js"

package/css/devtools.css

@@ -0,0 +1,15 @@
+@import "tailwindcss/base";
+@import "tailwindcss/components";
+@import "tailwindcss/utilities";
+
+@config "../dist/app/lib/devtools/tailwind.config.js";
+
+.eddev-ui {
+  @apply text-ui font-mono;
+}
+
+@layer components {
+  .btn {
+    @apply flex items-center justify-center text-ui font-mono h-button rounded-full;
+  }
+}

package/css/editor-styles.css

@@ -0,0 +1,94 @@
+.nplist {
+  .child-toggle {
+    box-sizing: content-box;
+  }
+}
+
+.edit-post-visual-editor__post-title-wrapper {
+  width: var(--tw-grid-inner-width, var(--grid-inner-width));
+  margin-left: auto;
+  margin-right: auto;
+}
+.block-editor-block-list__block:hover {
+  outline: 1px solid #e1e1e1;
+}
+
+.wp-block.acf-block-body:not(.acf-block-preview) {
+  display: block !important;
+}
+
+/* .block-editor-block-list__layout.is-root-container > div {
+  margin-bottom: 20px;
+}
+.block-editor-block-list__layout.is-root-container > [data-type^="core/"] {
+  width: var(--tw-grid-inner-width, var(--grid-inner-width));
+  margin-left: auto;
+  margin-right: auto;
+} */
+
+.wp-block-paragraph,
+.wp-block-list {
+  max-width: var(--tw-grid-inner-width, var(--grid-inner-width));
+}
+
+.block-editor-block-list__block .block-list-appender:only-child {
+  align-self: auto !important;
+}
+
+.ed-innerblocks-admin-wrapper[data-orientation="vertical"]
+  > .block-editor-inner-blocks
+  > .block-editor-block-list__layout {
+  display: flex;
+  flex-direction: column;
+}
+
+.ed-innerblocks-admin-wrapper[data-orientation="vertical"]
+  > .block-editor-inner-blocks
+  > .block-editor-block-list__layout
+  > .wp-block {
+  margin-top: 10px;
+  margin-bottom: 10px;
+}
+
+.ed-innerblocks-admin-wrapper[data-orientation="horizontal"]
+  > .block-editor-inner-blocks
+  > .block-editor-block-list__layout {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+}
+
+.ed-innerblocks-admin-wrapper[data-orientation="horizontal"]
+  > .block-editor-inner-blocks
+  > .block-editor-block-list__layout
+  > .wp-block {
+  margin-left: 10px;
+  margin-right: 10px;
+}
+
+.ed-innerblocks-admin-wrapper[data-orientation="horizontal"]
+  > .block-editor-inner-blocks
+  > .block-editor-block-list__layout
+  > .wp-block:first-child {
+  margin-left: 0;
+}
+
+.ed-innerblocks-admin-wrapper[data-orientation="horizontal"]
+  > .block-editor-inner-blocks
+  > .block-editor-block-list__layout
+  > .wp-block:last-child {
+  margin-right: 0;
+}
+
+.editor-post-template__classic-theme-dropdown {
+  button.block-editor-inspector-popover-header__action {
+    display: none;
+  }
+  button.is-link {
+    display: none;
+  }
+}
+
+.acf-block-panel .acf-empty-block-fields {
+  display: none;
+}

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

@@ -0,0 +1 @@
+export declare function Root(): import("react/jsx-runtime").JSX.Element;

package/dist/app/entry/Root.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { QueryClientProvider } from "@tanstack/react-query";
+import { BrowserRouter } from "../lib/routing/components/BrowserRouter";
+import { getQueryClient } from "../utils/query-client";
+import { DevUILoader } from "../lib/devtools/loader";
+import { Suspense } from "react";
+export function Root() {
+    return (_jsxs(QueryClientProvider, { client: getQueryClient(), children: [_jsx(Suspense, { children: _jsx(BrowserRouter, {}) }), _jsx(DevUILoader, {})] }));
+}

package/dist/app/entry/main.admin.d.ts

@@ -0,0 +1,3 @@
+import "@manifest/admin";
+import "@manifest/blocks";
+export default function bootAdmin(): void;

package/dist/app/entry/main.admin.js

@@ -0,0 +1,10 @@
+import "@manifest/admin";
+import { installFieldTypes } from "../lib/admin/installFieldTypes";
+import { runWidgets } from "../lib/admin/runWidgets";
+import { installEDGutenbergHooks } from "../lib/blocks/editor/installGutenbergHooks";
+import "@manifest/blocks";
+export default function bootAdmin() {
+    installEDGutenbergHooks();
+    installFieldTypes();
+    runWidgets();
+}

package/dist/app/entry/main.frontend.spa.d.ts

@@ -0,0 +1,3 @@
+import "@manifest/blocks";
+import "@manifest/views";
+export default function boot(): void;

package/dist/app/entry/main.frontend.spa.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@manifest/blocks";
+import "@manifest/views";
+import { createRoot, hydrateRoot } from "react-dom/client";
+import { Root } from "./Root";
+export default function boot() {
+    if (env.serverless) {
+        hydrateRoot(document.getElementById("root"), _jsx(Root, {}));
+    }
+    else {
+        createRoot(document.getElementById("root")).render(_jsx(Root, {}));
+    }
+}

package/dist/app/entry/main.frontend.ssr.d.ts

@@ -0,0 +1,21 @@
+import "@manifest/blocks";
+import "@manifest/views";
+import type { RouteData } from "../lib/routing/types";
+import { UrlReplacerConf } from "../server/utils/replace-host";
+export declare function patchConsole(c: any): void;
+export declare function setFetchImpl(opts: any): void;
+export declare function setPropsPreprocessor(func: any): void;
+export declare function getPageData(): RouteData;
+export declare function getCollectedOutput(): {
+    head: string;
+    foot: string;
+};
+export declare const getHonoAPI: (args: {
+    fetchImpl: any;
+    replaceUrls: UrlReplacerConf;
+}) => import("hono").Hono<import("hono").Env, {}, "/">;
+export declare const getHonoSSR: (args: {
+    indexTransformer: (html: string) => Promise<string>;
+    fetchImpl: any;
+    replaceUrls: UrlReplacerConf;
+}) => import("hono").Hono<import("hono").Env, {}, "/">;

package/dist/app/entry/main.frontend.ssr.js

@@ -0,0 +1,79 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@manifest/blocks";
+import { getCssText } from "@manifest/theme";
+import "@manifest/views";
+import { QueryClientProvider } from "@tanstack/react-query";
+import { SSRRouter } from "../lib/routing/components/SSRRouter";
+import { RouteLoader } from "../lib/routing/loader";
+import { createHonoStdAPI } from "../server/create-api-builtin-hono";
+import { createSSRHono } from "../server/create-ssr-hono";
+import indexHtml from "../server/utils/index.html";
+import { getQueryClient } from "../utils/query-client";
+import { normalizeRoute } from "../lib/routing/utils";
+import { createUrlReplacer } from "../server/utils/replace-host";
+let initialData;
+export function patchConsole(c) {
+    console.log = (...args) => c.log(...args);
+    console.info = (...args) => c.info(...args);
+    console.warn = (...args) => c.warn(...args);
+    console.error = (...args) => c.warn(...args);
+}
+export function setFetchImpl(opts) {
+    // routeLoader4().setFetchImpl(opts)
+}
+export function setPropsPreprocessor(func) {
+    // routeLoader4().setPropsPreprocessor(func)
+}
+export function getPageData() {
+    return initialData;
+}
+export function getCollectedOutput() {
+    const result = { head: "", foot: "" };
+    if (getCssText) {
+        result.head = `<style id="stitches">${getCssText()}</style>`;
+    }
+    return result;
+}
+export const getHonoAPI = (args) => {
+    return createHonoStdAPI({
+        fetch: args.fetchImpl,
+        replaceUrls: args.replaceUrls,
+    });
+};
+export const getHonoSSR = (args) => {
+    const replaceUrls = args.replaceUrls ? createUrlReplacer(args.replaceUrls) : null;
+    return createSSRHono({
+        render: async function render({ pathname }) {
+            const loader = new RouteLoader();
+            if (replaceUrls) {
+                loader.setPropsPreprocessor(replaceUrls);
+            }
+            loader.setFetchImpl(args.fetchImpl);
+            initialData = await loader.loadRouteData(pathname, true);
+            loader.setAppData(initialData.appData.data);
+            return {
+                jsx: (_jsx(QueryClientProvider, { client: getQueryClient(), children: _jsx(SSRRouter, { loader: loader, route: normalizeRoute({
+                            id: "initial",
+                            component: loader.getRouteComponent(initialData.view),
+                            pathname: pathname,
+                            hash: "",
+                            key: "",
+                            props: initialData.viewData.data,
+                            view: initialData.view,
+                            query: {},
+                            search: "",
+                        }) }) })),
+                getCollectedOutput() {
+                    const result = { head: "", foot: "" };
+                    if (getCssText) {
+                        result.head = `<style id="stitches">${getCssText()}</style>`;
+                    }
+                    return result;
+                },
+                indexTemplate: args.indexTransformer ? await args.indexTransformer(indexHtml) : indexHtml,
+                data: initialData,
+            };
+        },
+        manifest: {},
+    });
+};

package/dist/app/entry/main.serverless.dev.d.ts

@@ -0,0 +1,4 @@
+import "@manifest/blocks";
+import "@manifest/views";
+import "@manifest/admin";
+export default function boot(): void;

package/dist/app/entry/main.serverless.dev.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "@manifest/blocks";
+import "@manifest/views";
+import "@manifest/admin";
+import { createRoot, hydrateRoot } from "react-dom/client";
+import { Root } from "./Root";
+import bootAdmin from "./main.admin";
+// @ts-ignore
+if (!window.wp)
+    window.wp = {};
+export default function boot() {
+    if (env.admin) {
+        bootAdmin();
+    }
+    else if (env.serverless) {
+        hydrateRoot(document.getElementById("root"), _jsx(Root, {}));
+    }
+    else {
+        createRoot(document.getElementById("root")).render(_jsx(Root, {}));
+    }
+}

package/{admin → dist/app/lib/admin}/defineField.d.ts

@@ -1,12 +1,12 @@
 import { ReactElement } from "react";
-export declare type FieldProps<T> = {
+export type FieldProps<T> = {
     value: T;
     onChange: (value: T) => void;
     settings: {
         [key: string]: any;
     };
 };
-export declare type FieldTypeDefinition<T> = {
+export type FieldTypeDefinition<T> = {
     render: (props: FieldProps<T>) => ReactElement;
     defaultValue?: T;
     validate?: (value: T) => boolean | string;

package/dist/app/lib/admin/defineField.js

@@ -0,0 +1,3 @@
+export function defineField(args) {
+    return args;
+}

package/{admin → dist/app/lib/admin}/defineWidget.d.ts

@@ -1,5 +1,5 @@
 import { ComponentType } from "react";
-declare type WidgetProps = {
+type WidgetProps = {
     element: HTMLElement;
     dataset: DOMStringMap;
 };

package/dist/app/lib/admin/defineWidget.js

@@ -0,0 +1,6 @@
+export function defineWidget(name, component) {
+    return {
+        name,
+        component,
+    };
+}

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

@@ -0,0 +1,2 @@
+export * from "./defineField";
+export * from "./defineWidget";

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

@@ -0,0 +1,2 @@
+export * from "./defineField";
+export * from "./defineWidget";

package/dist/app/lib/admin/installFieldTypes.js

@@ -0,0 +1,92 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import * as ReactDOM from "react-dom/client";
+import { adminManifestReader } from "../internal";
+export function installFieldTypes() {
+    // @ts-ignore
+    const acf = window.acf;
+    // Track which fields have been installed
+    const fieldInstalled = new Set();
+    function installAll() {
+        const manifest = adminManifestReader.value;
+        for (const name in manifest.fields) {
+            if (!fieldInstalled.has(name)) {
+                installField(name);
+                fieldInstalled.add(name);
+            }
+        }
+    }
+    // Install all fields, and install any new fields which are added later
+    installAll();
+    adminManifestReader.subscribe((manifest) => {
+        installAll();
+    });
+    function installField(name) {
+        const init = (field) => {
+            const { $el, cid, data } = field;
+            const input = $el.find("input[type='hidden']");
+            const container = document.createElement("div");
+            $el.append(container);
+            ReactDOM.createRoot(container).render(_jsx(FieldInstance, { field: data, input: input[0], settings: input.data("settings") }));
+        };
+        // Register with ACF
+        acf.addAction("ready_field/type=" + name, init);
+        acf.addAction("append_field/type=" + name, init);
+    }
+}
+/**
+ * React instance of the field
+ */
+function FieldInstance({ input, field, settings }) {
+    const [meta, setMeta] = useState(null);
+    const [loadError, setLoadError] = useState(null);
+    const [value, setValue] = useState(() => (input.value ? JSON.parse(input.value) : null));
+    const [valueChanged, setValueChanged] = useState(false);
+    // Load the field type, and reload whenever the admin manifest changes
+    useEffect(() => {
+        function load() {
+            adminManifestReader.value.fields[settings.type]()
+                .then((meta) => {
+                if (!meta.render) {
+                    setLoadError({ error: `Field type '${settings.type}' does not have a render method` });
+                    setMeta(null);
+                }
+                else {
+                    setMeta(meta);
+                    if (meta.defaultValue && value === null) {
+                        setValue(meta.defaultValue);
+                        setValueChanged(true);
+                    }
+                }
+            })
+                .catch((err) => {
+                setMeta(null);
+                setLoadError({ error: err.message });
+            });
+        }
+        load();
+        return adminManifestReader.subscribe(load);
+    }, [settings.type]);
+    useEffect(() => {
+        input.value = JSON.stringify(value);
+        if (valueChanged) {
+            try {
+                // @ts-ignore
+                window.jQuery(input).change();
+            }
+            catch (err) { }
+            setValueChanged(false);
+        }
+    }, [value, valueChanged, !!meta]);
+    if (loadError) {
+        return _jsxs("div", { children: ["Error: ", loadError.error] });
+    }
+    if (!meta) {
+        return _jsx("div", { children: "Loading..." });
+    }
+    const Component = meta.render;
+    return (_jsx(Component, { value: value, onChange: (value) => {
+            setValue(value);
+            setValueChanged(true);
+        }, settings: settings }));
+}

package/dist/app/lib/admin/runWidgets.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import * as ReactDOM from "react-dom/client";
+import { adminManifestReader } from "../internal";
+export function runWidgets() {
+    const elements = document.querySelectorAll("[data-widget]");
+    setTimeout(() => {
+        elements.forEach((el) => {
+            if (el instanceof HTMLElement) {
+                const data = el.dataset;
+                const name = data["widget"];
+                const root = ReactDOM.createRoot(el);
+                root.render(_jsx("div", { children: _jsx(WidgetInstance, { widget: name, element: el, dataset: data }) }));
+            }
+        });
+    }, 1000);
+}
+function WidgetInstance(props) {
+    const [widget, setComponent] = useState(null);
+    useEffect(() => {
+        function loadComponent() {
+            adminManifestReader.value.widgets[props.widget]().then((widget) => {
+                const Component = widget.component;
+                if (Component) {
+                    setComponent(_jsx(Component, { ...props }));
+                }
+                else {
+                    setComponent(null);
+                }
+            });
+        }
+        loadComponent();
+        return adminManifestReader.subscribe((manifest) => {
+            loadComponent();
+        });
+    }, []);
+    return _jsx("div", { children: widget });
+}

package/dist/app/lib/blocks/ContentBlocks.d.ts

@@ -0,0 +1,83 @@
+import { ReactElement } from "react";
+type TypedContentBlock<TName, TProps> = {
+    grouped?: boolean;
+    blockName: string;
+    slug: TName;
+    props: TProps;
+    attrs: any;
+    innerBlocks: ContentBlock[];
+    innerHTML?: string;
+    innerContent?: string[];
+    rule: string;
+    inline: any;
+} & Partial<PublicBlockMeta>;
+/**
+ * An instance of a block.
+ */
+export type ContentBlock = {
+    [K in keyof BlockProps]: TypedContentBlock<K, BlockProps[K]>;
+}[keyof BlockProps];
+/**
+ * Represents a block instance's position in the hierarchy via relationships with other blocks.
+ */
+type BlocksContext = {
+    ancestors: ContentBlock[];
+    parent?: ContentBlock;
+    prev?: ContentBlock;
+    next?: ContentBlock;
+    current: ContentBlock;
+    readonly?: boolean;
+};
+export declare const BlocksContext: import("react").Context<BlocksContext | undefined>;
+export type ContentBlockLayoutProps = {
+    /**
+     * Provide a custom wrapping function for each block. eg.
+     *
+     * ```tsx
+     * wrapBlock={(children, ctx) => {
+     *   return <div data-block-name={ctx.current.blockName}>
+     *     {children}</div>}
+     *   </div>
+     * }}
+     * ```
+     *
+     * @param children The React element, which will render the block
+     * @param ctx An object containing information about the current, previous, and next block and parent blocks.
+     * @returns Return the `children` parameter, optionally wrapped by another element.
+     */
+    wrapBlock?: (children: ReactElement, ctx: BlocksContext) => ReactElement;
+    /**
+     * Insert a custom spacer between blocks. This is useful for adding spacers or anchor points. eg
+     *
+     * ```tsx
+     * spacer={(ctx) => {
+     *  if (ctx.next && ctx.prev) {
+     *    return <div style={{height: "20px"}} />
+     *  }
+     *  return null
+     * }}
+     * ```
+     *
+     * @param ctx
+     */
+    spacer?: (ctx: {
+        ancestors: ContentBlock[];
+        parent?: ContentBlock;
+        prev: ContentBlock | null;
+        next: ContentBlock | null;
+    }) => ReactElement | null;
+};
+type Props = {
+    /** Block data to render, obtained from GraphQL */
+    blocks?: ContentBlock[];
+} & ContentBlockLayoutProps;
+/**
+ * Render a set of Gutenberg blocks
+ */
+export declare const ContentBlocks: import("react").MemoExoticComponent<(props: Props) => import("react/jsx-runtime").JSX.Element | null>;
+type SingleProps = {
+    block: ContentBlock;
+    index?: number;
+};
+export declare function SingleContentBlock(props: SingleProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

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

@@ -0,0 +1,92 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment, createContext, memo, useContext, useMemo } from "react";
+import { blockManifestReader } from "../internal/read-block-manifest";
+import { ErrorBoundaryFrontend } from "./ErrorBoundaryFrontend";
+import { InlineEditingContextProvider, ReadonlyInlineEditingProvider } from "./inline-editing";
+import { addBlockMetadata } from "./block-utils";
+export const BlocksContext = createContext(undefined);
+/**
+ * Render a set of Gutenberg blocks
+ */
+export const ContentBlocks = memo((props) => {
+    const blockData = props.blocks;
+    if (!Array.isArray(blockData))
+        return null;
+    const parentContext = useContext(BlocksContext);
+    const blocks = useMemo(() => {
+        addBlockMetadata(blockData);
+        return blockData.map((block, index) => {
+            // Create a context object for the current block
+            const ctx = {
+                ...parentContext,
+                ancestors: [...(parentContext?.ancestors || []), parentContext?.current].filter(Boolean),
+                parent: parentContext?.current,
+                current: block,
+                prev: blockData[index - 1],
+                next: blockData[index + 1],
+                readonly: env.admin,
+            };
+            // Figure out the
+            let blockNode;
+            blockNode = _jsx(SingleContentBlock, { block: block, index: index });
+            return [ctx, block, blockNode];
+        });
+    }, [blockData]);
+    const layout = useMemo(() => {
+        return blocks.filter(Boolean).map(([ctx, block, blockNode], index) => {
+            // Exit early if the block is null
+            if (blockNode === null)
+                return _jsx(Fragment, {}, index);
+            // Custom wrap function?
+            if (props.wrapBlock) {
+                blockNode = props.wrapBlock(blockNode, ctx);
+            }
+            // Wrap the block in a context provider
+            blockNode = _jsx(BlocksContext.Provider, { value: ctx, children: blockNode });
+            // Custom spacer function?
+            let spaceBefore = null;
+            let spaceAfter = null;
+            if (props.spacer) {
+                // Before block
+                spaceBefore = props.spacer({
+                    ...ctx,
+                    prev: ctx.prev || null,
+                    next: ctx.current || null,
+                });
+                // After block (last block only)
+                if (index === blockData.length - 1) {
+                    spaceAfter = props.spacer({
+                        ...ctx,
+                        prev: block,
+                        next: null,
+                    });
+                }
+            }
+            // Attempt to wrap the block
+            return (_jsxs(Fragment, { children: [spaceBefore, _jsx(ErrorBoundaryFrontend, { children: blockNode }), spaceAfter] }, index));
+        });
+    }, [blocks, props.wrapBlock, props.spacer]);
+    if (env.admin) {
+        return _jsx(ReadonlyInlineEditingProvider, { children: layout });
+    }
+    return _jsx(Fragment, { children: layout });
+});
+ContentBlocks.displayName = "ContentBlocks";
+export function SingleContentBlock(props) {
+    const { block } = props;
+    const Component = useBlockComponent(block);
+    if (!Component) {
+        if (block.innerHTML) {
+            return _jsx("span", { style: { display: "contents" }, dangerouslySetInnerHTML: { __html: block.innerHTML } });
+        }
+        else {
+            return null;
+        }
+    }
+    return (_jsx(InlineEditingContextProvider, { block: [block.blockName, block.props], values: block.inline, innerBlocks: block.innerBlocks, index: props.index ?? 0, children: _jsx(Component, { ...block.props, innerHTML: block.innerHTML, 
+            // innerBlocks={block.innerBlocks}
+            children: Array.isArray(block.innerBlocks) && block.innerBlocks.length ? (_jsx(ContentBlocks, { blocks: block.innerBlocks })) : null }) }));
+}
+function useBlockComponent(block) {
+    return blockManifestReader.value[block.blockName];
+}