eddev 2.0.0-beta.1 → 2.0.0-beta.100

package/dist/app/lib/devtools/hooks/useTailwind.js

@@ -1,6 +1,9 @@
-import "@manifest/tailwind";
 import { useSnapshot } from "valtio";
-import { internalStore } from "../../internal";
+import { devToolsStore } from "../dev-tools-store.js";
+import { useEffect } from "react";
 export function useTailwindConfig() {
-    return useSnapshot(internalStore).tailwindConfig;
+    useEffect(() => {
+        devToolsStore.loadTailwindConfig();
+    }, []);
+    return useSnapshot(devToolsStore).tailwindConfig;
 }

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

@@ -0,0 +1 @@
+export * from "./dev-tools-store.js";

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

@@ -1 +1 @@
-"use strict";
+export * from "./dev-tools-store.js";

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

@@ -1,14 +1,15 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect } from "react";
-import { dynamic } from "../dynamic";
-import { usePersistState } from "./hooks/usePersistState";
-import { useIsSSR } from "../routing";
-const DevUI = dynamic(() => import("./components/DevUI"));
+import { lazy, useEffect } from "react";
+import { usePersistState } from "./hooks/usePersistState.js";
+import { useIsSSR } from "../routing/hooks/useIsSSR.js";
+const DevUI = lazy(() => import("./components/DevUI.js"));
 export function DevUILoader() {
     const ssr = useIsSSR();
-    const [render, setRender] = usePersistState("enable_devui", typeof window !== "undefined" && (env.dev || window["ENABLE_DEV_UI"]));
+    const [render, setRender] = usePersistState("enable_devui", false);
     useEffect(() => {
-        if (document.location.search.includes("activate-dev-ui")) {
+        if (document.location.search.includes("activate-dev-ui") ||
+            window["ENABLE_DEV_UI"] ||
+            (env.client && env.dev)) {
             setRender(true);
         }
     }, []);

package/dist/app/lib/devtools/useQueryDebug.d.ts

@@ -6,4 +6,10 @@ export type QueryDebugItem = {
     children: QueryDebugItem[];
 };
 export declare function setQueryDebug(value: QueryDebugItem | undefined): void;
-export declare function useQueryDebugData(): QueryDebugItem | undefined;
+export declare function useQueryDebugData(): {
+    readonly file: string;
+    readonly errors: readonly string[];
+    readonly duration: number;
+    readonly label: string;
+    readonly children: readonly any[];
+} | undefined;

package/dist/app/lib/devtools/useQueryDebug.js

@@ -1,13 +1,10 @@
-import { create } from "zustand";
-const useQueryDebug = create((set) => ({
+import { proxy, useSnapshot } from "valtio";
+const store = proxy({
     value: undefined,
-    set: (value) => {
-        set({ value });
-    },
-}));
+});
 export function setQueryDebug(value) {
-    useQueryDebug.setState({ value });
+    store.value = value;
 }
 export function useQueryDebugData() {
-    return useQueryDebug((store) => store.value);
+    return useSnapshot(store).value;
 }

package/dist/app/lib/dynamic/dynamic.d.ts

@@ -4,5 +4,5 @@ export type DynamicComponent<T extends ComponentType<any>> = T & {
 };
 export declare function dynamic<T extends ComponentType<any>>(factory: () => Promise<{
     default: T;
-}>): DynamicComponent<T>;
+}>, name?: string): DynamicComponent<T>;
 export default dynamic;

package/dist/app/lib/dynamic/dynamic.js

@@ -1,9 +1,13 @@
 import { createElement, forwardRef, lazy, memo, useRef } from "react";
-export function dynamic(factory) {
+import { useAssetCapture } from "../../utils/asset-capture";
+export function dynamic(factory, name) {
     const ReactLazyComponent = lazy(factory);
     let PreloadedComponent;
     let factoryPromise;
     const Component = memo(forwardRef(function LazyWithPreload(props, ref) {
+        if (env.serverless && !env.client && name) {
+            useAssetCapture()?.add(name);
+        }
         // Once one of these is chosen, we must ensure that it continues to be
         // used for all subsequent renders, otherwise it can cause the
         // underlying component to be unmounted and remounted.

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

@@ -1 +1 @@
-export { dynamic, DynamicComponent } from "./dynamic";
+export { dynamic, DynamicComponent } from "./dynamic.js";

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

@@ -1 +1 @@
-export { dynamic } from "./dynamic";
+export { dynamic } from "./dynamic.js";

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

@@ -1,5 +1,4 @@
-export * from "./usePageLoad";
-export * from "./useAppData";
-export * from "./useRPC";
-export * from "./queryUtils";
-export * from "./apiConfig";
+export * from "./useAppData.js";
+export * from "./useRPC.js";
+export * from "./queryUtils.js";
+export * from "../runtime/apiConfig.js";

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

@@ -1,5 +1,4 @@
-export * from "./usePageLoad";
-export * from "./useAppData";
-export * from "./useRPC";
-export * from "./queryUtils";
-export * from "./apiConfig";
+export * from "./useAppData.js";
+export * from "./useRPC.js";
+export * from "./queryUtils.js";
+export * from "../runtime/apiConfig.js";

package/dist/app/lib/hooks/queryUtils.d.ts

@@ -1,4 +1,5 @@
-import { FetchQueryOptions, UndefinedInitialDataOptions, UseMutationOptions, UseMutationResult, UseQueryResult, UseInfiniteQueryResult, UndefinedInitialDataInfiniteOptions } from "@tanstack/react-query";
+import { FetchQueryOptions, UndefinedInitialDataInfiniteOptions, UndefinedInitialDataOptions, UseInfiniteQueryResult, UseMutationOptions, UseMutationResult, UseQueryResult } from "@tanstack/react-query";
+import { TRPCClientError } from "@trpc/client";
 type OptionalMaybes<T> = T extends any[] ? T : T extends {
     [key: string]: any;
 } ? {
@@ -7,10 +8,17 @@ type OptionalMaybes<T> = T extends any[] ? T : T extends {
 type MaybeVars = {
     [key: string]: any;
 } | undefined;
-export type QueryError = Error & {
+declare class QueryError extends Error {
+    name: string;
     messages: string[];
     statusCode: number;
-};
+    constructor(args: {
+        messages: string[];
+        statusCode: number;
+        type: "query" | "mutation";
+        queryName: string;
+    });
+}
 /** Regular queries */
 type CreateUseQueryOptions = {
     name: string;
@@ -33,7 +41,10 @@ export type UseInfiniteQueryFunction<TData, TVars> = (args: OptionalMaybes<Omit<
     headers?: Record<string, string>;
     /** Initial data can be passed in, but should match the original GraphQL query in structure (including nodes/hasNextPage/endCursor) */
     initialData?: any;
-}) => UseInfiniteQueryResult<TData, QueryError>;
+}) => UseInfiniteQueryResult<{
+    nodes: TData;
+    total?: number | null;
+}, QueryError>;
 export declare function createUseInfiniteQuery<TData extends any, TVars extends MaybeVars>(init: CreateUseInfiniteQueryOptions): UseInfiniteQueryFunction<TData, TVars>;
 export type UseMutationFunction<TData, TArgs> = ((options?: Omit<UseMutationOptions<TData, QueryError, TArgs>, "mutationFn"> & {
     headers?: Record<string, string>;
@@ -43,4 +54,30 @@ export type UseMutationFunction<TData, TArgs> = ((options?: Omit<UseMutationOpti
     }) => Promise<TData>;
 };
 export declare function createUseMutation<TData extends any, TArgs extends MaybeVars>(init: CreateUseQueryOptions): UseMutationFunction<TData, TArgs>;
+type RPCQueryName = RPCRouter["queries"]["key"];
+type RPCQueryResult<T> = Extract<RPCRouter["queries"], {
+    key: T;
+}>["output"];
+type RPCQueryInput<T> = Extract<RPCRouter["queries"], {
+    key: T;
+}>["input"];
+type RPCQueryError<T> = TRPCClientError<Extract<RPCRouter["queries"], {
+    key: T;
+}>["procedure"]>;
+export declare function useRPCQuery<TName extends RPCQueryName>(key: TName, args: OptionalMaybes<RPCQueryInput<TName>>, options?: Omit<UndefinedInitialDataOptions<RPCQueryResult<TName>, RPCQueryError<TName>, RPCQueryResult<TName>>, "queryKey" | "queryFn"> & {
+    headers?: Record<string, string>;
+}): UseQueryResult<RPCQueryResult<TName>, RPCQueryError<TName>>;
+type RPCMutationName = RPCRouter["mutations"]["key"];
+type RPCMutationResult<T> = Extract<RPCRouter["mutations"], {
+    key: T;
+}>["output"];
+type RPCMutationInput<T> = Extract<RPCRouter["mutations"], {
+    key: T;
+}>["input"];
+type RPCMutationError<T> = TRPCClientError<Extract<RPCRouter["mutations"], {
+    key: T;
+}>["procedure"]>;
+export declare function useRPCMutation<TName extends RPCMutationName>(key: TName, options?: Omit<UseMutationOptions<RPCMutationResult<TName>, RPCMutationError<TName>, RPCMutationInput<TName>>, "mutationFn"> & {
+    headers?: Record<string, string>;
+}): UseMutationResult<RPCMutationResult<TName>, RPCMutationError<TName>, RPCMutationInput<TName>>;
 export {};

package/dist/app/lib/hooks/queryUtils.js

@@ -1,13 +1,22 @@
-import { useMutation, useQuery, useInfiniteQuery, } from "@tanstack/react-query";
-import { joinURL } from "ufo";
-import { getQueryClient } from "../../utils/query-client";
-import { useAPIConfig } from "./apiConfig";
+import { useInfiniteQuery, useMutation, useQuery, useQueryClient, } from "@tanstack/react-query";
 import { useEffect, useState } from "react";
-function createQueryError(messages, statusCode) {
-    const error = new Error(messages.join(", "));
-    error.statusCode = statusCode;
-    error.messages = messages;
-    return error;
+import { joinURL } from "ufo";
+import { getQueryClient } from "../../utils/query-client.js";
+import { getRPCClient } from "../../utils/trpc-client.js";
+import { apiConfig } from "../runtime/apiConfig.js";
+class QueryError extends Error {
+    name = "QueryError";
+    messages;
+    statusCode;
+    constructor(args) {
+        const msg = args.messages.join(", ");
+        super(msg);
+        this.statusCode = args.statusCode;
+        this.messages = args.messages;
+    }
+}
+function useFallbackClient() {
+    return useQueryClient(getQueryClient());
 }
 const fetchGETQuery = async (name, params, opts) => {
     let url;
@@ -15,7 +24,7 @@ const fetchGETQuery = async (name, params, opts) => {
         headers: opts?.headers,
     };
     if (env.serverless && env.client) {
-        url = `/api/rest/query/${name}`;
+        url = `/_data/query/${name}`;
     }
     else if (env.serverless) {
         url = joinURL(env.origin ?? "", `/wp-json/ed/v1/query/${name}`);
@@ -26,33 +35,39 @@ const fetchGETQuery = async (name, params, opts) => {
     if (params)
         url += "?params=" + encodeURIComponent(params);
     // Apply API configuration
-    const apiConfig = useAPIConfig.getState();
     if (apiConfig.customQueryFetchOptions) {
         options = await apiConfig.customQueryFetchOptions?.("query", name, params, url, options);
     }
     const response = await fetch(url, options);
+    if (apiConfig.onResponse)
+        apiConfig.onResponse(response, "query", name, params, url, options);
     const payload = await response.json();
     if (payload.errors?.length > 0) {
-        throw createQueryError(payload.errors.map((e) => e.message), response.status);
+        throw new QueryError({
+            messages: payload.errors.map((e) => e.message),
+            statusCode: response.status,
+            queryName: name,
+            type: "query",
+        });
     }
     return payload.data;
 };
 export function createUseQuery(init) {
     const hook = (args, options) => {
-        const customKey = useAPIConfig((state) => state.customQueryKey);
+        const customKey = apiConfig.customQueryKey;
         return useQuery({
-            queryKey: [init.name, args, options?.headers, options?.headers, customKey],
-            queryFn: (args) => fetchGETQuery(init.name, args.queryKey[1] ? JSON.stringify(args.queryKey[1]) : "", {
+            queryKey: ["query", init.name, args, options?.headers, customKey],
+            queryFn: (args) => fetchGETQuery(init.name, args.queryKey[2] ? JSON.stringify(args.queryKey[2]) : "", {
                 headers: options?.headers,
             }),
             ...options,
-        });
+        }, useFallbackClient());
     };
     hook.fetch = async (args, options) => {
-        const customKey = useAPIConfig.getState().customQueryKey;
+        const customKey = apiConfig.customQueryKey;
         return getQueryClient().fetchQuery({
-            queryKey: [init.name, args, options?.headers, options?.headers, customKey],
-            queryFn: (args) => fetchGETQuery(init.name, args.queryKey[1] ? JSON.stringify(args.queryKey[1]) : "", {
+            queryKey: ["query", init.name, args, options?.headers, customKey],
+            queryFn: (args) => fetchGETQuery(init.name, args.queryKey[2] ? JSON.stringify(args.queryKey[2]) : "", {
                 headers: options?.headers,
             }),
             ...options,
@@ -60,20 +75,12 @@ export function createUseQuery(init) {
     };
     return hook;
 }
-//  & {
-//   fetch: (
-//     args: OptionalMaybes<TVars>,
-//     options?: Omit<FetchInfiniteQueryOptions<TData, QueryError, InfiniteData<TData, string>>, "queryKey" | "queryFn"> & {
-//       headers?: Record<string, string>
-//     },
-//   ) => Promise<TData>
-// }
 function selectByPath(data, path) {
     return path.reduce((acc, key) => (acc ? acc[key] : null), data);
 }
 export function createUseInfiniteQuery(init) {
     const hook = (args, options) => {
-        const customKey = useAPIConfig((state) => state.customQueryKey);
+        const customKey = apiConfig.customQueryKey;
         const [initial, setInitial] = useState(() => {
             if (options?.initialData) {
                 const data = options?.initialData;
@@ -96,11 +103,11 @@ export function createUseInfiniteQuery(init) {
             });
         }, []);
         return useInfiniteQuery({
-            queryKey: [init.name, args, init.defaultLimit, options?.headers, options?.headers, customKey],
+            queryKey: ["query", init.name, args, init.defaultLimit, options?.headers, customKey],
             queryFn: async (args) => {
                 const finalArgs = {
-                    limit: args.queryKey[2],
-                    ...(args.queryKey[1] ?? {}),
+                    limit: args.queryKey[3],
+                    ...(args.queryKey[2] ?? {}),
                     cursor: args.pageParam,
                 };
                 const data = await fetchGETQuery(init.name, JSON.stringify(finalArgs), {
@@ -109,10 +116,12 @@ export function createUseInfiniteQuery(init) {
                 const endCursor = selectByPath(data, init.paths.endCursorPath);
                 const hasNextPage = selectByPath(data, init.paths.hasNextPagePath);
                 const nodes = selectByPath(data, init.paths.nodesPath);
+                const total = selectByPath(data, [...init.paths.pageInfoPath, "total"]);
                 return {
                     nodes,
                     hasNextPage,
                     endCursor,
+                    total,
                 };
             },
             initialPageParam: "",
@@ -121,7 +130,10 @@ export function createUseInfiniteQuery(init) {
                 return lastPage.hasNextPage ? lastPage.endCursor : undefined;
             },
             select(data) {
-                return data.pages.flatMap((page) => page.nodes);
+                return {
+                    nodes: data.pages.flatMap((page) => page.nodes),
+                    total: data.pages[data.pages.length - 1]?.total,
+                };
             },
             ...options,
             ...initial,
@@ -142,7 +154,7 @@ const fetchMutation = async (name, params, opts) => {
     };
     if (env.serverless && env.client) {
         // Relative request (in browser)
-        url = `/api/rest/mutation/${name}`;
+        url = `/_data/mutation/${name}`;
     }
     else if (env.serverless) {
         // Request to the origin server (server to server)
@@ -153,26 +165,32 @@ const fetchMutation = async (name, params, opts) => {
         url = `/wp-json/ed/v1/mutation/${name}`;
     }
     // Apply API configuration
-    const apiConfig = useAPIConfig.getState();
     if (apiConfig.customQueryFetchOptions) {
         options = await apiConfig.customQueryFetchOptions?.("mutation", name, params, url, options);
     }
     const response = await fetch(url, options);
+    if (apiConfig.onResponse)
+        apiConfig.onResponse(response, "mutation", name, params, url, options);
     const payload = await response.json();
     if (payload.errors?.length > 0) {
-        throw createQueryError(payload.errors.map((e) => e.message), response.status);
+        throw new QueryError({
+            messages: payload.errors.map((e) => e.message),
+            statusCode: response.status,
+            queryName: name,
+            type: "mutation",
+        });
     }
     return payload.data;
 };
 export function createUseMutation(init) {
     const hook = (options) => {
         return useMutation({
-            mutationKey: [init.name],
+            mutationKey: ["mutation", init.name],
             mutationFn: (args) => fetchMutation(init.name, args, {
                 headers: options?.headers,
             }),
             ...options,
-        });
+        }, useFallbackClient());
     };
     hook.mutate = async (args, options) => {
         return fetchMutation(init.name, args, {
@@ -181,3 +199,22 @@ export function createUseMutation(init) {
     };
     return hook;
 }
+// @ts-ignore
+export function useRPCQuery(key, args, options) {
+    return useQuery({
+        queryKey: ["rpcQuery", key, args],
+        queryFn: async (args) => {
+            return getRPCClient().query(key, args.queryKey[2]);
+        },
+        ...options,
+    }, useFallbackClient());
+}
+export function useRPCMutation(key, options) {
+    return useMutation({
+        mutationKey: ["rpcMutation", key],
+        mutationFn: async (args) => {
+            return getRPCClient().mutation(key, args);
+        },
+        ...options,
+    }, useFallbackClient());
+}

package/dist/app/lib/hooks/useAppData.js

@@ -1,4 +1,4 @@
-import { useRouter } from "../routing";
+import { useRouter } from "../routing/index.js";
 function useAppData(selector) {
     const loader = useRouter((r) => r.loader);
     if (selector) {

package/dist/app/lib/hooks/useRPC.d.ts

@@ -1,7 +1,3 @@
-export declare const useRPCQuery: RPCUseQuery;
-export declare const useRPCMutation: RPCUseMutation;
-export declare const useRPCInfiniteQuery: RPCUseInfiniteQuery;
-export declare const rpcClient: null;
 export type UseRPCMutationResult = any;
 export type UseRPCQueryResult = any;
 export type UseRPCInfiniteQueryResult = any;

package/dist/app/lib/hooks/useRPC.js

@@ -1,9 +1,2 @@
-const trpc = {};
-// @ts-ignore
-export const useRPCQuery = trpc.useQuery;
-// @ts-ignore
-export const useRPCMutation = trpc.useMutation;
-// @ts-ignore
-export const useRPCInfiniteQuery = trpc.useInfiniteQuery;
-export const rpcClient = null;
+// const trpc = {}
 export const RPCClientError = null;

package/dist/app/lib/internal/finalize-rpc.d.ts

@@ -0,0 +1,17 @@
+import type { AnyTRPCMutationProcedure, AnyTRPCProcedure, AnyTRPCQueryProcedure, AnyTRPCSubscriptionProcedure, inferProcedureInput, inferProcedureOutput } from "@trpc/server";
+type RouterTable = Record<string, Record<string, AnyTRPCProcedure> | AnyTRPCProcedure>;
+type RouterEntry<T extends RouterTable, U extends AnyTRPCProcedure, P extends string = ""> = {
+    [K in keyof T]: K extends string ? T[K] extends U ? {
+        key: `${P}${K}`;
+        input: inferProcedureInput<T[K]>;
+        output: inferProcedureOutput<T[K]>;
+        procedure: T[K] extends AnyTRPCProcedure ? T[K] : never;
+    } : T[K] extends Record<string, AnyTRPCProcedure> ? RouterEntry<T[K], U, `${K}.`> : never : never;
+}[keyof T];
+type RouterTypes<T extends RouterTable> = {
+    queries: RouterEntry<T, AnyTRPCQueryProcedure>;
+    mutations: RouterEntry<T, AnyTRPCMutationProcedure>;
+    subscriptions: RouterEntry<T, AnyTRPCSubscriptionProcedure>;
+};
+export declare function finalizeRPCRouter<T extends RouterTable>(router: T): RouterTypes<T>;
+export {};

package/dist/app/lib/internal/finalize-rpc.js

@@ -0,0 +1,3 @@
+export function finalizeRPCRouter(router) {
+    return router;
+}

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

@@ -1,4 +1,5 @@
-export * from "./read-block-manifest";
-export * from "./read-view-manifest";
-export * from "./read-admin-manifest";
-export * from "./internal-store";
+export * from "./read-block-manifest.js";
+export * from "./read-view-manifest.js";
+export * from "./read-admin-manifest.js";
+export * from "./internal-store.js";
+export * from "./finalize-rpc.js";

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

@@ -1,4 +1,5 @@
-export * from "./read-block-manifest";
-export * from "./read-view-manifest";
-export * from "./read-admin-manifest";
-export * from "./internal-store";
+export * from "./read-block-manifest.js";
+export * from "./read-view-manifest.js";
+export * from "./read-admin-manifest.js";
+export * from "./internal-store.js";
+export * from "./finalize-rpc.js";

package/dist/app/lib/internal/internal-store.d.ts

@@ -1,9 +1,7 @@
 import { FunctionComponent } from "react";
-import { Config as TailwindConfig } from "tailwindcss";
 type BlockManifest = Record<string, FunctionComponent<any>>;
 type Store = {
     blocks: BlockManifest;
-    tailwindConfig: TailwindConfig | null;
 };
 export declare const internalStore: Store & {
     set<K extends keyof Store>(key: K, value: Store[K]): void;

package/dist/app/lib/internal/internal-store.js

@@ -1,9 +1,7 @@
 import { proxy, ref } from "valtio";
 export const internalStore = proxy({
     blocks: {},
-    tailwindConfig: null,
     set(key, value) {
-        ;
-        internalStore[key] = value ? ref(value) : value;
+        internalStore[key] = (value ? ref(value) : value);
     },
 });

package/dist/app/lib/internal/read-admin-manifest.d.ts

@@ -1,5 +1,5 @@
 import type { FunctionComponent } from "react";
-import { FieldTypeDefinition } from "../admin";
+import { FieldTypeDefinition } from "../admin/index.js";
 /**
  * This file exists simply to prevent circular dependencies.
  * The manifest itself sets the value of this object directly.