eddev 0.1.25-beta-01 → 0.1.27

package/blocks/inlineEditing.js

@@ -43,6 +43,7 @@ function EditableText(_a) {
         delete otherProps.disableLineBreaks;
         delete otherProps.id;
         delete otherProps.as;
+        delete otherProps.placeholder;
         if (value === "" || typeof value !== "string") {
             if (props.defaultValue) {
                 value = props.defaultValue;

package/build/codegen-worker-script.js

@@ -95,6 +95,7 @@ var typescriptPlugin = __importStar(require("@graphql-codegen/typescript"));
 var typescriptOperationsPlugin = __importStar(require("@graphql-codegen/typescript-operations"));
 var CodegenNoDuplicates = __importStar(require("./graphql-codegen/graphql-codegen-no-duplicates"));
 var CodegenFiles = __importStar(require("./graphql-codegen/graphql-codegen-files"));
+var CodegenQueries = __importStar(require("./graphql-codegen/graphql-codegen-queries"));
 var sendSignal = function (sig) {
     if (worker_threads_1.parentPort) {
         worker_threads_1.parentPort.postMessage(sig);
@@ -201,58 +202,43 @@ function beginWork(opts) {
                             documentSets = {};
                             parseErrors = [];
                             _loop_1 = function (key) {
-                                var pattern, files, err_3;
+                                var pattern, files;
                                 return __generator(this, function (_g) {
                                     switch (_g.label) {
                                         case 0:
                                             pattern = graphqlPatterns[key];
-                                            _g.label = 1;
-                                        case 1:
-                                            _g.trys.push([1, 4, , 5]);
+                                            // Find all the documents by globbing
                                             documentSets[key] = [];
                                             return [4 /*yield*/, (0, glob_promise_1.default)(Path.resolve(opts.baseDirectory, pattern))];
-                                        case 2:
+                                        case 1:
                                             files = _g.sent();
                                             return [4 /*yield*/, Promise.all(files.map(function (file) { return __awaiter(_this, void 0, void 0, function () {
-                                                    var contents, document;
+                                                    var contents, document_1, err_3;
                                                     return __generator(this, function (_a) {
                                                         switch (_a.label) {
-                                                            case 0: return [4 /*yield*/, (0, promises_1.readFile)(file)];
+                                                            case 0:
+                                                                _a.trys.push([0, 2, , 3]);
+                                                                return [4 /*yield*/, (0, promises_1.readFile)(file)];
                                                             case 1:
                                                                 contents = (_a.sent()).toString();
-                                                                document = (0, graphql_1.parse)(contents);
+                                                                document_1 = (0, graphql_1.parse)(contents);
                                                                 documentSets[key].push({
-                                                                    document: document,
+                                                                    document: document_1,
                                                                     rawSDL: contents,
-                                                                    location: file, //.replace(opts.baseDirectory, ""),
+                                                                    location: file,
                                                                 });
-                                                                return [2 /*return*/];
+                                                                return [3 /*break*/, 3];
+                                                            case 2:
+                                                                err_3 = _a.sent();
+                                                                parseErrors.push("Error parsing \"" + file.replace(opts.baseDirectory, "") + ":\n" + err_3);
+                                                                return [3 /*break*/, 3];
+                                                            case 3: return [2 /*return*/];
                                                         }
                                                     });
-                                                }); }))
-                                                // console.log(documentSets[key])
-                                                // return
-                                                // documentSets[key] = await loadDocuments(pattern, {
-                                                //   loaders: [new GraphQLFileLoader()],
-                                                // })
-                                            ];
-                                        case 3:
+                                                }); }))];
+                                        case 2:
                                             _g.sent();
-                                            // console.log(documentSets[key])
-                                            // return
-                                            // documentSets[key] = await loadDocuments(pattern, {
-                                            //   loaders: [new GraphQLFileLoader()],
-                                            // })
-                                            if (key === "views") {
-                                                // console.log(documentSets[key])
-                                                // return
-                                            }
-                                            return [3 /*break*/, 5];
-                                        case 4:
-                                            err_3 = _g.sent();
-                                            parseErrors.push(String(err_3));
-                                            return [3 /*break*/, 5];
-                                        case 5: return [2 /*return*/];
+                                            return [2 /*return*/];
                                     }
                                 });
                             };
@@ -363,6 +349,20 @@ function beginWork(opts) {
                                         },
                                     },
                                 },
+                                "hooks/queries.ts": {
+                                    documents: __spreadArray([], documentSets.queries, true),
+                                    plugins: [
+                                        {
+                                            queries: {},
+                                        },
+                                    ],
+                                    pluginMap: {
+                                        queries: CodegenQueries,
+                                    },
+                                    config: {
+                                        rootDir: opts.baseDirectory,
+                                    },
+                                },
                             };
                             // Notify of generation start
                             sendSignal({

package/build/get-webpack-config.js

@@ -95,21 +95,13 @@ function getWebpackConfig(opts) {
                     entryDir = path_1.default.resolve(path_1.default.dirname(__dirname), "./entry");
                     if (isDev) {
                         if (opts.isAdmin) {
-                            ENTRY["main"] = [
-                                // "webpack-plugin-serve/client",
-                                entryDir + "/entry.publicPath.js",
-                                entryDir + "/entry.admin.dev.js",
-                            ];
+                            ENTRY["main"] = [entryDir + "/entry.publicPath.js", entryDir + "/entry.admin.dev.js"];
                         }
                         else if (isServerless) {
                             ENTRY["main"] = [entryDir + "/entry.serverless.dev.js"];
                         }
                         else {
-                            ENTRY["main"] = [
-                                // "webpack-plugin-serve/client",
-                                entryDir + "/entry.publicPath.js",
-                                entryDir + "/entry.monolith.dev.js",
-                            ];
+                            ENTRY["main"] = [entryDir + "/entry.publicPath.js", entryDir + "/entry.monolith.dev.js"];
                         }
                     }
                     else {
@@ -131,6 +123,7 @@ function getWebpackConfig(opts) {
                     ALIAS["@components"] = path_1.default.join(opts.baseDirectory, "components");
                     ALIAS["@views"] = path_1.default.join(opts.baseDirectory, "views");
                     ALIAS["@hooks"] = path_1.default.join(opts.baseDirectory, "hooks");
+                    ALIAS["@queries"] = path_1.default.join(opts.baseDirectory, "hooks/queries");
                     RULES.push({
                         test: /\.[jt]sx?$/,
                         exclude: /node_modules/,
@@ -198,21 +191,6 @@ function getWebpackConfig(opts) {
                                     },
                                 },
                             },
-                            // {
-                            //   loader: require.resolve("sass-loader"),
-                            //   options: {
-                            //     sourceMap: true,
-                            //     implementation: require("sass"),
-                            //     // prependData: (loaderContext: any) => {
-                            //     //   const entryName = path
-                            //     //     .basename(loaderContext.resourcePath)
-                            //     //     .replace(/\.scss$/i, "")
-                            //     //   return `
-                            //     //   $bundle: ${JSON.stringify(entryName || "")};
-                            //     //   $env: "${process.env.NODE_ENV}";
-                            //     // `
-                            //   },
-                            // },
                         ],
                     });
                     // Define some values
@@ -396,9 +374,10 @@ function getWebpackConfig(opts) {
                             },
                             output: {
                                 filename: "[name]." + (opts.isAdmin ? "admin" : "frontend") + ".js",
-                                publicPath: isDev ? "//127.0.0.1:" + opts.hotPort + "/" : "/wp-content/themes/" + opts.themeName + "/dist/" + distSuffix,
+                                publicPath: isDev ? "//127.0.0.1:" + opts.hotPort + "/" : "/wp-content/themes/" + opts.themeName + "/dist/" + distSuffix + "/",
                                 path: outputFolder,
                                 globalObject: isSSR ? "this" : "self",
+                                clean: true,
                             },
                             externals: __assign({ worker_threads: true }, EXTERNALS),
                             resolve: {

package/build/graphql-codegen/graphql-codegen-queries.d.ts

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

package/build/graphql-codegen/graphql-codegen-queries.js

@@ -0,0 +1,248 @@
+"use strict";
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var graphql_1 = require("graphql");
+var path_1 = require("path");
+module.exports = {
+    plugin: function (schema, documents, config, info) {
+        var hooks = {};
+        var importTypes = [];
+        var importUtils = {};
+        documents.forEach(function (doc) {
+            var fullFileName = doc.location;
+            var fileName = doc.location.replace(config.rootDir, "");
+            if (doc.document.definitions.length) {
+                var foundQueryOperation_1 = false;
+                doc.document.definitions.forEach(function (item) {
+                    var _a, _b, _c;
+                    // We only care about 'operations'
+                    if (item.kind !== "OperationDefinition" || !item.name)
+                        return;
+                    function throwErrorAtLocation(loc, message) {
+                        var printedSource = "";
+                        if (loc && loc.source) {
+                            loc.source.name = fileName;
+                            printedSource = (0, graphql_1.printSourceLocation)(loc.source, {
+                                line: loc.startToken.line,
+                                column: loc.startToken.column,
+                            });
+                        }
+                        var fullMessage = message;
+                        if (printedSource) {
+                            fullMessage += ":\n\n" + printedSource;
+                        }
+                        else {
+                            fullMessage += " (in " + fileName + ")";
+                        }
+                        var err = new Error(fullMessage);
+                        err.name = "QueryError";
+                        throw err;
+                    }
+                    // Ensure only ONE operation per query file
+                    if (foundQueryOperation_1) {
+                        throwErrorAtLocation(item.loc, "Only one operation is allowed in each queries/*.graphql file");
+                    }
+                    foundQueryOperation_1 = true;
+                    /**
+                     * Determine the 'hook type'
+                     * - 'mutation' if the operation starts with 'mutation' instead of 'query'
+                     * - 'infinite' if the operation contains the word 'infinite'
+                     * - 'normal' otherwise
+                     */
+                    var type = item.operation === "mutation" ? "mutation" : item.name.value.match(/infinite/i) ? "infinite" : "normal";
+                    var name = item.name.value;
+                    var hookName = "use" + name.replace(/^use/i, "").replace(/^[a-z]/, function (c) { return c.toUpperCase(); });
+                    var variablesTypeName = ((_a = item.variableDefinitions) === null || _a === void 0 ? void 0 : _a.length)
+                        ? type === "mutation"
+                            ? name + "MutationVariables"
+                            : name + "QueryVariables"
+                        : null;
+                    var resultTypeName = name + (type === "mutation" ? "Mutation" : "Query");
+                    // For conventions sake, the name of the operation should start with 'Use'
+                    if (!name.match(/^Use/)) {
+                        throwErrorAtLocation(item.name.loc, "Expected your query name to start with 'Use', but found '" + name + "'. Did you mean 'Use" + name + "'");
+                    }
+                    // Another convention, the query name and file name should be the same
+                    var baseName = (0, path_1.basename)(fileName);
+                    if (baseName.replace(".graphql", "") !== name) {
+                        throwErrorAtLocation(item.name.loc, "Expected your query name and file name to match, for conventions sake (eg. '" + baseName + "' should be '" + name + ".graphql')");
+                    }
+                    // Only import variables if the operation has variables
+                    if (variablesTypeName) {
+                        importTypes.push(variablesTypeName);
+                    }
+                    importTypes.push(resultTypeName);
+                    if (type === "normal") {
+                        // Just a normal query!
+                        importUtils["createUseQuery"] = true;
+                        hooks[hookName] = "\n              createUseQuery<" + resultTypeName + ", " + (variablesTypeName || "undefined") + ">({\n                name: " + JSON.stringify(name) + "\n              })\n            ";
+                    }
+                    else if (type === "mutation") {
+                        // A triggerable mutation
+                        importUtils["createUseMutation"] = true;
+                        hooks[hookName] = "\n              createUseMutation<" + resultTypeName + ", " + (variablesTypeName || "undefined") + ">({\n                name: " + JSON.stringify(name) + "\n              })\n            ";
+                    }
+                    else if (type === "infinite") {
+                        // Ensure the query has 'limit' and 'cursor' variables
+                        var limitVariableIsValid_1 = false;
+                        var cursorVariableIsValid_1 = false;
+                        var defaultLimit_1 = 0;
+                        (_b = item.variableDefinitions) === null || _b === void 0 ? void 0 : _b.forEach(function (item) {
+                            var _a, _b;
+                            var variable = item.variable, type = item.type, loc = item.loc, defaultValue = item.defaultValue;
+                            if (((_a = variable === null || variable === void 0 ? void 0 : variable.name) === null || _a === void 0 ? void 0 : _a.value) === "limit") {
+                                // Found 'limit', but make sure it's an Int, and has a default value
+                                if (type.kind === "NamedType" && type.name.value === "Int") {
+                                    if (defaultValue && defaultValue.kind === "IntValue") {
+                                        limitVariableIsValid_1 = true;
+                                        defaultLimit_1 = Number(defaultValue.value);
+                                    }
+                                    else {
+                                        throwErrorAtLocation(loc, "For infinite queries, be sure to give the '$limit' variable a default value!\nFor example: posts($limit: Int = 10, $cursor: String)");
+                                    }
+                                }
+                                else {
+                                    // @ts-ignore
+                                    var wrongType = (_b = type === null || type === void 0 ? void 0 : type.name) === null || _b === void 0 ? void 0 : _b.value;
+                                    throwErrorAtLocation(loc, "For infinite queries, the '$limit' variable is expected to be an 'Int' type, but you've used '" + wrongType + "' instead!\nFor example: posts($limit: Int = 10, $cursor: String)");
+                                }
+                            }
+                            else if (variable.name.value === "cursor") {
+                                // Found 'cursor', but make sure it's a string
+                                if (type.kind === "NamedType") {
+                                    if (type.name.value === "String") {
+                                        cursorVariableIsValid_1 = true;
+                                    }
+                                    else {
+                                        throwErrorAtLocation(loc, "For infinite queries, the required '$cursor' variable must be an optional String.\nFor example: posts($limit: Int = 10, $cursor: String)");
+                                    }
+                                }
+                            }
+                        });
+                        // Check that both the 'limit' and 'cursor' variables are present!
+                        if (!cursorVariableIsValid_1 || !limitVariableIsValid_1) {
+                            throwErrorAtLocation(item.loc, "For infinite queries, you must supply and use the '$limit' and '$cursor' variables\nFor example: posts($limit: Int = 10, $cursor: String) " + cursorVariableIsValid_1 + " " + limitVariableIsValid_1);
+                        }
+                        // Finally, ensure that pageInfo is queried somewhere
+                        // We actually want the selection path for a whole bunch of fields, so that we can extract pagination info, and the list of data
+                        var pageInfo_1 = {
+                            nodesPath: null,
+                            pageInfoPath: null,
+                            endCursorPath: null,
+                            hasNextPagePath: null,
+                        };
+                        var nodesPaths_1 = [];
+                        // To do this, we use the visitor pattern to find the pageInfo field selection
+                        var lookingAtPageInfo_1 = true;
+                        var lookupPath_1 = [];
+                        var parentNode_1;
+                        (0, graphql_1.visit)(item.selectionSet, {
+                            enter: function (node, key, parent, path, ancestors) {
+                                if (node.kind === "Field") {
+                                    lookupPath_1 = __spreadArray(__spreadArray([], lookupPath_1, true), [node.name.value], false);
+                                    if (node.name.value === "pageInfo") {
+                                        parentNode_1 = ancestors[ancestors.length - 2];
+                                        // parentNode = ancestors
+                                        if (pageInfo_1.pageInfoPath) {
+                                            // Detected multiple pageInfo fields in the query — confusing!
+                                            throwErrorAtLocation(node.loc, "For infinite queries, be sure to only use 'pageInfo' once. Multiple 'pageInfo' fields were selected in your query!");
+                                        }
+                                        lookingAtPageInfo_1 = true;
+                                        pageInfo_1.pageInfoPath = lookupPath_1;
+                                    }
+                                    else if (node.name.value === "nodes") {
+                                        nodesPaths_1.push(lookupPath_1);
+                                    }
+                                    else if (lookingAtPageInfo_1) {
+                                        if (node.name.value === "endCursor") {
+                                            pageInfo_1.endCursorPath = lookupPath_1;
+                                        }
+                                        else if (node.name.value === "hasNextPage") {
+                                            pageInfo_1.hasNextPagePath = lookupPath_1;
+                                        }
+                                    }
+                                }
+                            },
+                            leave: function (node, key, parent, path, ancestors) {
+                                if (node.kind === "Field") {
+                                    lookupPath_1 = lookupPath_1.slice(0, -1);
+                                    if (node.name.value === "pageInfo") {
+                                        lookingAtPageInfo_1 = false;
+                                    }
+                                }
+                            },
+                        });
+                        // Make sure we found pageInfo { endCursor, hasNextPage }
+                        if (!pageInfo_1.pageInfoPath || !pageInfo_1.endCursorPath || !pageInfo_1.hasNextPagePath) {
+                            throwErrorAtLocation(undefined, "For infinite queries, you need to ensure you select the 'pageInfo' field and it's child 'hasNextPage' and 'endCursor' fields");
+                        }
+                        // Look for a nodes path which shares the same parent as the pageInfo path
+                        var expectedNodesPath_1 = pageInfo_1.pageInfoPath.slice(0, -1).join(",");
+                        pageInfo_1.nodesPath = nodesPaths_1.find(function (path) {
+                            var testPath = path.slice(0, -1).join(",");
+                            return testPath === expectedNodesPath_1;
+                        });
+                        if (!pageInfo_1.nodesPath || !parentNode_1) {
+                            throwErrorAtLocation(undefined, "For infinite queries, be sure to select some nodes using the 'nodes' field, adjacent to the 'pageInfo' field which has been selected.");
+                        }
+                        var firstArgumentIsValid_1 = false;
+                        var afterArgumentIsValid_1 = false;
+                        (_c = parentNode_1 === null || parentNode_1 === void 0 ? void 0 : parentNode_1.arguments) === null || _c === void 0 ? void 0 : _c.forEach(function (arg) {
+                            if (arg.kind === "Argument") {
+                                if (arg.name.value === "first") {
+                                    if (arg.value.kind === "Variable") {
+                                        if (arg.value.name.value === "limit") {
+                                            firstArgumentIsValid_1 = true;
+                                        }
+                                    }
+                                }
+                                if (arg.name.value === "after") {
+                                    if (arg.value.kind === "Variable") {
+                                        if (arg.value.name.value === "cursor") {
+                                            afterArgumentIsValid_1 = true;
+                                        }
+                                    }
+                                }
+                            }
+                        });
+                        if (parentNode_1 && (!firstArgumentIsValid_1 || !afterArgumentIsValid_1)) {
+                            throwErrorAtLocation(parentNode_1.loc, "You must use the arguments \"first: $limit, after: $cursor:\" when using infinite queries.");
+                        }
+                        // Drill down to the path type
+                        var finalResultTypeName_1 = resultTypeName;
+                        pageInfo_1.nodesPath.forEach(function (key) {
+                            finalResultTypeName_1 = "Exclude<" + finalResultTypeName_1 + "[" + JSON.stringify(key) + "], null>";
+                        });
+                        importUtils["createUseInfiniteQuery"] = true;
+                        hooks[hookName] = "\n              createUseInfiniteQuery<Exclude<" + finalResultTypeName_1 + "[0], null>, Omit<" + (variablesTypeName || "undefined") + ", 'limit' | 'cursor'>>({\n                name: " + JSON.stringify(name) + ",\n                defaultLimit: " + defaultLimit_1 + ",\n                paths: " + JSON.stringify(pageInfo_1) + "\n              })\n            ";
+                    }
+                });
+            }
+        });
+        var utilsToImport = Object.keys(importUtils);
+        if (!utilsToImport)
+            return "export {}";
+        var codeBlocks = [];
+        // Import required utility functions
+        if (utilsToImport.length) {
+            codeBlocks.push("import { " + utilsToImport.join(", ") + " } from 'eddev/hooks/queryUtils'");
+        }
+        // Import types from types.graphql
+        if (importTypes.length) {
+            codeBlocks.push("import { " + importTypes + " } from '../types.graphql'");
+        }
+        for (var hookName in hooks) {
+            var hookCode = hooks[hookName];
+            codeBlocks.push("export const " + hookName + " = " + hookCode);
+        }
+        return codeBlocks.join("\n\n");
+    },
+};

package/components/BrowserRouter.js

@@ -24,6 +24,7 @@ var views_1 = __importDefault(require("@manifest/views"));
 var usePageLoad_1 = require("../hooks/usePageLoad");
 var hooks_1 = require("../hooks");
 var reportErrorStack_1 = require("../utils/reportErrorStack");
+var hasPopulatedCache = false;
 function BrowserRouter(props) {
     var setAppData = (0, hooks_1.useAppDataStore)(function (s) { return s.setAppData; });
     var _a = (0, react_1.useState)(function () { return document.location.href; }), url = _a[0], setUrl = _a[1];
@@ -38,9 +39,10 @@ function BrowserRouter(props) {
             (0, reportErrorStack_1.reportErrorStack)(data.errorStack);
         }
     }, [data]);
-    (0, react_1.useEffect)(function () {
+    if (!hasPopulatedCache) {
+        hasPopulatedCache = true;
         (0, remoteProps_1.setInitialProps)(url, data);
-    }, []);
+    }
     (0, react_1.useEffect)(function () {
         var handle = function (e) {
             setPendingUrl({ popped: true, url: document.location.href });

package/hooks/createUseQuery.d.ts

@@ -0,0 +1,9 @@
+declare type CreateUseQueryOptions = {
+    name: string;
+};
+export declare function createUseQuery<TReturn extends any, TVars extends {
+    [key: string]: any;
+} | undefined>(opts: CreateUseQueryOptions): void;
+export declare function createUseInfiniteQuery(): void;
+export declare function createUseMutation(): void;
+export {};

package/hooks/createUseQuery.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createUseMutation = exports.createUseInfiniteQuery = exports.createUseQuery = void 0;
+function createUseQuery(opts) {
+    // return (opts: QueryOptions) => {
+    // }
+}
+exports.createUseQuery = createUseQuery;
+function createUseInfiniteQuery() { }
+exports.createUseInfiniteQuery = createUseInfiniteQuery;
+function createUseMutation() { }
+exports.createUseMutation = createUseMutation;

package/hooks/queryUtils.d.ts

@@ -0,0 +1,54 @@
+/** Generic Error */
+declare type GraphQLError = {
+    message: string;
+};
+/** Regular queries */
+declare type CreateUseQueryOptions = {
+    name: string;
+};
+declare type QueryOptions = {};
+declare type MaybeVars = {
+    [key: string]: any;
+} | undefined;
+declare type QueryHookReturn<TReturn, TVars> = {
+    loading: boolean;
+    errors?: GraphQLError[];
+    data?: TReturn;
+    refresh: (vars?: TVars) => void;
+};
+declare type QueryHook<TReturn, TVars> = TVars extends undefined ? (vars?: TVars, opts?: QueryOptions) => QueryHookReturn<TReturn, TVars> : (vars: TVars, opts?: QueryOptions) => QueryHookReturn<TReturn, TVars>;
+export declare function createUseQuery<TReturn extends any, TVars extends MaybeVars>(init: CreateUseQueryOptions): QueryHook<TReturn, TVars>;
+/** Infinite queries */
+declare type CreateUseInfiniteQueryOptions = {
+    name: string;
+    defaultLimit: number;
+    paths: {
+        nodesPath: string[];
+        pageInfoPath: string[];
+        endCursorPath: string[];
+        hasNextPagePath: string[];
+    };
+};
+declare type InfiniteQueryHookReturn<TItem, TVars> = {
+    loading: boolean;
+    loadingMore: boolean;
+    errors?: GraphQLError[];
+    items?: TItem[];
+    hasMore?: boolean;
+    canLoadMore?: boolean;
+    refresh: (vars?: TVars) => void;
+    loadMore: () => void;
+};
+declare type InfiniteQueryHasAdditionalVars<TVars> = Exclude<keyof TVars, "limit" | "cursor"> extends never ? false : true;
+declare type InfiniteQueryHook<TItem, TVars> = InfiniteQueryHasAdditionalVars<TVars> extends false ? (vars?: TVars, opts?: QueryOptions) => InfiniteQueryHookReturn<TItem, TVars> : (vars: TVars, opts?: QueryOptions) => InfiniteQueryHookReturn<TItem, TVars>;
+export declare function createUseInfiniteQuery<TItem, TVars extends MaybeVars>(init: CreateUseInfiniteQueryOptions): InfiniteQueryHook<TItem, TVars>;
+declare type MutationHookReturn<TReturn, TVars> = {
+    submitting: boolean;
+    submitted: boolean;
+    errors?: GraphQLError[];
+    data?: TReturn;
+    submit: (vars: TVars) => void;
+};
+declare type MutationHook<TReturn, TVars> = (opts?: QueryOptions) => MutationHookReturn<TReturn, TVars>;
+export declare function createUseMutation<TReturn extends any, TVars extends MaybeVars>(init: CreateUseQueryOptions): MutationHook<TReturn, TVars>;
+export {};

package/hooks/queryUtils.js

@@ -0,0 +1,226 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createUseMutation = exports.createUseInfiniteQuery = exports.createUseQuery = void 0;
+var react_1 = require("react");
+var swr_1 = __importDefault(require("swr"));
+/** Generic fetcher functions */
+var fetcherGET = function (name, params) { return __awaiter(void 0, void 0, void 0, function () {
+    var url, result, payload;
+    return __generator(this, function (_a) {
+        switch (_a.label) {
+            case 0:
+                url = "/wp-json/ed/v1/query/" + name;
+                if (params)
+                    url += "?params=" + encodeURIComponent(params);
+                return [4 /*yield*/, fetch(url, {})];
+            case 1:
+                result = _a.sent();
+                return [4 /*yield*/, result.json()];
+            case 2:
+                payload = _a.sent();
+                return [2 /*return*/, payload];
+        }
+    });
+}); };
+function createUseQuery(init) {
+    var hook = function (vars, opts) {
+        var _a = (0, swr_1.default)([init.name, JSON.stringify(vars)], fetcherGET, {
+            revalidateIfStale: false,
+        }), payload = _a.data, isValidating = _a.isValidating, error = _a.error, mutate = _a.mutate;
+        return {
+            loading: isValidating && !payload,
+            data: payload === null || payload === void 0 ? void 0 : payload.data,
+            errors: error ? [error] : payload === null || payload === void 0 ? void 0 : payload.errors,
+            refresh: mutate,
+        };
+    };
+    return hook;
+}
+exports.createUseQuery = createUseQuery;
+function createUseInfiniteQuery(init) {
+    var extract = function (path, payload) {
+        var value = payload;
+        for (var _i = 0, path_1 = path; _i < path_1.length; _i++) {
+            var segment = path_1[_i];
+            value = value[segment];
+        }
+        return value;
+    };
+    var hook = function (vars, opts) {
+        var _a = (0, react_1.useState)(), activeCursor = _a[0], setActiveCursor = _a[1];
+        var _b = (0, react_1.useState)(), errors = _b[0], setErrors = _b[1];
+        var _c = (0, react_1.useState)(undefined), nextCursor = _c[0], setNextCursor = _c[1];
+        var _d = (0, react_1.useState)(false), hasMore = _d[0], setHasMore = _d[1];
+        var _e = (0, react_1.useState)(true), isLoadingMore = _e[0], setIsLoadingMore = _e[1];
+        var _f = (0, react_1.useState)([]), items = _f[0], setItems = _f[1];
+        var _g = (0, swr_1.default)([
+            init.name,
+            JSON.stringify(__assign(__assign({}, (vars || {})), { cursor: activeCursor })),
+        ], fetcherGET, {
+            revalidateIfStale: false,
+            revalidateOnFocus: false,
+            revalidateOnReconnect: false,
+        }), payload = _g.data, isValidating = _g.isValidating, error = _g.error, mutate = _g.mutate;
+        (0, react_1.useEffect)(function () {
+            if (payload) {
+                console.log("Got payload", payload);
+                setIsLoadingMore(false);
+                if (payload.errors) {
+                    setErrors(payload.errors);
+                }
+                else if (payload.data) {
+                    // Extract data
+                    var nodes_1 = extract(init.paths.nodesPath, payload.data);
+                    var nextCursor_1 = extract(init.paths.endCursorPath, payload.data);
+                    var hasMore_1 = extract(init.paths.hasNextPagePath, payload.data);
+                    setErrors(undefined);
+                    setNextCursor(nextCursor_1);
+                    setHasMore(hasMore_1);
+                    setItems(function () { return __spreadArray(__spreadArray([], items, true), nodes_1, true); });
+                }
+            }
+        }, [payload]);
+        return {
+            loading: isValidating && !items.length,
+            loadingMore: isLoadingMore,
+            items: items,
+            errors: error ? [error] : errors,
+            refresh: function () {
+                setErrors(undefined);
+                setNextCursor(undefined);
+                setActiveCursor(undefined);
+                setIsLoadingMore(false);
+                mutate();
+            },
+            loadMore: function () {
+                if (isLoadingMore || !hasMore)
+                    return;
+                setIsLoadingMore(true);
+                setActiveCursor(nextCursor);
+            },
+            hasMore: hasMore,
+        };
+    };
+    return hook;
+}
+exports.createUseInfiniteQuery = createUseInfiniteQuery;
+function createUseMutation(init) {
+    var _this = this;
+    var hook = function (opts) {
+        var _a = (0, react_1.useState)(false), submitting = _a[0], setSubmitting = _a[1];
+        var _b = (0, react_1.useState)(false), submitted = _b[0], setSubmitted = _b[1];
+        var _c = (0, react_1.useState)(undefined), data = _c[0], setData = _c[1];
+        var _d = (0, react_1.useState)(), errors = _d[0], setErrors = _d[1];
+        var submit = function (params) { return __awaiter(_this, void 0, void 0, function () {
+            var url, result, payload, error_1;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        setSubmitting(true);
+                        setSubmitted(false);
+                        url = "/wp-json/ed/v1/mutation/" + init.name;
+                        _a.label = 1;
+                    case 1:
+                        _a.trys.push([1, 4, , 5]);
+                        return [4 /*yield*/, fetch(url, {
+                                method: "POST",
+                                headers: {
+                                    "Content-type": "application/json",
+                                },
+                                credentials: "include",
+                                body: JSON.stringify(params),
+                            })];
+                    case 2:
+                        result = _a.sent();
+                        return [4 /*yield*/, result.json()];
+                    case 3:
+                        payload = _a.sent();
+                        if (payload.errors) {
+                            setErrors(payload.errors);
+                        }
+                        else {
+                            setData(payload.data);
+                            setSubmitted(true);
+                            setErrors(undefined);
+                        }
+                        return [3 /*break*/, 5];
+                    case 4:
+                        error_1 = _a.sent();
+                        setErrors([error_1]);
+                        return [2 /*return*/];
+                    case 5:
+                        setSubmitting(false);
+                        return [2 /*return*/];
+                }
+            });
+        }); };
+        return {
+            submitting: submitting,
+            submitted: submitted,
+            data: data,
+            errors: errors,
+            submit: submit,
+        };
+    };
+    return hook;
+}
+exports.createUseMutation = createUseMutation;

package/hooks/useAppData.js

@@ -8,7 +8,6 @@ var zustand_1 = __importDefault(require("zustand"));
 var useAppDataStore = (0, zustand_1.default)(function (set) { return ({
     data: undefined,
     setAppData: function (data) {
-        console.log("SET DATA TO", data);
         set({ data: data });
     },
 }); });

package/hooks/useQuery.d.ts

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

package/hooks/useQuery.js

@@ -0,0 +1,10 @@
+"use strict";
+// type QueryResult<T> = [
+//   /** Is loading */
+//   boolean,
+//   /** Error */
+//   Error | null,
+//   /** Data */
+//   T
+// ]
+Object.defineProperty(exports, "__esModule", { value: true });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eddev",
-  "version": "0.1.25-beta-01",
+  "version": "0.1.27",
   "main": "./index.js",
   "license": "MIT",
   "bin": {
@@ -23,7 +23,6 @@
     "@types/rimraf": "^3.0.2",
     "@types/url-parse": "^1.4.4",
     "@types/webpack-dev-server": "^3.11.2",
-    "@types/webpack-plugin-serve": "^1.4.1",
     "csstype": "^3.0.9",
     "react-html-props": "^1.0.32"
   },
@@ -79,13 +78,13 @@
     "react-merge-refs": "^1.1.0",
     "react-refresh": "^0.10.0",
     "rimraf": "^3.0.2",
+    "swr": "^1.0.1",
     "typescript": "^4.4.2",
     "url-parse": "^1.5.3",
     "webpack": "^5.52.0",
     "webpack-bundle-analyzer": "^4.5.0",
     "webpack-dev-server": "^3.11.2",
     "webpack-hot-middleware": "^2.25.0",
-    "webpack-plugin-serve": "^1.5.0",
     "webpack-virtual-modules": "^0.4.3",
     "zustand": "^3.5.10"
   },

package/style/createStitches.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { DefaultThemeMap } from "@stitches/react";
 import { ConfigType } from "@stitches/core/types/config";
 import { Properties as CSS } from "csstype";
@@ -13,6 +12,8 @@ declare type TypographyConfig<Theme extends ConfigType.Theme<{}>, Media extends
         fontSize?: ResponsiveValue<Media, Theme["fontSizes"] extends {} ? `$${Extract<keyof Theme["fontSizes"], string>}` | CSS["fontSize"] : CSS["fontSize"]>;
         textTransform?: CSS["textTransform"];
         fontWeight?: CSS["fontWeight"];
+        wordSpacing?: CSS["wordSpacing"];
+        letterSpacing?: CSS["letterSpacing"];
         lineHeight?: ResponsiveValue<Media, Theme["lineHeights"] extends {} ? `$${Extract<keyof Theme["lineHeights"], string>}` | CSS["lineHeight"] : CSS["lineHeight"]>;
     };
 };
@@ -585,7 +586,7 @@ export declare function createStitches<Prefix extends string = "", Media extends
     } & { [Scale_4 in keyof (Theme & { [Scale_1 in keyof Responsive]: { [T_1 in keyof Responsive[Scale_1]]: string; }; })]: { [Token_2 in keyof (Theme & { [Scale_1 in keyof Responsive]: { [T_1 in keyof Responsive[Scale_1]]: string; }; })[Scale_4]]: import("@stitches/react/types/theme").Token<Extract<Token_2, string | number>, string, Extract<Scale_4, string | void>, "">; }; };
     reset: () => void;
     getCssText: () => string;
-    css: <Composers extends (string | import("react").JSXElementConstructor<any> | import("react").ExoticComponent<any> | import("@stitches/react/types/util").Function | {
+    css: <Composers extends (string | import("@stitches/react/types/util").Function | import("react").ExoticComponent<any> | import("react").JSXElementConstructor<any> | {
         [name: string]: unknown;
     })[], CSS_1 = import("@stitches/react/types/css-util").CSS<{
         initial: "";
@@ -708,7 +709,7 @@ export declare function createStitches<Prefix extends string = "", Media extends
             gridColumn: string;
             "--grid-columns": number;
         };
-    }>>(...composers: { [K_1 in keyof Composers]: Composers[K_1] extends string | import("react").JSXElementConstructor<any> | import("react").ExoticComponent<any> | import("@stitches/react/types/util").Function ? Composers[K_1] : import("@stitches/react/types/stitches").RemoveIndex<CSS_1> & {
+    }>>(...composers: { [K_1 in keyof Composers]: Composers[K_1] extends string | import("@stitches/react/types/util").Function | import("react").ExoticComponent<any> | import("react").JSXElementConstructor<any> ? Composers[K_1] : import("@stitches/react/types/stitches").RemoveIndex<CSS_1> & {
         variants?: {
             [x: string]: {
                 [x: string]: CSS_1;
@@ -722,7 +723,7 @@ export declare function createStitches<Prefix extends string = "", Media extends
     } & CSS_1 & { [K2 in keyof Composers[K_1]]: K2 extends "compoundVariants" | "defaultVariants" | "variants" ? unknown : K2 extends keyof CSS_1 ? CSS_1[K2] : unknown; }; }) => import("@stitches/react/types/styled-component").CssComponent<import("@stitches/react/types/styled-component").StyledComponentType<Composers>, import("@stitches/react/types/styled-component").StyledComponentProps<Composers>, {
         initial: "";
     } & Media, CSS_1>;
-    styled: <Type extends import("react").ComponentType<any> | keyof JSX.IntrinsicElements | import("@stitches/react/types/util").Function, Composers_1 extends (string | import("react").ComponentType<any> | import("@stitches/react/types/util").Function | {
+    styled: <Type extends import("@stitches/react/types/util").Function | keyof JSX.IntrinsicElements | import("react").ComponentType<any>, Composers_1 extends (string | import("@stitches/react/types/util").Function | import("react").ComponentType<any> | {
         [name: string]: unknown;
     })[], CSS_2 = import("@stitches/react/types/css-util").CSS<{
         initial: "";
@@ -845,7 +846,7 @@ export declare function createStitches<Prefix extends string = "", Media extends
             gridColumn: string;
             "--grid-columns": number;
         };
-    }>>(type: Type, ...composers: { [K_2 in keyof Composers_1]: Composers_1[K_2] extends string | import("react").ComponentType<any> | import("@stitches/react/types/util").Function ? Composers_1[K_2] : import("@stitches/react/types/stitches").RemoveIndex<CSS_2> & {
+    }>>(type: Type, ...composers: { [K_2 in keyof Composers_1]: Composers_1[K_2] extends string | import("@stitches/react/types/util").Function | import("react").ComponentType<any> ? Composers_1[K_2] : import("@stitches/react/types/stitches").RemoveIndex<CSS_2> & {
         variants?: {
             [x: string]: {
                 [x: string]: CSS_2;

package/style/createStitches.js

@@ -155,9 +155,7 @@ function parseResponsiveObject(theme, breakpoints, object, varName, scale) {
     var _a;
     // Util for grabbing the raw value of a token, for lerping
     var resolveValue = function (value) {
-        if (typeof value === "string" &&
-            value.match(/^\$[a-z0-9\-\_]+$/) &&
-            scale) {
+        if (typeof value === "string" && value.match(/^\$[a-z0-9\-\_]+$/) && scale) {
             // Single scale
             return theme[scale][value.replace("$", "")];
         }