@rkmodules/rules 0.0.50 → 0.0.52

package/dist/index.esm.js

@@ -0,0 +1,3289 @@
+import { create, all } from 'mathjs';
+import React, { createContext, useLayoutEffect, useEffect, useState, useCallback, useMemo, isValidElement, cloneElement, useContext } from 'react';
+import { Handle, Position, useConnection, getSimpleBezierPath, ReactFlowProvider, useOnSelectionChange, applyNodeChanges, applyEdgeChanges, ReactFlow, Background, BackgroundVariant, Controls } from '@xyflow/react';
+import katex from 'katex';
+import classNames from 'classnames';
+import rcin from 'rc-input-number';
+import { create as create$1 } from 'zustand';
+import { persist } from 'zustand/middleware';
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
+
+
+var __assign = function() {
+    __assign = Object.assign || function __assign(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);
+};
+
+function __rest(s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+}
+
+function __awaiter(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());
+    });
+}
+
+function __generator(thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["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 (g && (g = 0, op[0] && (_ = 0)), _) 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 };
+    }
+}
+
+function __values(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+}
+
+function __read(o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+}
+
+function __spreadArray(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));
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+
+var DISCARD = Symbol("DISCARD");
+/**
+ * removes the common prefix from the paths in the tree
+ * @param tree
+ * @returns
+ */
+function simplifyTree(tree) {
+    var keys = Object.keys(tree);
+    if (keys.length <= 1)
+        return tree; // ✅ Don't simplify if only one path
+    // Parse all paths into number arrays
+    var parsedPaths = keys.map(function (path) { return path.split(";").map(Number); });
+    // Find common prefix
+    var prefixLength = parsedPaths[0].length;
+    for (var i = 1; i < parsedPaths.length; i++) {
+        var path = parsedPaths[i];
+        for (var j = 0; j < prefixLength; j++) {
+            if (path[j] !== parsedPaths[0][j]) {
+                prefixLength = j;
+                break;
+            }
+        }
+    }
+    var simplified = {};
+    for (var i = 0; i < parsedPaths.length; i++) {
+        var oldPath = keys[i];
+        var newPath = parsedPaths[i].slice(prefixLength).join(";");
+        simplified[newPath] = tree[oldPath];
+    }
+    return simplified;
+}
+/**
+ * Expands a tree by applying a function to each item in the tree.
+ * @param tree
+ * @param fn
+ * @returns
+ */
+function expandTree(tree, fn) {
+    var result = {};
+    var _loop_1 = function (path) {
+        var items = tree[path];
+        items.forEach(function (item, i) {
+            var subpath = "".concat(path, ";").concat(i); // Create new sub-branch per item
+            var expandedItems = fn(item, path, i); // Apply function
+            // if (expandedItems.length > 0) {
+            result[subpath] = expandedItems;
+            // }
+        });
+    };
+    for (var path in tree) {
+        _loop_1(path);
+    }
+    return result;
+}
+/**
+ * Creates a new branch for each item in the existing tree branches
+ * @param tree
+ * @returns
+ */
+function graftTree(tree) {
+    return Object.fromEntries(Object.entries(tree).reduce(function (entries, _a) {
+        var _b = __read(_a, 2), path = _b[0], values = _b[1];
+        entries.push.apply(entries, __spreadArray([], __read(values.map(function (value, index) {
+            return [path + ";" + index, [value]];
+        })), false));
+        return entries;
+    }, []));
+}
+/**
+ * Reduce the complexity of a tree by merging the outermost branches.
+ * @param tree
+ */
+function trimTree(tree, depth) {
+    var _a;
+    if (depth === void 0) { depth = 1; }
+    if (depth <= 0)
+        return tree;
+    var result = {};
+    for (var path in tree) {
+        var parts = path.split(";");
+        // leave at least a path length of 1
+        var end = depth >= parts.length ? 1 : -depth;
+        var newPath = parts.slice(0, end).join(";");
+        if (!result[newPath]) {
+            result[newPath] = [];
+        }
+        // flatten onto new branch
+        (_a = result[newPath]).push.apply(_a, __spreadArray([], __read(tree[path]), false));
+    }
+    return result;
+}
+/**
+ * checks if the given structure is a data tree
+ */
+function isTree(value) {
+    return (typeof value === "object" &&
+        value !== null &&
+        !Array.isArray(value) &&
+        Object.keys(value).length > 0 &&
+        Object.values(value).every(function (v) { return Array.isArray(v); }));
+}
+function isSingleTon(value) {
+    return (Object.keys(value).length === 1 && Object.values(value)[0].length === 1);
+}
+/**
+ * turns a value or array of values into a tree
+ */
+function broadCast(value) {
+    if (Array.isArray(value)) {
+        return { "0": value };
+    }
+    if (isTree(value)) {
+        return value;
+    }
+    return { "0": [value] };
+}
+function getBranch(tree, path) {
+    return tree[path];
+}
+/**
+ * maps a tree, the tree branches are flatmapped, so if an array is returned for each item in the list, a flat list is returned
+ * @param tree
+ * @param fn
+ * @returns
+ */
+function mapTree(tree, fn) {
+    return nAryOnTree([tree], function (_a, _b, index) {
+        var _c = __read(_a, 1), item = _c[0];
+        var _d = __read(_b, 1), path = _d[0];
+        return fn(item, path, index);
+    });
+}
+function mapTreeBranch(tree, fn) {
+    return nAryOnTreeBranch([tree], function (_a, _b) {
+        var _c = __read(_a, 1), branch = _c[0];
+        var _d = __read(_b, 1), path = _d[0];
+        return fn(branch, path);
+    });
+}
+/**
+ * n-ary operation on a tree, branch by branch
+ * - branches are matched by index,
+ * - last branches are repeated when the branch count differs
+ * - branch names from the longest or first tree are used
+ * - if a corresponding index does not exist in the branch, its item argument is undefined
+ * - the callback function is called with (items, paths)
+ * @param trees
+ * @param fn
+ * @returns
+ */
+function nAryOnTreeBranch(trees, fn) {
+    var result = {};
+    var allKeys = trees.map(function (tree) { return Object.keys(tree); });
+    var maxBranches = Math.max.apply(Math, __spreadArray([], __read(allKeys.map(function (keys) { return keys.length; })), false));
+    var _loop_2 = function (i) {
+        var paths = allKeys.map(function (keys) { return keys[Math.min(i, keys.length - 1)]; });
+        var branches = trees.map(function (tree) { return tree[paths[trees.indexOf(tree)]] || []; });
+        // get all the paths of which the trees are the longest, use the first
+        var maxPaths = paths.filter(function (_, i) { return allKeys[i].length === maxBranches; });
+        var path = maxPaths[0];
+        var newBranch = fn(branches, paths);
+        if (newBranch === null || newBranch === void 0 ? void 0 : newBranch.length) {
+            result[path] = newBranch;
+        }
+    };
+    // if (!trees.every((t) => Object.keys(t).length > 0)) {
+    //     return result;
+    // }
+    for (var i = 0; i < maxBranches; i++) {
+        _loop_2(i);
+    }
+    return result;
+}
+/**
+ * n-ary operation on a tree, branch by branch
+ * - branches are matched by index,
+ * - last branches are repeated when the branch count differs
+ * - branch names from the longest or first tree are used
+ * - if a corresponding index does not exist in the branch, its item argument is undefined
+ * - the callback function is called with (items, paths, index)
+ * - return DISCARD to not add the item to the branch
+ * @param trees
+ * @param fn
+ * @returns
+ */
+function nAryOnTree(trees, fn, fill) {
+    return nAryOnTreeBranch(trees, function (branches, paths) {
+        var maxLength = Math.max.apply(Math, __spreadArray([], __read(branches.map(function (b) { return b.length; })), false));
+        if (maxLength === 0)
+            return; // Skip empty branches
+        var results = [];
+        var _loop_3 = function (i) {
+            var items = branches.map(function (b) {
+                if (fill) {
+                    // repeat last item if index exceeds branch length
+                    return b[Math.min(i, b.length - 1)];
+                }
+                return b[i];
+            });
+            var result = fn(items, paths, i);
+            if (result !== DISCARD) {
+                results = results.concat(result);
+            }
+        };
+        for (var i = 0; i < maxLength; i++) {
+            _loop_3(i);
+        }
+        return results;
+    });
+}
+/**
+ * binary operation on a tree, branch by branch
+ * - branches are matched by index,
+ * - last branches are repeated when the branch count differs
+ * - branch names from the longest or first tree are used
+ * - if a corresponding index does not exist in the branch, its item argument is undefined
+ * - the callback function is called with (itemA, itemB, pathA, pathB)
+ * @param treeA
+ * @param treeB
+ * @param fn
+ * @returns
+ */
+function binaryOnTreeBranch(treeA, treeB, fn) {
+    return nAryOnTreeBranch([treeA, treeB], function (_a, _b) {
+        var _c = __read(_a, 2), branchA = _c[0], branchB = _c[1];
+        var _d = __read(_b, 2), pathA = _d[0], pathB = _d[1];
+        return fn(branchA, branchB, pathA, pathB);
+    });
+}
+/**
+ * binary operation on a tree, branch by branch
+ * - branches are matched by index,
+ * - last branches are repeated when the branch count differs
+ * - branch names from the longest or first tree are used
+ * - if a corresponding index does not exist in the branch, its item argument is undefined
+ * - the callback function is called with (itemA, itemB, pathA, pathB, index)
+ * @param treeA
+ * @param treeB
+ * @param fn
+ * @returns
+ */
+function binaryOnTree(treeA, treeB, fn, fill) {
+    return nAryOnTree([treeA, treeB], function (_a, _b, index) {
+        var _c = __read(_a, 2), itemA = _c[0], itemB = _c[1];
+        var _d = __read(_b, 2), pathA = _d[0], pathB = _d[1];
+        return fn(itemA, itemB, pathA, pathB, index);
+    }, fill);
+}
+function treeSize(tree) {
+    return Object.keys(tree).length;
+}
+function sameShape(a, b) {
+    var sa = Object.keys(a).sort().join("|");
+    var sb = Object.keys(b).sort().join("|");
+    return sa === sb;
+}
+/**
+ * flattens the whole tree into an array
+ */
+function toArray(a) {
+    return Object.values(a).flat();
+}
+
+// utilities
+/**
+ * merges two trees by concatenating the branches with the same path
+ * @param a
+ * @param b
+ * @returns
+ */
+function mergeTrees(a, b) {
+    var e_1, _a;
+    var _b;
+    var out = __assign({}, a);
+    try {
+        for (var _c = __values(Object.entries(b)), _d = _c.next(); !_d.done; _d = _c.next()) {
+            var _e = __read(_d.value, 2), k = _e[0], arr = _e[1];
+            out[k] = ((_b = out[k]) !== null && _b !== void 0 ? _b : []).concat(arr);
+        }
+    }
+    catch (e_1_1) { e_1 = { error: e_1_1 }; }
+    finally {
+        try {
+            if (_d && !_d.done && (_a = _c.return)) _a.call(_c);
+        }
+        finally { if (e_1) throw e_1.error; }
+    }
+    return out;
+}
+
+function isReference(value) {
+    return (typeof value === "string" &&
+        value.startsWith("<") &&
+        value.endsWith(">"));
+}
+function parseReference(ref) {
+    return ref.slice(1, -1);
+}
+function uid$1() {
+    return Math.random().toString(36).substring(2, 15);
+}
+function getValue$1(obj, path) {
+    if (!(obj && path)) {
+        return;
+    }
+    var parts = path.split(".");
+    var value = obj[parts.shift() || ""];
+    while (parts.length && value) {
+        value = value[parts.shift() || ""];
+    }
+    return value;
+}
+function interpolateValue(value, scope) {
+    if (Array.isArray(value)) {
+        if (!value.length)
+            return broadCast([]);
+        if (!value.every(isTree)) {
+            // interpolate to an array of trees
+            var mappedValue_1 = value.map(function (v) { return interpolateValue(v, scope); });
+            if (!mappedValue_1.every(isTree)) {
+                // this is a bit of a hack when the values were all plain values
+                // in that case, just return them, which will result in a single tree
+                return mappedValue_1;
+            }
+            // then, for each value, combine the branches with the same index
+            return nAryOnTreeBranch(mappedValue_1, function (branches) { return branches.flat(); });
+        }
+        else {
+            // combine the trees into one
+            var tree = value.reduce(function (acc, t) { return mergeTrees(acc, t); });
+            return mapTree(tree, function (v) { return interpolateValue(v, scope); });
+        }
+    }
+    if (isTree(value)) {
+        return mapTree(value, function (v) { return interpolateValue(v, scope); });
+    }
+    if (typeof value === "object" && value !== null) {
+        if (Object.keys(value).length === 0) {
+            return {};
+        }
+        // interpolate to a record of trees:
+        var interpolated = interpolate(value, scope);
+        // then, for each value, combine the branches with the same index
+        var keys_1 = Object.keys(interpolated);
+        return nAryOnTree(Object.values(interpolated), function (items) {
+            return Object.fromEntries(items.map(function (item, keyIndex) {
+                return [keys_1[keyIndex], item];
+            }));
+        });
+    }
+    if (!isReference(value)) {
+        return value;
+    }
+    var parts = parseReference(value).split(".");
+    var mappedValue = getValue$1(scope, parts.slice(0, 2).join("."));
+    if (parts.length > 2) {
+        // deep interpolate
+        mappedValue = mapTree(mappedValue, function (v) {
+            return getValue$1(v, parts.slice(2).join("."));
+        });
+    }
+    return mappedValue;
+}
+function interpolate(inputs, scope) {
+    return Object.fromEntries(Object.entries(inputs).map(function (_a) {
+        var _b = __read(_a, 2), key = _b[0], value = _b[1];
+        var mappedValue = interpolateValue(value, scope);
+        return [key, broadCast(mappedValue)];
+    }));
+}
+
+/**
+ * TODO: need rank polymorhism on the tree item sizes
+ */
+var getValue = {
+    name: "getValue",
+    label: "Get Value",
+    description: "Get a value from an object at a specified path.",
+    inputs: {
+        tree: "any",
+        path: "string",
+    },
+    outputs: {
+        tree: "any",
+    },
+    // TODO: may want to do something with other values of path
+    impl: function (inputs, params) { return __awaiter(void 0, void 0, void 0, function () {
+        var paths, tree;
+        return __generator(this, function (_a) {
+            paths = toArray(inputs.path || {});
+            tree = mapTree(inputs.tree, function (value) {
+                // get the property from the object
+                return getValue$1(value, paths[0]);
+            });
+            return [2 /*return*/, { tree: tree }];
+        });
+    }); },
+};
+
+var log = {
+    name: "log",
+    label: "Log",
+    description: "Logs the input data to the console",
+    nodeType: "Log",
+    inputs: {
+        data: "any",
+    },
+    outputs: {
+        data: "any", // Return the data for potential further use
+    },
+    impl: function (input) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            console.table(input.data);
+            return [2 /*return*/, {
+                    data: input.data, // Return the data for potential further use
+                }];
+        });
+    }); },
+};
+
+/**
+ * value primitive function
+ */
+var value = {
+    name: "value",
+    label: "Value",
+    description: "Outputs a constant value of a specified type",
+    inputs: {},
+    params: {
+        value: "string",
+        type: {
+            type: "string",
+            default: "number",
+            options: ["number", "boolean", "string"],
+        },
+    },
+    outputs: {
+        value: "any",
+    },
+    impl: function (inputs, params) { return __awaiter(void 0, void 0, void 0, function () {
+        var value;
+        return __generator(this, function (_a) {
+            value = params.value;
+            switch (params.type) {
+                case "number":
+                    return [2 /*return*/, { value: broadCast(Number(value)) }];
+                case "boolean":
+                    return [2 /*return*/, { value: broadCast(Boolean(value)) }];
+                case "string":
+                    return [2 /*return*/, { value: broadCast(String(value)) }];
+                default:
+                    // return as is
+                    return [2 /*return*/, { value: broadCast(value) }];
+            }
+        });
+    }); },
+};
+
+var _a$6;
+var primitives$6 = (_a$6 = {},
+    _a$6[getValue.name] = getValue,
+    _a$6[log.name] = log,
+    _a$6[value.name] = value,
+    _a$6);
+
+var add = {
+    name: "add",
+    label: "Add",
+    description: "Add two numbers",
+    inputs: {
+        a: { type: "number", default: 0 },
+        b: { type: "number", default: 0 },
+    },
+    outputs: {
+        sum: "number",
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    sum: binaryOnTree(inputs.a, inputs.b, function (itemA, itemB) {
+                        return itemA + itemB;
+                    }, true),
+                }];
+        });
+    }); },
+};
+
+var math$1 = create(all, {});
+function evaluate(expression, scope) {
+    // console.log("evaluating", expression, "in", scope);
+    var result;
+    try {
+        result = math$1.evaluate(expression, scope);
+        if (typeof result.toNumber === "function") {
+            result = result.toNumber();
+        }
+    }
+    catch (e) {
+        console.log("Calc:", e);
+        console.log("Calc:", { expression: expression, scope: scope });
+        // todo: communicate errors
+    }
+    // console.log("result", result);
+    return result;
+}
+/**
+ * TODO: need rank polymorhism on the tree item sizes
+ */
+var calc = {
+    name: "calc",
+    label: "Calc",
+    nodeType: "Calc",
+    inputs: {},
+    params: {
+        expression: "string",
+    },
+    outputs: {
+        result: "number",
+    },
+    impl: function (inputs, params) { return __awaiter(void 0, void 0, void 0, function () {
+        var expression, inputEntries, result;
+        return __generator(this, function (_a) {
+            expression = params.expression;
+            if (!expression)
+                return [2 /*return*/, {}];
+            inputEntries = Object.entries(inputs);
+            if (!inputEntries.every(function (_a, i, a) {
+                var _b = __read(_a, 2); _b[0]; var v = _b[1];
+                return sameShape(v, a[0][1]);
+            })) {
+                throw new Error("All inputs must have the same shape");
+            }
+            // if no inputs, just return the result of the expression
+            if (inputEntries.length === 0) {
+                return [2 /*return*/, { result: broadCast(evaluate(expression, {})) }];
+            }
+            result = mapTree(inputEntries[0][1], function (_, p, i) {
+                // create a scope for each input
+                var vars = {};
+                inputEntries.forEach(function (_a) {
+                    var _b = __read(_a, 2), key = _b[0], value = _b[1];
+                    vars[key] = value[p][i];
+                });
+                return evaluate(expression, vars);
+            });
+            // await new Promise((resolve) => setTimeout(resolve, 5000)); // yield to event loop
+            return [2 /*return*/, { result: result }];
+        });
+    }); },
+};
+var BUILT_INS = new Set([
+    // constants
+    "pi",
+    "e",
+    "tau",
+    "phi",
+    "Infinity",
+    "NaN",
+    "i",
+    "true",
+    "false",
+    "null",
+    // common built-in functions (skip as variables when used as callees)
+    "sin",
+    "cos",
+    "tan",
+    "asin",
+    "acos",
+    "atan",
+    "atan2",
+    "sinh",
+    "cosh",
+    "tanh",
+    "log",
+    "log10",
+    "ln",
+    "exp",
+    "sqrt",
+    "abs",
+    "min",
+    "max",
+    "round",
+    "floor",
+    "ceil",
+    "sum",
+    "mean",
+    "median",
+    "mode",
+    "std",
+    "var",
+    "pow",
+    "mod",
+    "gcd",
+    "lcm",
+    "derivative",
+    "integral",
+    "simplify",
+    "im",
+    "re",
+]);
+/**
+ * Return a sorted list of unbound symbol names in a MathJS expression.
+ * @param expr The expression string, e.g. "x + y"
+ * @param scope Names already defined/known (e.g. from your evaluation scope)
+ * @param extraBound Extra names to treat as bound (e.g. UI reserved words)
+ */
+function getUnboundSymbols(expr, scope, extraBound) {
+    if (scope === void 0) { scope = {}; }
+    if (extraBound === void 0) { extraBound = []; }
+    var ast;
+    try {
+        ast = math$1.parse(expr);
+    }
+    catch (_a) {
+        return [];
+    }
+    var bound = new Set(__spreadArray(__spreadArray([], __read(Object.keys(scope)), false), __read(extraBound), false));
+    var free = new Set();
+    var isFunctionCallee = function (node, parent) {
+        return (parent === null || parent === void 0 ? void 0 : parent.type) === "FunctionNode" && parent.fn === node;
+    };
+    ast.traverse(function (node, _path, parent) {
+        if (node.type !== "SymbolNode")
+            return;
+        var name = node.name;
+        // Skip if symbol is the function name in a call, e.g. sin in sin(x)
+        if (isFunctionCallee(node, parent))
+            return;
+        // Skip mathjs built-ins and anything caller said is already bound
+        if (BUILT_INS.has(name) || bound.has(name))
+            return;
+        free.add(name);
+    });
+    // If you want to also exclude left-hand sides of assignments within the expr:
+    // (Uncommon in "fill in variables" UIs, but easy to guard against.)
+    ast.traverse(function (node) {
+        if (node.type === "AssignmentNode") {
+            var target = node.object;
+            if ((target === null || target === void 0 ? void 0 : target.type) === "SymbolNode") {
+                free.delete(target.name);
+            }
+        }
+    });
+    return Array.from(free).sort();
+}
+
+var divide = {
+    name: "divide",
+    label: "Divide",
+    description: "Divide two numbers",
+    inputs: {
+        a: { type: "number", default: 1 },
+        b: { type: "number", default: 1 },
+    },
+    outputs: {
+        quotient: "number",
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    quotient: binaryOnTree(inputs.a, inputs.b, function (itemA, itemB) {
+                        return itemA / itemB;
+                    }, true),
+                }];
+        });
+    }); },
+};
+
+var greaterThan = {
+    name: "greaterThan",
+    label: "Greater Than",
+    description: "Compare on greater than or greater than or equal to",
+    inputs: {
+        a: "number",
+        b: "number",
+    },
+    outputs: {
+        gt: "boolean",
+        gte: "boolean",
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    gt: binaryOnTree(inputs.a, inputs.b, function (itemA, itemB) {
+                        return itemA > itemB;
+                    }, true),
+                    gte: binaryOnTree(inputs.a, inputs.b, function (itemA, itemB) {
+                        return itemA >= itemB;
+                    }, true),
+                }];
+        });
+    }); },
+};
+
+var lessThan = {
+    name: "lessThan",
+    label: "Less Than",
+    description: "Compare on less than or less than or equal to",
+    inputs: {
+        a: "number",
+        b: "number",
+    },
+    outputs: {
+        lt: "boolean",
+        lte: "boolean",
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    lt: binaryOnTree(inputs.a, inputs.b, function (itemA, itemB) {
+                        return itemA < itemB;
+                    }, true),
+                    lte: binaryOnTree(inputs.a, inputs.b, function (itemA, itemB) {
+                        return itemA <= itemB;
+                    }, true),
+                }];
+        });
+    }); },
+};
+
+var multiply = {
+    name: "multiply",
+    label: "Multiply",
+    description: "Multiply two numbers",
+    inputs: {
+        a: { type: "number", default: 1 },
+        b: { type: "number", default: 1 },
+    },
+    outputs: {
+        product: "number",
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    product: binaryOnTree(inputs.a, inputs.b, function (itemA, itemB) {
+                        return itemA * itemB;
+                    }, true),
+                }];
+        });
+    }); },
+};
+
+var subtract = {
+    name: "subtract",
+    label: "Subtract",
+    description: "Subtract two numbers",
+    inputs: {
+        a: { type: "number", default: 0 },
+        b: { type: "number", default: 0 },
+    },
+    outputs: {
+        difference: "number",
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    difference: binaryOnTree(inputs.a, inputs.b, function (itemA, itemB) {
+                        return itemA - itemB;
+                    }, true),
+                }];
+        });
+    }); },
+};
+
+var _a$5;
+var primitives$5 = (_a$5 = {},
+    _a$5[calc.name] = calc,
+    _a$5[lessThan.name] = lessThan,
+    _a$5[greaterThan.name] = greaterThan,
+    _a$5[add.name] = add,
+    _a$5[subtract.name] = subtract,
+    _a$5[multiply.name] = multiply,
+    _a$5[divide.name] = divide,
+    _a$5);
+
+var filterList = {
+    name: "filterList",
+    label: "Filter List",
+    description: "Filters the list by a boolean value",
+    inputs: {
+        list: "any",
+        keep: "boolean",
+    },
+    outputs: {
+        list: "any",
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    list: binaryOnTreeBranch(inputs.list || {}, inputs.keep || {}, function (branchA, branchB) {
+                        return branchA.filter(function (item, index) {
+                            return (branchB[Math.min(index, branchB.length - 1)] ===
+                                true);
+                        });
+                    }),
+                }];
+        });
+    }); },
+};
+
+var splitGroup = {
+    name: "splitGroup",
+    label: "Split Group",
+    description: "Splits every item of a group into its own group",
+    inputs: {
+        tree: "any",
+    },
+    outputs: {
+        tree: "any", // Return the grafted nodes
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    tree: graftTree(inputs.tree || {}),
+                }];
+        });
+    }); },
+};
+
+var listItem = {
+    name: "listItem",
+    label: "List Item",
+    description: "Retrieve the items from the list at the specified indices",
+    inputs: {
+        list: "any",
+        index: {
+            type: "number",
+            default: 0,
+        },
+    },
+    outputs: {
+        item: "any",
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    // item: mapTreeBranch(inputs.list, (branch, path) => {
+                    //     let indices = getBranch(inputs.index, path);
+                    //     if (indices) {
+                    //         return indices.map((i) => branch[i]);
+                    //     }
+                    // }),
+                    item: binaryOnTreeBranch(inputs.list || {}, inputs.index || {}, function (branch, indices) {
+                        if (indices) {
+                            return indices.map(function (i) { return branch[i]; });
+                        }
+                    }),
+                }];
+        });
+    }); },
+};
+
+var listLength = {
+    name: "listLength",
+    label: "List Length",
+    description: "Get the length of a list",
+    inputs: {
+        list: "any",
+    },
+    outputs: {
+        length: "number",
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    length: mapTreeBranch(inputs.list || {}, function (branch) {
+                        return [branch.length];
+                    }),
+                }];
+        });
+    }); },
+};
+
+var mergeGroup = {
+    name: "mergeGroup",
+    label: "Merge Group",
+    description: "Merge the deepest groups into their parent.",
+    inputs: {
+        tree: "any",
+    },
+    params: {
+        depth: { type: "number", default: 1 }, // Optional depth to trim the tree
+    },
+    outputs: {
+        tree: "any", // Return the trimed nodes
+    },
+    impl: function (inputs, params) { return __awaiter(void 0, void 0, void 0, function () {
+        var depth;
+        var _a;
+        return __generator(this, function (_b) {
+            depth = (_a = params.depth) !== null && _a !== void 0 ? _a : 1;
+            return [2 /*return*/, {
+                    tree: trimTree(inputs.tree, depth),
+                }];
+        });
+    }); },
+};
+
+var shiftList = {
+    name: "shiftList",
+    label: "Shift List",
+    description: "Shifts the list to the left, removing the first element and adding it at the end if wrap is enabled",
+    inputs: {
+        list: "any",
+        step: { type: "number", default: 1, step: 1 },
+        wrap: "boolean",
+    },
+    outputs: {
+        list: "any",
+    },
+    impl: function (inputs, params) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    list: nAryOnTreeBranch([inputs.list || {}, inputs.step || {}, inputs.wrap || {}], function (_a) {
+                        var _b;
+                        var _c = __read(_a, 3), list = _c[0], step = _c[1], wrap = _c[2];
+                        var n = (_b = step[0]) !== null && _b !== void 0 ? _b : 1;
+                        if (wrap[0]) {
+                            n = n % (list.length || 1);
+                        }
+                        var shifted = list.slice(n);
+                        if (wrap[0]) {
+                            shifted.push.apply(shifted, __spreadArray([], __read(list.slice(0, n)), false));
+                        }
+                        return shifted;
+                    }),
+                }];
+        });
+    }); },
+};
+
+var _a$4;
+var primitives$4 = (_a$4 = {},
+    _a$4[splitGroup.name] = splitGroup,
+    _a$4[mergeGroup.name] = mergeGroup,
+    _a$4[listItem.name] = listItem,
+    _a$4[listLength.name] = listLength,
+    _a$4[filterList.name] = filterList,
+    _a$4[shiftList.name] = shiftList,
+    _a$4);
+
+var series = {
+    name: "series",
+    label: "Series",
+    description: "Create a series of numbers.",
+    inputs: {
+        start: { type: "number", default: 0 },
+        step: { type: "number", default: 1 },
+        count: { type: "number", default: 10 },
+    },
+    outputs: {
+        series: "number",
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    series: nAryOnTreeBranch([
+                        graftTree(inputs.start),
+                        graftTree(inputs.step),
+                        graftTree(inputs.count),
+                    ], function (_a) {
+                        var _b = __read(_a, 3), _c = __read(_b[0], 1), _d = _c[0], start = _d === void 0 ? 0 : _d, _e = __read(_b[1], 1), _f = _e[0], step = _f === void 0 ? 1 : _f, _g = __read(_b[2], 1), _h = _g[0], count = _h === void 0 ? 10 : _h;
+                        var series = [];
+                        for (var i = 0; i < count; i++) {
+                            series.push(start + i * step);
+                        }
+                        return series;
+                    }),
+                }];
+        });
+    }); },
+};
+
+var _a$3;
+var primitives$3 = (_a$3 = {},
+    _a$3[series.name] = series,
+    _a$3);
+
+var mergeTree = {
+    name: "mergeTree",
+    label: "Merge Tree",
+    description: "Merge multiple trees into a single tree.",
+    nodeType: "Merge",
+    inputs: {},
+    outputs: {
+        result: "any",
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        var result;
+        return __generator(this, function (_a) {
+            result = {};
+            Object.values(inputs).forEach(function (input) {
+                Object.entries(input).forEach(function (_a) {
+                    var _b = __read(_a, 2), key = _b[0], value = _b[1];
+                    if (!result[key]) {
+                        result[key] = value;
+                    }
+                    else {
+                        result[key] = __spreadArray(__spreadArray([], __read(result[key]), false), __read(value), false);
+                    }
+                });
+            });
+            return [2 /*return*/, { result: result }];
+        });
+    }); },
+};
+
+var _a$2;
+var primitives$2 = (_a$2 = {},
+    _a$2[mergeTree.name] = mergeTree,
+    _a$2);
+
+var groupAnd = {
+    name: "groupAnd",
+    label: "Group and",
+    description: "Returns true if all of the items in a group are true",
+    inputs: {
+        tree: "boolean",
+    },
+    outputs: {
+        result: "boolean",
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    result: mapTreeBranch(inputs.tree, function (branch) {
+                        return [branch.reduce(function (acc, val) { return acc && val; }, true)];
+                    }),
+                }];
+        });
+    }); },
+};
+
+var groupOr = {
+    name: "groupOr",
+    label: "Group or",
+    description: "Returns true if any of the items in a group are true",
+    inputs: {
+        tree: "boolean",
+    },
+    outputs: {
+        result: "boolean",
+    },
+    impl: function (inputs) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            return [2 /*return*/, {
+                    result: mapTreeBranch(inputs.tree, function (branch) {
+                        return [branch.reduce(function (acc, val) { return acc || val; }, false)];
+                    }),
+                }];
+        });
+    }); },
+};
+
+var _a$1;
+var primitives$1 = (_a$1 = {},
+    _a$1[groupAnd.name] = groupAnd,
+    _a$1[groupOr.name] = groupOr,
+    _a$1);
+
+var Lib = { Util: primitives$6, Math: primitives$5, List: primitives$4, Sequence: primitives$3, Tree: primitives$2, Logic: primitives$1 };
+var primitives = __assign(__assign(__assign(__assign(__assign(__assign({}, primitives$6), primitives$5), primitives$4), primitives$3), primitives$2), primitives$1);
+
+function isPrimitive(node) {
+    return node.impl !== undefined;
+}
+
+function normalizeVarDef(varDef) {
+    if (typeof varDef === "string") {
+        return {
+            type: varDef,
+        };
+    }
+    return varDef;
+}
+function getReferences(inputs) {
+    var references = [];
+    Object.entries(inputs).forEach(function (_a) {
+        var _b = __read(_a, 2), name = _b[0], value = _b[1];
+        var values = Array.isArray(value) ? value : [value];
+        values.forEach(function (value) {
+            if (!isReference(value)) {
+                return;
+            }
+            var path = parseReference(value);
+            var parts = path.split(".");
+            references.push({
+                name: name,
+                path: path,
+                parts: parts,
+                refNode: parts[0],
+                refField: parts.slice(1).join("."),
+            });
+        });
+    });
+    return references;
+}
+function topSort(fn) {
+    var ordered = [];
+    var visiting = new Set();
+    var done = new Set();
+    var visit = function (id) {
+        // if already done, return
+        if (done.has(id))
+            return;
+        // if being visited, we have a loop
+        if (visiting.has(id)) {
+            throw new Error("Circular dependency detected: ".concat(id));
+        }
+        // mark as visiting
+        visiting.add(id);
+        var fnCall = fn.body[id];
+        if (!fnCall) {
+            console.warn("Function ".concat(id, " not found in body"), fn);
+        }
+        // check the inputs and visit them
+        Object.values(fnCall.inputs || {}).forEach(function (input) {
+            if (isReference(input)) {
+                var _a = __read(parseReference(input).split("."), 1), id_1 = _a[0];
+                // visit inputs
+                if (id_1 !== "inputs") {
+                    visit(id_1);
+                }
+            }
+        });
+        // push to end of the list
+        ordered.push(id);
+        // finish visting
+        visiting.delete(id);
+        // mark as done
+        done.add(id);
+    };
+    Object.keys(fn.body).forEach(visit);
+    var orderedBody = Object.fromEntries(ordered.map(function (id) { return [id, fn.body[id]]; }));
+    return __assign(__assign({}, fn), { body: orderedBody });
+}
+var Engine = /** @class */ (function () {
+    function Engine(morePrimitives) {
+        if (morePrimitives === void 0) { morePrimitives = {}; }
+        this.listeners = {};
+        this.cache = {};
+        this.cacheMiss = Symbol("cacheMiss");
+        this.fnIndex = __assign(__assign({}, primitives), morePrimitives);
+    }
+    Engine.prototype.checkCache = function (fnName, inputs) {
+        if (!this.cache[fnName]) {
+            return this.cacheMiss;
+        }
+        // TODO: need to check the interpolated inputs, as the references can be the same
+        // however, the interpolation does create new objects
+        return {};
+    };
+    Engine.prototype.runGraph = function (node, inputs, params) {
+        return __awaiter(this, void 0, void 0, function () {
+            var _a, body, executionId, context, startTime, _b, _c, _d, _i, name_1, fnCall, fn, inputs_1, params_1, result_1, cacheResult, startTime_1, endTime_1, result, endTime;
+            return __generator(this, function (_e) {
+                switch (_e.label) {
+                    case 0:
+                        _a = node.body, body = _a === void 0 ? {} : _a;
+                        executionId = uid$1();
+                        context = {
+                            scope: { inputs: inputs },
+                            timings: {},
+                            activations: {},
+                        };
+                        startTime = performance.now();
+                        _b = body;
+                        _c = [];
+                        for (_d in _b)
+                            _c.push(_d);
+                        _i = 0;
+                        _e.label = 1;
+                    case 1:
+                        if (!(_i < _c.length)) return [3 /*break*/, 5];
+                        _d = _c[_i];
+                        if (!(_d in _b)) return [3 /*break*/, 4];
+                        name_1 = _d;
+                        fnCall = body[name_1];
+                        fn = this.fnIndex[fnCall.name];
+                        if (!fn) {
+                            throw new Error("function ".concat(fnCall.name, " not found in index"));
+                        }
+                        inputs_1 = interpolate(fnCall.inputs || {}, context.scope);
+                        params_1 = fnCall.params || {};
+                        result_1 = {};
+                        cacheResult = this.checkCache(name_1, inputs_1);
+                        if (!(cacheResult !== this.cacheMiss)) return [3 /*break*/, 2];
+                        // use as result
+                        result_1 = cacheResult;
+                        // store the result in the scope
+                        context.scope[name_1] = result_1;
+                        return [3 /*break*/, 4];
+                    case 2:
+                        // cache miss, call the function implementation
+                        context.activations[name_1] = true;
+                        startTime_1 = performance.now();
+                        this.fireEvent("functionCall", {
+                            name: name_1,
+                            inputs: inputs_1,
+                            params: params_1,
+                            executionId: executionId,
+                            context: context,
+                            startTime: startTime_1,
+                        });
+                        return [4 /*yield*/, fn.impl(inputs_1, params_1)];
+                    case 3:
+                        result_1 = _e.sent();
+                        endTime_1 = performance.now();
+                        context.activations[name_1] = false;
+                        context.timings[name_1] = endTime_1 - startTime_1;
+                        // store the result in the scope
+                        context.scope[name_1] = result_1;
+                        this.fireEvent("functionResult", {
+                            name: name_1,
+                            inputs: inputs_1,
+                            params: params_1,
+                            executionId: executionId,
+                            context: context,
+                            result: result_1,
+                            startTime: startTime_1,
+                            endTime: endTime_1,
+                            duration: endTime_1 - startTime_1,
+                        });
+                        _e.label = 4;
+                    case 4:
+                        _i++;
+                        return [3 /*break*/, 1];
+                    case 5:
+                        result = interpolate(node.outputs || {}, context.scope);
+                        endTime = performance.now();
+                        // fire event
+                        this.fireEvent("result", {
+                            name: node.name,
+                            inputs: inputs,
+                            params: params,
+                            executionId: executionId,
+                            context: context,
+                            result: result,
+                            startTime: startTime,
+                            endTime: endTime,
+                            duration: endTime - startTime,
+                        });
+                        // console.log("Engine run done", result, context, endTime - startTime);
+                        return [2 /*return*/, result];
+                }
+            });
+        });
+    };
+    /**
+     * creates an function that can be evaluated by calling its implementation
+     * @param node
+     * @returns
+     */
+    Engine.prototype.build = function (node, id) {
+        var _this = this;
+        if (isPrimitive(node)) {
+            // already a primitive
+            return node;
+        }
+        var _a = node.body, body = _a === void 0 ? {} : _a, props = __rest(node, ["body"]);
+        var primitive = __assign(__assign({}, props), { outputs: {}, mount: function (trigger) {
+                // mount all the nodes
+                var unsubs = [];
+                Object.values(body).forEach(function (n) {
+                    var _a;
+                    var fn = _this.fnIndex[n.name];
+                    if (!fn) {
+                        console.warn("function ".concat(n.name, " not found in index"));
+                        return;
+                    }
+                    var unsub = (_a = fn.mount) === null || _a === void 0 ? void 0 : _a.call(fn, trigger);
+                    if (unsub) {
+                        unsubs.push(unsub);
+                    }
+                });
+                return function () {
+                    var e_1, _a;
+                    try {
+                        // console.log(`Unmounting function: ${node.name}`);
+                        // unmount all the nodes
+                        for (var unsubs_1 = __values(unsubs), unsubs_1_1 = unsubs_1.next(); !unsubs_1_1.done; unsubs_1_1 = unsubs_1.next()) {
+                            var unsub = unsubs_1_1.value;
+                            unsub();
+                        }
+                    }
+                    catch (e_1_1) { e_1 = { error: e_1_1 }; }
+                    finally {
+                        try {
+                            if (unsubs_1_1 && !unsubs_1_1.done && (_a = unsubs_1.return)) _a.call(unsubs_1);
+                        }
+                        finally { if (e_1) throw e_1.error; }
+                    }
+                };
+            }, impl: function (inputs, params) { return __awaiter(_this, void 0, void 0, function () {
+                return __generator(this, function (_a) {
+                    // console.log(
+                    //     `Running function: ${node.name}`,
+                    //     node,
+                    //     inputs,
+                    //     params
+                    // );
+                    return [2 /*return*/, this.runGraph(node, inputs, params)];
+                });
+            }); } });
+        this.fnIndex[primitive.name] = primitive;
+        return primitive;
+    };
+    Engine.prototype.mount = function (node) {
+        var _this = this;
+        var _a;
+        return (_a = node.mount) === null || _a === void 0 ? void 0 : _a.call(node, function () {
+            // console.log(`Triggering node: ${node.name}`);
+            _this.run(node);
+        });
+    };
+    Engine.prototype.subscribe = function (eventName, listener) {
+        var _this = this;
+        if (!this.listeners[eventName]) {
+            this.listeners[eventName] = new Set();
+        }
+        if (!this.listeners[eventName].has(listener)) {
+            this.listeners[eventName].add(listener);
+        }
+        return function () {
+            _this.listeners[eventName].delete(listener);
+        };
+    };
+    Engine.prototype.fireEvent = function (eventName, event) {
+        var e_2, _a;
+        try {
+            for (var _b = __values(this.listeners[eventName] || []), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var listener = _c.value;
+                listener(event);
+            }
+        }
+        catch (e_2_1) { e_2 = { error: e_2_1 }; }
+        finally {
+            try {
+                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            }
+            finally { if (e_2) throw e_2.error; }
+        }
+    };
+    Engine.prototype.run = function (node_1) {
+        return __awaiter(this, arguments, void 0, function (node, inputs) {
+            var builtFn, mappedInputs, result;
+            var _a;
+            if (inputs === void 0) { inputs = {}; }
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        if (!isPrimitive(node)) {
+                            builtFn = this.getFunction(node.name);
+                            if (!builtFn) {
+                                // not yet build
+                                builtFn = this.build(node);
+                            }
+                            return [2 /*return*/, this.run(builtFn, inputs)];
+                        }
+                        mappedInputs = interpolate(inputs, {});
+                        return [4 /*yield*/, ((_a = node.impl) === null || _a === void 0 ? void 0 : _a.call(node, mappedInputs, {}))];
+                    case 1:
+                        result = _b.sent();
+                        // console.log("Engine run complete", result);
+                        return [2 /*return*/, result];
+                }
+            });
+        });
+    };
+    Engine.prototype.getFunction = function (name) {
+        return this.fnIndex[name];
+    };
+    // node handlers
+    Engine.prototype.applyNodeDelete = function (oldFn, nodeIds) {
+        var newFn = __assign(__assign({}, oldFn), { body: __assign({}, oldFn.body) });
+        nodeIds.forEach(function (id) {
+            delete newFn.body[id];
+        });
+        // remove any references to the deleted nodes
+        Object.entries(newFn.body).forEach(function (_a) {
+            var _b = __read(_a, 2), id = _b[0], node = _b[1];
+            Object.entries(node.inputs || {}).forEach(function (_a) {
+                var _b;
+                var _c = __read(_a, 2), name = _c[0], value = _c[1];
+                if (isReference(value)) {
+                    var path = parseReference(value);
+                    var parts = path.split(".");
+                    if (nodeIds.includes(parts[0])) {
+                        (_b = newFn.body[id].inputs) === null || _b === void 0 ? true : delete _b[name];
+                    }
+                }
+            });
+        });
+        return newFn;
+    };
+    Engine.prototype.applyEdgeDelete = function (oldFn, fromNode, toNode, fromField, toField) {
+        var newFn = __assign(__assign({}, oldFn), { body: __assign({}, oldFn.body) });
+        var from = newFn.body[fromNode];
+        var to = newFn.body[toNode];
+        if (!from || !to) {
+            console.warn("Invalid nodes for edge deletion");
+            return newFn;
+        }
+        if (to.inputs && to.inputs[toField] === "<".concat(fromNode, ".").concat(fromField, ">")) {
+            delete to.inputs[toField];
+        }
+        else {
+            console.warn("No matching edge found to delete");
+        }
+        return newFn;
+    };
+    Engine.prototype.applyNodeAdd = function (oldFn, nodeName, callback) {
+        var newFn = __assign(__assign({}, oldFn), { body: __assign({}, oldFn.body) });
+        var id = uid$1();
+        // ensure unique id
+        while (newFn.body[id]) {
+            id = uid$1();
+        }
+        // get inputs defaults
+        var inputs = {};
+        Object.entries(this.fnIndex[nodeName].inputs || {}).forEach(function (_a) {
+            var _b = __read(_a, 2), key = _b[0], def = _b[1];
+            var normDef = normalizeVarDef(def);
+            if (normDef.default !== undefined) {
+                inputs[key] = normDef.default;
+            }
+        });
+        // get params defaults
+        var params = {};
+        Object.entries(this.fnIndex[nodeName].params || {}).forEach(function (_a) {
+            var _b = __read(_a, 2), key = _b[0], def = _b[1];
+            var normDef = normalizeVarDef(def);
+            if (normDef.default !== undefined) {
+                params[key] = normDef.default;
+            }
+        });
+        var newCall = {
+            name: nodeName,
+            inputs: inputs,
+            params: params,
+        };
+        newFn.body[id] = newCall;
+        callback === null || callback === void 0 ? void 0 : callback(newCall, id);
+        return topSort(newFn);
+    };
+    Engine.prototype.applyNodeConnect = function (oldFn, fromNode, toNode, fromField, toField) {
+        var newFn = __assign(__assign({}, oldFn), { body: __assign({}, oldFn.body) });
+        var from = newFn.body[fromNode];
+        var to = __assign({}, newFn.body[toNode]);
+        if (!from || !to) {
+            console.warn("Invalid nodes for connection");
+            return newFn;
+        }
+        if (!to.inputs) {
+            to.inputs = {};
+        }
+        // add the reference
+        to.inputs[toField] = "<".concat(fromNode, ".").concat(fromField, ">");
+        newFn.body[toNode] = to;
+        return topSort(newFn);
+    };
+    return Engine;
+}());
+
+/**
+ * Create the React Context
+ */ const DndContext = createContext({
+    dragDropManager: undefined
+});
+
+/**
+ * Use invariant() to assert state which your program assumes to be true.
+ *
+ * Provide sprintf-style format (only %s is supported) and arguments
+ * to provide information about what broke and what you were
+ * expecting.
+ *
+ * The invariant message will be stripped in production, but the invariant
+ * will remain to ensure logic does not differ in production.
+ */ function invariant(condition, format, ...args) {
+    if (isProduction()) {
+        if (format === undefined) {
+            throw new Error('invariant requires an error message argument');
+        }
+    }
+    if (!condition) {
+        let error;
+        if (format === undefined) {
+            error = new Error('Minified exception occurred; use the non-minified dev environment ' + 'for the full error message and additional helpful warnings.');
+        } else {
+            let argIndex = 0;
+            error = new Error(format.replace(/%s/g, function() {
+                return args[argIndex++];
+            }));
+            error.name = 'Invariant Violation';
+        }
+        error.framesToPop = 1 // we don't care about invariant's own frame
+        ;
+        throw error;
+    }
+}
+function isProduction() {
+    return typeof process !== 'undefined' && process.env['NODE_ENV'] === 'production';
+}
+
+function getDefaultExportFromCjs (x) {
+	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+}
+
+var fastDeepEqual;
+var hasRequiredFastDeepEqual;
+
+function requireFastDeepEqual () {
+	if (hasRequiredFastDeepEqual) return fastDeepEqual;
+	hasRequiredFastDeepEqual = 1;
+
+	// do not edit .js files directly - edit src/index.jst
+
+
+
+	fastDeepEqual = function equal(a, b) {
+	  if (a === b) return true;
+
+	  if (a && b && typeof a == 'object' && typeof b == 'object') {
+	    if (a.constructor !== b.constructor) return false;
+
+	    var length, i, keys;
+	    if (Array.isArray(a)) {
+	      length = a.length;
+	      if (length != b.length) return false;
+	      for (i = length; i-- !== 0;)
+	        if (!equal(a[i], b[i])) return false;
+	      return true;
+	    }
+
+
+
+	    if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags;
+	    if (a.valueOf !== Object.prototype.valueOf) return a.valueOf() === b.valueOf();
+	    if (a.toString !== Object.prototype.toString) return a.toString() === b.toString();
+
+	    keys = Object.keys(a);
+	    length = keys.length;
+	    if (length !== Object.keys(b).length) return false;
+
+	    for (i = length; i-- !== 0;)
+	      if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false;
+
+	    for (i = length; i-- !== 0;) {
+	      var key = keys[i];
+
+	      if (!equal(a[key], b[key])) return false;
+	    }
+
+	    return true;
+	  }
+
+	  // true if both NaN, false otherwise
+	  return a!==a && b!==b;
+	};
+	return fastDeepEqual;
+}
+
+var fastDeepEqualExports = requireFastDeepEqual();
+var equal = /*@__PURE__*/getDefaultExportFromCjs(fastDeepEqualExports);
+
+// suppress the useLayoutEffect warning on server side.
+const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
+
+/**
+ *
+ * @param monitor The monitor to collect state from
+ * @param collect The collecting function
+ * @param onUpdate A method to invoke when updates occur
+ */ function useCollector(monitor, collect, onUpdate) {
+    const [collected, setCollected] = useState(()=>collect(monitor)
+    );
+    const updateCollected = useCallback(()=>{
+        const nextValue = collect(monitor);
+        // This needs to be a deep-equality check because some monitor-collected values
+        // include XYCoord objects that may be equivalent, but do not have instance equality.
+        if (!equal(collected, nextValue)) {
+            setCollected(nextValue);
+            if (onUpdate) {
+                onUpdate();
+            }
+        }
+    }, [
+        collected,
+        monitor,
+        onUpdate
+    ]);
+    // update the collected properties after react renders.
+    // Note that the "Dustbin Stress Test" fails if this is not
+    // done when the component updates
+    useIsomorphicLayoutEffect(updateCollected);
+    return [
+        collected,
+        updateCollected
+    ];
+}
+
+function useMonitorOutput(monitor, collect, onCollect) {
+    const [collected, updateCollected] = useCollector(monitor, collect, onCollect);
+    useIsomorphicLayoutEffect(function subscribeToMonitorStateChange() {
+        const handlerId = monitor.getHandlerId();
+        if (handlerId == null) {
+            return;
+        }
+        return monitor.subscribeToStateChange(updateCollected, {
+            handlerIds: [
+                handlerId
+            ]
+        });
+    }, [
+        monitor,
+        updateCollected
+    ]);
+    return collected;
+}
+
+function useCollectedProps(collector, monitor, connector) {
+    return useMonitorOutput(monitor, collector || (()=>({})
+    ), ()=>connector.reconnect()
+    );
+}
+
+function useOptionalFactory(arg, deps) {
+    const memoDeps = [
+        ...[]
+    ];
+    if (typeof arg !== 'function') {
+        memoDeps.push(arg);
+    }
+    return useMemo(()=>{
+        return typeof arg === 'function' ? arg() : arg;
+    }, memoDeps);
+}
+
+function useConnectDragSource(connector) {
+    return useMemo(()=>connector.hooks.dragSource()
+    , [
+        connector
+    ]);
+}
+function useConnectDragPreview(connector) {
+    return useMemo(()=>connector.hooks.dragPreview()
+    , [
+        connector
+    ]);
+}
+
+let isCallingCanDrag = false;
+let isCallingIsDragging = false;
+class DragSourceMonitorImpl {
+    receiveHandlerId(sourceId) {
+        this.sourceId = sourceId;
+    }
+    getHandlerId() {
+        return this.sourceId;
+    }
+    canDrag() {
+        invariant(!isCallingCanDrag, 'You may not call monitor.canDrag() inside your canDrag() implementation. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source-monitor');
+        try {
+            isCallingCanDrag = true;
+            return this.internalMonitor.canDragSource(this.sourceId);
+        } finally{
+            isCallingCanDrag = false;
+        }
+    }
+    isDragging() {
+        if (!this.sourceId) {
+            return false;
+        }
+        invariant(!isCallingIsDragging, 'You may not call monitor.isDragging() inside your isDragging() implementation. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source-monitor');
+        try {
+            isCallingIsDragging = true;
+            return this.internalMonitor.isDraggingSource(this.sourceId);
+        } finally{
+            isCallingIsDragging = false;
+        }
+    }
+    subscribeToStateChange(listener, options) {
+        return this.internalMonitor.subscribeToStateChange(listener, options);
+    }
+    isDraggingSource(sourceId) {
+        return this.internalMonitor.isDraggingSource(sourceId);
+    }
+    isOverTarget(targetId, options) {
+        return this.internalMonitor.isOverTarget(targetId, options);
+    }
+    getTargetIds() {
+        return this.internalMonitor.getTargetIds();
+    }
+    isSourcePublic() {
+        return this.internalMonitor.isSourcePublic();
+    }
+    getSourceId() {
+        return this.internalMonitor.getSourceId();
+    }
+    subscribeToOffsetChange(listener) {
+        return this.internalMonitor.subscribeToOffsetChange(listener);
+    }
+    canDragSource(sourceId) {
+        return this.internalMonitor.canDragSource(sourceId);
+    }
+    canDropOnTarget(targetId) {
+        return this.internalMonitor.canDropOnTarget(targetId);
+    }
+    getItemType() {
+        return this.internalMonitor.getItemType();
+    }
+    getItem() {
+        return this.internalMonitor.getItem();
+    }
+    getDropResult() {
+        return this.internalMonitor.getDropResult();
+    }
+    didDrop() {
+        return this.internalMonitor.didDrop();
+    }
+    getInitialClientOffset() {
+        return this.internalMonitor.getInitialClientOffset();
+    }
+    getInitialSourceClientOffset() {
+        return this.internalMonitor.getInitialSourceClientOffset();
+    }
+    getSourceClientOffset() {
+        return this.internalMonitor.getSourceClientOffset();
+    }
+    getClientOffset() {
+        return this.internalMonitor.getClientOffset();
+    }
+    getDifferenceFromInitialOffset() {
+        return this.internalMonitor.getDifferenceFromInitialOffset();
+    }
+    constructor(manager){
+        this.sourceId = null;
+        this.internalMonitor = manager.getMonitor();
+    }
+}
+
+let isCallingCanDrop = false;
+class DropTargetMonitorImpl {
+    receiveHandlerId(targetId) {
+        this.targetId = targetId;
+    }
+    getHandlerId() {
+        return this.targetId;
+    }
+    subscribeToStateChange(listener, options) {
+        return this.internalMonitor.subscribeToStateChange(listener, options);
+    }
+    canDrop() {
+        // Cut out early if the target id has not been set. This should prevent errors
+        // where the user has an older version of dnd-core like in
+        // https://github.com/react-dnd/react-dnd/issues/1310
+        if (!this.targetId) {
+            return false;
+        }
+        invariant(!isCallingCanDrop, 'You may not call monitor.canDrop() inside your canDrop() implementation. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target-monitor');
+        try {
+            isCallingCanDrop = true;
+            return this.internalMonitor.canDropOnTarget(this.targetId);
+        } finally{
+            isCallingCanDrop = false;
+        }
+    }
+    isOver(options) {
+        if (!this.targetId) {
+            return false;
+        }
+        return this.internalMonitor.isOverTarget(this.targetId, options);
+    }
+    getItemType() {
+        return this.internalMonitor.getItemType();
+    }
+    getItem() {
+        return this.internalMonitor.getItem();
+    }
+    getDropResult() {
+        return this.internalMonitor.getDropResult();
+    }
+    didDrop() {
+        return this.internalMonitor.didDrop();
+    }
+    getInitialClientOffset() {
+        return this.internalMonitor.getInitialClientOffset();
+    }
+    getInitialSourceClientOffset() {
+        return this.internalMonitor.getInitialSourceClientOffset();
+    }
+    getSourceClientOffset() {
+        return this.internalMonitor.getSourceClientOffset();
+    }
+    getClientOffset() {
+        return this.internalMonitor.getClientOffset();
+    }
+    getDifferenceFromInitialOffset() {
+        return this.internalMonitor.getDifferenceFromInitialOffset();
+    }
+    constructor(manager){
+        this.targetId = null;
+        this.internalMonitor = manager.getMonitor();
+    }
+}
+
+function registerTarget(type, target, manager) {
+    const registry = manager.getRegistry();
+    const targetId = registry.addTarget(type, target);
+    return [
+        targetId,
+        ()=>registry.removeTarget(targetId)
+    ];
+}
+function registerSource(type, source, manager) {
+    const registry = manager.getRegistry();
+    const sourceId = registry.addSource(type, source);
+    return [
+        sourceId,
+        ()=>registry.removeSource(sourceId)
+    ];
+}
+
+function shallowEqual(objA, objB, compare, compareContext) {
+    let compareResult = void 0;
+    if (compareResult !== void 0) {
+        return !!compareResult;
+    }
+    if (objA === objB) {
+        return true;
+    }
+    if (typeof objA !== 'object' || !objA || typeof objB !== 'object' || !objB) {
+        return false;
+    }
+    const keysA = Object.keys(objA);
+    const keysB = Object.keys(objB);
+    if (keysA.length !== keysB.length) {
+        return false;
+    }
+    const bHasOwnProperty = Object.prototype.hasOwnProperty.bind(objB);
+    // Test for A's keys different from B.
+    for(let idx = 0; idx < keysA.length; idx++){
+        const key = keysA[idx];
+        if (!bHasOwnProperty(key)) {
+            return false;
+        }
+        const valueA = objA[key];
+        const valueB = objB[key];
+        compareResult = void 0;
+        if (compareResult === false || compareResult === void 0 && valueA !== valueB) {
+            return false;
+        }
+    }
+    return true;
+}
+
+function isRef(obj) {
+    return(// eslint-disable-next-line no-prototype-builtins
+    obj !== null && typeof obj === 'object' && Object.prototype.hasOwnProperty.call(obj, 'current'));
+}
+
+function throwIfCompositeComponentElement(element) {
+    // Custom components can no longer be wrapped directly in React DnD 2.0
+    // so that we don't need to depend on findDOMNode() from react-dom.
+    if (typeof element.type === 'string') {
+        return;
+    }
+    const displayName = element.type.displayName || element.type.name || 'the component';
+    throw new Error('Only native element nodes can now be passed to React DnD connectors.' + `You can either wrap ${displayName} into a <div>, or turn it into a ` + 'drag source or a drop target itself.');
+}
+function wrapHookToRecognizeElement(hook) {
+    return (elementOrNode = null, options = null)=>{
+        // When passed a node, call the hook straight away.
+        if (!isValidElement(elementOrNode)) {
+            const node = elementOrNode;
+            hook(node, options);
+            // return the node so it can be chained (e.g. when within callback refs
+            // <div ref={node => connectDragSource(connectDropTarget(node))}/>
+            return node;
+        }
+        // If passed a ReactElement, clone it and attach this function as a ref.
+        // This helps us achieve a neat API where user doesn't even know that refs
+        // are being used under the hood.
+        const element = elementOrNode;
+        throwIfCompositeComponentElement(element);
+        // When no options are passed, use the hook directly
+        const ref = options ? (node)=>hook(node, options)
+         : hook;
+        return cloneWithRef(element, ref);
+    };
+}
+function wrapConnectorHooks(hooks) {
+    const wrappedHooks = {};
+    Object.keys(hooks).forEach((key)=>{
+        const hook = hooks[key];
+        // ref objects should be passed straight through without wrapping
+        if (key.endsWith('Ref')) {
+            wrappedHooks[key] = hooks[key];
+        } else {
+            const wrappedHook = wrapHookToRecognizeElement(hook);
+            wrappedHooks[key] = ()=>wrappedHook
+            ;
+        }
+    });
+    return wrappedHooks;
+}
+function setRef(ref, node) {
+    if (typeof ref === 'function') {
+        ref(node);
+    } else {
+        ref.current = node;
+    }
+}
+function cloneWithRef(element, newRef) {
+    const previousRef = element.ref;
+    invariant(typeof previousRef !== 'string', 'Cannot connect React DnD to an element with an existing string ref. ' + 'Please convert it to use a callback ref instead, or wrap it into a <span> or <div>. ' + 'Read more: https://reactjs.org/docs/refs-and-the-dom.html#callback-refs');
+    if (!previousRef) {
+        // When there is no ref on the element, use the new ref directly
+        return cloneElement(element, {
+            ref: newRef
+        });
+    } else {
+        return cloneElement(element, {
+            ref: (node)=>{
+                setRef(previousRef, node);
+                setRef(newRef, node);
+            }
+        });
+    }
+}
+
+class SourceConnector {
+    receiveHandlerId(newHandlerId) {
+        if (this.handlerId === newHandlerId) {
+            return;
+        }
+        this.handlerId = newHandlerId;
+        this.reconnect();
+    }
+    get connectTarget() {
+        return this.dragSource;
+    }
+    get dragSourceOptions() {
+        return this.dragSourceOptionsInternal;
+    }
+    set dragSourceOptions(options) {
+        this.dragSourceOptionsInternal = options;
+    }
+    get dragPreviewOptions() {
+        return this.dragPreviewOptionsInternal;
+    }
+    set dragPreviewOptions(options) {
+        this.dragPreviewOptionsInternal = options;
+    }
+    reconnect() {
+        const didChange = this.reconnectDragSource();
+        this.reconnectDragPreview(didChange);
+    }
+    reconnectDragSource() {
+        const dragSource = this.dragSource;
+        // if nothing has changed then don't resubscribe
+        const didChange = this.didHandlerIdChange() || this.didConnectedDragSourceChange() || this.didDragSourceOptionsChange();
+        if (didChange) {
+            this.disconnectDragSource();
+        }
+        if (!this.handlerId) {
+            return didChange;
+        }
+        if (!dragSource) {
+            this.lastConnectedDragSource = dragSource;
+            return didChange;
+        }
+        if (didChange) {
+            this.lastConnectedHandlerId = this.handlerId;
+            this.lastConnectedDragSource = dragSource;
+            this.lastConnectedDragSourceOptions = this.dragSourceOptions;
+            this.dragSourceUnsubscribe = this.backend.connectDragSource(this.handlerId, dragSource, this.dragSourceOptions);
+        }
+        return didChange;
+    }
+    reconnectDragPreview(forceDidChange = false) {
+        const dragPreview = this.dragPreview;
+        // if nothing has changed then don't resubscribe
+        const didChange = forceDidChange || this.didHandlerIdChange() || this.didConnectedDragPreviewChange() || this.didDragPreviewOptionsChange();
+        if (didChange) {
+            this.disconnectDragPreview();
+        }
+        if (!this.handlerId) {
+            return;
+        }
+        if (!dragPreview) {
+            this.lastConnectedDragPreview = dragPreview;
+            return;
+        }
+        if (didChange) {
+            this.lastConnectedHandlerId = this.handlerId;
+            this.lastConnectedDragPreview = dragPreview;
+            this.lastConnectedDragPreviewOptions = this.dragPreviewOptions;
+            this.dragPreviewUnsubscribe = this.backend.connectDragPreview(this.handlerId, dragPreview, this.dragPreviewOptions);
+        }
+    }
+    didHandlerIdChange() {
+        return this.lastConnectedHandlerId !== this.handlerId;
+    }
+    didConnectedDragSourceChange() {
+        return this.lastConnectedDragSource !== this.dragSource;
+    }
+    didConnectedDragPreviewChange() {
+        return this.lastConnectedDragPreview !== this.dragPreview;
+    }
+    didDragSourceOptionsChange() {
+        return !shallowEqual(this.lastConnectedDragSourceOptions, this.dragSourceOptions);
+    }
+    didDragPreviewOptionsChange() {
+        return !shallowEqual(this.lastConnectedDragPreviewOptions, this.dragPreviewOptions);
+    }
+    disconnectDragSource() {
+        if (this.dragSourceUnsubscribe) {
+            this.dragSourceUnsubscribe();
+            this.dragSourceUnsubscribe = undefined;
+        }
+    }
+    disconnectDragPreview() {
+        if (this.dragPreviewUnsubscribe) {
+            this.dragPreviewUnsubscribe();
+            this.dragPreviewUnsubscribe = undefined;
+            this.dragPreviewNode = null;
+            this.dragPreviewRef = null;
+        }
+    }
+    get dragSource() {
+        return this.dragSourceNode || this.dragSourceRef && this.dragSourceRef.current;
+    }
+    get dragPreview() {
+        return this.dragPreviewNode || this.dragPreviewRef && this.dragPreviewRef.current;
+    }
+    clearDragSource() {
+        this.dragSourceNode = null;
+        this.dragSourceRef = null;
+    }
+    clearDragPreview() {
+        this.dragPreviewNode = null;
+        this.dragPreviewRef = null;
+    }
+    constructor(backend){
+        this.hooks = wrapConnectorHooks({
+            dragSource: (node, options)=>{
+                this.clearDragSource();
+                this.dragSourceOptions = options || null;
+                if (isRef(node)) {
+                    this.dragSourceRef = node;
+                } else {
+                    this.dragSourceNode = node;
+                }
+                this.reconnectDragSource();
+            },
+            dragPreview: (node, options)=>{
+                this.clearDragPreview();
+                this.dragPreviewOptions = options || null;
+                if (isRef(node)) {
+                    this.dragPreviewRef = node;
+                } else {
+                    this.dragPreviewNode = node;
+                }
+                this.reconnectDragPreview();
+            }
+        });
+        this.handlerId = null;
+        // The drop target may either be attached via ref or connect function
+        this.dragSourceRef = null;
+        this.dragSourceOptionsInternal = null;
+        // The drag preview may either be attached via ref or connect function
+        this.dragPreviewRef = null;
+        this.dragPreviewOptionsInternal = null;
+        this.lastConnectedHandlerId = null;
+        this.lastConnectedDragSource = null;
+        this.lastConnectedDragSourceOptions = null;
+        this.lastConnectedDragPreview = null;
+        this.lastConnectedDragPreviewOptions = null;
+        this.backend = backend;
+    }
+}
+
+class TargetConnector {
+    get connectTarget() {
+        return this.dropTarget;
+    }
+    reconnect() {
+        // if nothing has changed then don't resubscribe
+        const didChange = this.didHandlerIdChange() || this.didDropTargetChange() || this.didOptionsChange();
+        if (didChange) {
+            this.disconnectDropTarget();
+        }
+        const dropTarget = this.dropTarget;
+        if (!this.handlerId) {
+            return;
+        }
+        if (!dropTarget) {
+            this.lastConnectedDropTarget = dropTarget;
+            return;
+        }
+        if (didChange) {
+            this.lastConnectedHandlerId = this.handlerId;
+            this.lastConnectedDropTarget = dropTarget;
+            this.lastConnectedDropTargetOptions = this.dropTargetOptions;
+            this.unsubscribeDropTarget = this.backend.connectDropTarget(this.handlerId, dropTarget, this.dropTargetOptions);
+        }
+    }
+    receiveHandlerId(newHandlerId) {
+        if (newHandlerId === this.handlerId) {
+            return;
+        }
+        this.handlerId = newHandlerId;
+        this.reconnect();
+    }
+    get dropTargetOptions() {
+        return this.dropTargetOptionsInternal;
+    }
+    set dropTargetOptions(options) {
+        this.dropTargetOptionsInternal = options;
+    }
+    didHandlerIdChange() {
+        return this.lastConnectedHandlerId !== this.handlerId;
+    }
+    didDropTargetChange() {
+        return this.lastConnectedDropTarget !== this.dropTarget;
+    }
+    didOptionsChange() {
+        return !shallowEqual(this.lastConnectedDropTargetOptions, this.dropTargetOptions);
+    }
+    disconnectDropTarget() {
+        if (this.unsubscribeDropTarget) {
+            this.unsubscribeDropTarget();
+            this.unsubscribeDropTarget = undefined;
+        }
+    }
+    get dropTarget() {
+        return this.dropTargetNode || this.dropTargetRef && this.dropTargetRef.current;
+    }
+    clearDropTarget() {
+        this.dropTargetRef = null;
+        this.dropTargetNode = null;
+    }
+    constructor(backend){
+        this.hooks = wrapConnectorHooks({
+            dropTarget: (node, options)=>{
+                this.clearDropTarget();
+                this.dropTargetOptions = options;
+                if (isRef(node)) {
+                    this.dropTargetRef = node;
+                } else {
+                    this.dropTargetNode = node;
+                }
+                this.reconnect();
+            }
+        });
+        this.handlerId = null;
+        // The drop target may either be attached via ref or connect function
+        this.dropTargetRef = null;
+        this.dropTargetOptionsInternal = null;
+        this.lastConnectedHandlerId = null;
+        this.lastConnectedDropTarget = null;
+        this.lastConnectedDropTargetOptions = null;
+        this.backend = backend;
+    }
+}
+
+/**
+ * A hook to retrieve the DragDropManager from Context
+ */ function useDragDropManager() {
+    const { dragDropManager  } = useContext(DndContext);
+    invariant(dragDropManager != null, 'Expected drag drop context');
+    return dragDropManager;
+}
+
+function useDragSourceConnector(dragSourceOptions, dragPreviewOptions) {
+    const manager = useDragDropManager();
+    const connector = useMemo(()=>new SourceConnector(manager.getBackend())
+    , [
+        manager
+    ]);
+    useIsomorphicLayoutEffect(()=>{
+        connector.dragSourceOptions = dragSourceOptions || null;
+        connector.reconnect();
+        return ()=>connector.disconnectDragSource()
+        ;
+    }, [
+        connector,
+        dragSourceOptions
+    ]);
+    useIsomorphicLayoutEffect(()=>{
+        connector.dragPreviewOptions = dragPreviewOptions || null;
+        connector.reconnect();
+        return ()=>connector.disconnectDragPreview()
+        ;
+    }, [
+        connector,
+        dragPreviewOptions
+    ]);
+    return connector;
+}
+
+function useDragSourceMonitor() {
+    const manager = useDragDropManager();
+    return useMemo(()=>new DragSourceMonitorImpl(manager)
+    , [
+        manager
+    ]);
+}
+
+class DragSourceImpl {
+    beginDrag() {
+        const spec = this.spec;
+        const monitor = this.monitor;
+        let result = null;
+        if (typeof spec.item === 'object') {
+            result = spec.item;
+        } else if (typeof spec.item === 'function') {
+            result = spec.item(monitor);
+        } else {
+            result = {};
+        }
+        return result !== null && result !== void 0 ? result : null;
+    }
+    canDrag() {
+        const spec = this.spec;
+        const monitor = this.monitor;
+        if (typeof spec.canDrag === 'boolean') {
+            return spec.canDrag;
+        } else if (typeof spec.canDrag === 'function') {
+            return spec.canDrag(monitor);
+        } else {
+            return true;
+        }
+    }
+    isDragging(globalMonitor, target) {
+        const spec = this.spec;
+        const monitor = this.monitor;
+        const { isDragging  } = spec;
+        return isDragging ? isDragging(monitor) : target === globalMonitor.getSourceId();
+    }
+    endDrag() {
+        const spec = this.spec;
+        const monitor = this.monitor;
+        const connector = this.connector;
+        const { end  } = spec;
+        if (end) {
+            end(monitor.getItem(), monitor);
+        }
+        connector.reconnect();
+    }
+    constructor(spec, monitor, connector){
+        this.spec = spec;
+        this.monitor = monitor;
+        this.connector = connector;
+    }
+}
+
+function useDragSource(spec, monitor, connector) {
+    const handler = useMemo(()=>new DragSourceImpl(spec, monitor, connector)
+    , [
+        monitor,
+        connector
+    ]);
+    useEffect(()=>{
+        handler.spec = spec;
+    }, [
+        spec
+    ]);
+    return handler;
+}
+
+function useDragType(spec) {
+    return useMemo(()=>{
+        const result = spec.type;
+        invariant(result != null, 'spec.type must be defined');
+        return result;
+    }, [
+        spec
+    ]);
+}
+
+function useRegisteredDragSource(spec, monitor, connector) {
+    const manager = useDragDropManager();
+    const handler = useDragSource(spec, monitor, connector);
+    const itemType = useDragType(spec);
+    useIsomorphicLayoutEffect(function registerDragSource() {
+        if (itemType != null) {
+            const [handlerId, unregister] = registerSource(itemType, handler, manager);
+            monitor.receiveHandlerId(handlerId);
+            connector.receiveHandlerId(handlerId);
+            return unregister;
+        }
+        return;
+    }, [
+        manager,
+        monitor,
+        connector,
+        handler,
+        itemType
+    ]);
+}
+
+/**
+ * useDragSource hook
+ * @param sourceSpec The drag source specification (object or function, function preferred)
+ * @param deps The memoization deps array to use when evaluating spec changes
+ */ function useDrag(specArg, deps) {
+    const spec = useOptionalFactory(specArg);
+    invariant(!spec.begin, `useDrag::spec.begin was deprecated in v14. Replace spec.begin() with spec.item(). (see more here - https://react-dnd.github.io/react-dnd/docs/api/use-drag)`);
+    const monitor = useDragSourceMonitor();
+    const connector = useDragSourceConnector(spec.options, spec.previewOptions);
+    useRegisteredDragSource(spec, monitor, connector);
+    return [
+        useCollectedProps(spec.collect, monitor, connector),
+        useConnectDragSource(connector),
+        useConnectDragPreview(connector), 
+    ];
+}
+
+function useConnectDropTarget(connector) {
+    return useMemo(()=>connector.hooks.dropTarget()
+    , [
+        connector
+    ]);
+}
+
+function useDropTargetConnector(options) {
+    const manager = useDragDropManager();
+    const connector = useMemo(()=>new TargetConnector(manager.getBackend())
+    , [
+        manager
+    ]);
+    useIsomorphicLayoutEffect(()=>{
+        connector.dropTargetOptions = options || null;
+        connector.reconnect();
+        return ()=>connector.disconnectDropTarget()
+        ;
+    }, [
+        options
+    ]);
+    return connector;
+}
+
+function useDropTargetMonitor() {
+    const manager = useDragDropManager();
+    return useMemo(()=>new DropTargetMonitorImpl(manager)
+    , [
+        manager
+    ]);
+}
+
+/**
+ * Internal utility hook to get an array-version of spec.accept.
+ * The main utility here is that we aren't creating a new array on every render if a non-array spec.accept is passed in.
+ * @param spec
+ */ function useAccept(spec) {
+    const { accept  } = spec;
+    return useMemo(()=>{
+        invariant(spec.accept != null, 'accept must be defined');
+        return Array.isArray(accept) ? accept : [
+            accept
+        ];
+    }, [
+        accept
+    ]);
+}
+
+class DropTargetImpl {
+    canDrop() {
+        const spec = this.spec;
+        const monitor = this.monitor;
+        return spec.canDrop ? spec.canDrop(monitor.getItem(), monitor) : true;
+    }
+    hover() {
+        const spec = this.spec;
+        const monitor = this.monitor;
+        if (spec.hover) {
+            spec.hover(monitor.getItem(), monitor);
+        }
+    }
+    drop() {
+        const spec = this.spec;
+        const monitor = this.monitor;
+        if (spec.drop) {
+            return spec.drop(monitor.getItem(), monitor);
+        }
+        return;
+    }
+    constructor(spec, monitor){
+        this.spec = spec;
+        this.monitor = monitor;
+    }
+}
+
+function useDropTarget(spec, monitor) {
+    const dropTarget = useMemo(()=>new DropTargetImpl(spec, monitor)
+    , [
+        monitor
+    ]);
+    useEffect(()=>{
+        dropTarget.spec = spec;
+    }, [
+        spec
+    ]);
+    return dropTarget;
+}
+
+function useRegisteredDropTarget(spec, monitor, connector) {
+    const manager = useDragDropManager();
+    const dropTarget = useDropTarget(spec, monitor);
+    const accept = useAccept(spec);
+    useIsomorphicLayoutEffect(function registerDropTarget() {
+        const [handlerId, unregister] = registerTarget(accept, dropTarget, manager);
+        monitor.receiveHandlerId(handlerId);
+        connector.receiveHandlerId(handlerId);
+        return unregister;
+    }, [
+        manager,
+        monitor,
+        dropTarget,
+        connector,
+        accept.map((a)=>a.toString()
+        ).join('|'), 
+    ]);
+}
+
+/**
+ * useDropTarget Hook
+ * @param spec The drop target specification (object or function, function preferred)
+ * @param deps The memoization deps array to use when evaluating spec changes
+ */ function useDrop(specArg, deps) {
+    const spec = useOptionalFactory(specArg);
+    const monitor = useDropTargetMonitor();
+    const connector = useDropTargetConnector(spec.options);
+    useRegisteredDropTarget(spec, monitor, connector);
+    return [
+        useCollectedProps(spec.collect, monitor, connector),
+        useConnectDropTarget(connector), 
+    ];
+}
+
+var dummyEngine = new Engine();
+var FlowContext = React.createContext({
+    engine: dummyEngine,
+});
+var useEngine = function () {
+    return React.useContext(FlowContext).engine;
+};
+var useControls = function () {
+    return React.useContext(FlowContext).controls || {};
+};
+
+var _a;
+// normalizing import
+var InputNumber = (_a = rcin.default) !== null && _a !== void 0 ? _a : rcin;
+function Control(_a) {
+    var value = _a.value, vardef = _a.vardef, onChange = _a.onChange;
+    var customControls = useControls();
+    if (vardef.type in customControls) {
+        var ControlComponent = customControls[vardef.type];
+        return (React.createElement(ControlComponent, { value: value, vardef: vardef, onChange: onChange }));
+    }
+    if (vardef.options) {
+        return (React.createElement("select", { value: value || "", onChange: function (e) { return onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value); } }, vardef.options.map(function (option) { return (React.createElement("option", { key: option, value: option }, option)); })));
+    }
+    switch (vardef.type) {
+        case "string":
+            return (React.createElement("input", { type: "text", value: value !== null && value !== void 0 ? value : "", onChange: function (e) { return onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value); } }));
+        case "number":
+            return (React.createElement(InputNumber, { value: Number(value) || 0, onChange: onChange, step: vardef.step, min: vardef.min, max: vardef.max, inputMode: "numeric" }));
+        case "boolean":
+            return (React.createElement("input", { type: "checkbox", checked: Boolean(value), onChange: function (e) { return onChange === null || onChange === void 0 ? void 0 : onChange(e.target.checked); } }));
+        default:
+            return (React.createElement("span", null,
+                String(value),
+                " (",
+                vardef.type,
+                ")"));
+    }
+}
+
+var styles$1 = {"Port":"Port_XWl7K","required":"required_ofB6J","Icon":"Icon_YJDC5","Input":"Input_PHp3D","Output":"Output_FMRNv","ConnectionPath":"ConnectionPath_XkXr1","valid":"valid_LGNvc","Edge":"Edge_aNtpH","Hover":"Hover_1v8QT"};
+
+var Input = function (_a) {
+    var _b;
+    var name = _a.name, varDef = _a.varDef, id = _a.id, data = _a.data, onClick = _a.onClick;
+    var normalized = normalizeVarDef(varDef);
+    var value = (_b = data.inputs) === null || _b === void 0 ? void 0 : _b[name];
+    var isRef = isReference(value);
+    var handleInputChange = function (param) { return function (value) {
+        var _a;
+        data.onChange({
+            inputs: __assign(__assign({}, data.inputs), (_a = {}, _a[param] = value, _a)),
+        });
+    }; };
+    return (React.createElement(Handle, { type: "target", position: Position.Left, id: "".concat(id, "-").concat(name), className: classNames(styles$1.Input, styles$1.Port, styles$1["type-".concat(normalized.type)]), style: {
+            "--type-color": "var(--color-".concat(normalized.type, ")"),
+        }, onClick: onClick },
+        normalized.label || name,
+        !isRef && (React.createElement(Control, { vardef: normalized, value: value, onChange: handleInputChange(name) }))));
+};
+
+var Param = function (_a) {
+    var _b;
+    _a.id; var name = _a.name, varDef = _a.varDef, data = _a.data, onClick = _a.onClick;
+    var normalized = normalizeVarDef(varDef);
+    var value = (_b = data.params) === null || _b === void 0 ? void 0 : _b[name];
+    var isRef = isReference(value);
+    var handleParamChange = function (param) { return function (value) {
+        var _a;
+        data.onChange({
+            params: __assign(__assign({}, data.params), (_a = {}, _a[param] = value, _a)),
+        });
+    }; };
+    return (React.createElement("div", { className: classNames(styles$1.Input, styles$1.Port, styles$1["type-".concat(normalized.type)]), style: {
+            "--type-color": "var(--color-".concat(normalized.type, ")"),
+        }, onClick: onClick },
+        React.createElement("span", null, normalized.label || name),
+        !isRef && (React.createElement(Control, { vardef: normalized, value: value, onChange: handleParamChange(name) }))));
+};
+
+var Output = function (_a) {
+    var name = _a.name, varDef = _a.varDef, id = _a.id, onClick = _a.onClick, focus = _a.focus;
+    var normalized = normalizeVarDef(varDef);
+    return (React.createElement(Handle, { type: "source", position: Position.Right, id: "".concat(id, "-").concat(name), className: classNames(styles$1.Output, styles$1.Port, styles$1["type-".concat(normalized.type)]), style: {
+            "--type-color": "var(--color-".concat(normalized.type, ")"),
+        }, onClick: onClick },
+        React.createElement("span", null,
+            focus && "👁 ",
+            normalized.label || name)));
+};
+
+var styles = {"DefaultNode":"DefaultNode_R2P6c","selected":"selected_VmB-F","active":"active_zjUzx","Log":"Log_dsq5e","Label":"Label_wBwWA","Description":"Description_f9s4l","PreviewHead":"PreviewHead_oFT4K","expanded":"expanded_3vnbi","Preview":"Preview_HbkZ6","Duration":"Duration_0jqWx","GroupHead":"GroupHead_QJhST","GroupChildren":"GroupChildren_NKx-B","GroupLeaf":"GroupLeaf_eliT8"};
+
+function NodeContainer(_a) {
+    var _b;
+    var id = _a.id, label = _a.label, className = _a.className, selected = _a.selected, children = _a.children;
+    var engine = useEngine();
+    var _c = __read(React.useState(false), 2), active = _c[0], setActive = _c[1];
+    React.useEffect(function () {
+        if (!id)
+            return;
+        var timer;
+        var removeOnCall = engine.subscribe("functionCall", function (event) {
+            if (event.name === id) {
+                setActive(true);
+            }
+        });
+        var removeOnResult = engine.subscribe("functionResult", function (event) {
+            if (event.name === id) {
+                clearTimeout(timer);
+                timer = setTimeout(function () { return setActive(false); }, Math.max(0, 1000 - (event.duration || 0)));
+            }
+        });
+        return function () {
+            removeOnCall();
+            removeOnResult();
+        };
+    }, [id]);
+    return (React.createElement("div", { className: classNames(className, styles.DefaultNode, (_b = {},
+            _b[styles.selected] = selected,
+            _b[styles.active] = active,
+            _b)) },
+        React.createElement("div", { className: styles.Label }, label),
+        children));
+}
+
+function createTreeStructure(tree) {
+    var keys = Object.keys(tree);
+    var structure = [];
+    keys.forEach(function (key) {
+        var path = key.split(";");
+        var parent = structure;
+        for (var i = 0; i < path.length; i++) {
+            var part = parseInt(path[i], 10);
+            if (!parent[part]) {
+                parent[part] = [];
+            }
+            parent = parent[part];
+        }
+        parent.push({ items: tree[key] });
+    });
+    return structure;
+}
+function TreeBranchView(_a) {
+    var branch = _a.branch, name = _a.name;
+    return (React.createElement("div", null,
+        React.createElement("div", { className: styles.GroupHead },
+            React.createElement("span", null,
+                "group ",
+                name)),
+        React.createElement("div", { className: styles.GroupChildren }, branch.map(function (item, index) {
+            // sub branch
+            if (Array.isArray(item)) {
+                return (React.createElement(TreeBranchView, { key: index, branch: item, name: "".concat(name, ";").concat(index) }));
+            }
+            // items
+            return (React.createElement("div", { key: index }, item.items.map(function (it, i) {
+                var _a;
+                var label = (_a = it === null || it === void 0 ? void 0 : it.toString) === null || _a === void 0 ? void 0 : _a.call(it);
+                if (label === "[object Object]") {
+                    label = "{...}";
+                }
+                return (React.createElement("div", { key: i, className: styles.GroupLeaf, title: JSON.stringify(it, null, 2) }, label));
+            })));
+        }))));
+}
+function TreeView(_a) {
+    var value = _a.value;
+    var structure = createTreeStructure(value || {});
+    return (React.createElement("div", null, structure.map(function (branch, index) { return (React.createElement(TreeBranchView, { key: index, branch: branch, name: index })); })));
+}
+var Log = React.memo(function (_a) {
+    var id = _a.id, data = _a.data, selected = _a.selected;
+    var engine = useEngine();
+    var _b = __read(React.useState(null), 2), value = _b[0], setValue = _b[1];
+    React.useEffect(function () {
+        return engine.subscribe("functionResult", function (event) {
+            var _a;
+            if (event.name === id) {
+                setValue(((_a = event.context.scope[id]) === null || _a === void 0 ? void 0 : _a.data) || null);
+            }
+        });
+    }, []);
+    return (React.createElement(NodeContainer, { id: id, label: data.name, selected: selected, className: styles.Log },
+        React.createElement(TreeView, { value: value }),
+        React.createElement(Handle, { type: "target", position: Position.Left, id: "".concat(id, "-data") }),
+        React.createElement(Handle, { type: "source", position: Position.Right, id: "".concat(id, "-data") })));
+});
+Log.displayName = "LogNode";
+
+function GenericNode(_a) {
+    var _b;
+    var _c;
+    var id = _a.id, data = _a.data, selected = _a.selected, inputs = _a.inputs, outputs = _a.outputs, params = _a.params, children = _a.children;
+    var inputEntries = Object.entries(inputs || data.inputDefs || {});
+    var outputEntries = Object.entries(outputs || data.outputDefs || {});
+    var paramEntries = Object.entries(params || data.paramDefs || {});
+    var engine = useEngine();
+    var _d = __read(React.useState({}), 2), result = _d[0], setResult = _d[1];
+    var _e = __read(React.useState(null), 2), duration = _e[0], setDuration = _e[1];
+    var _f = __read(React.useState(((_c = outputEntries[0]) === null || _c === void 0 ? void 0 : _c[0]) || null), 2), focus = _f[0], setFocus = _f[1];
+    var _g = __read(React.useState(false), 2), showPreview = _g[0], setShowPreview = _g[1];
+    var previewValue = focus ? result[focus] : Object.values(result)[0];
+    React.useEffect(function () {
+        return engine.subscribe("functionResult", function (event) {
+            if (event.name === id) {
+                setResult(event.result || {});
+                setDuration(event.duration || null);
+            }
+        });
+    }, []);
+    return (React.createElement(NodeContainer, { label: data.label, selected: selected, id: id },
+        React.createElement("div", { className: styles.Description }, data.description),
+        children,
+        React.createElement("div", { className: styles.Ports },
+            outputEntries.map(function (_a) {
+                var _b = __read(_a, 2), name = _b[0], varDef = _b[1];
+                return (React.createElement(Output, { key: name, name: name, varDef: varDef, id: id, onClick: function () { return setFocus(name); }, focus: showPreview && focus === name }));
+            }),
+            inputEntries.map(function (_a) {
+                var _b = __read(_a, 2), name = _b[0], varDef = _b[1];
+                return (React.createElement(Input, { key: name, name: name, varDef: varDef, id: id, data: data }));
+            }),
+            paramEntries.map(function (_a) {
+                var _b = __read(_a, 2), name = _b[0], varDef = _b[1];
+                return (React.createElement(Param, { key: name, name: name, varDef: varDef, id: id, data: data }));
+            })),
+        React.createElement("div", { className: classNames(styles.PreviewHead, (_b = {},
+                _b[styles.expanded] = showPreview,
+                _b)), onClick: function () { return setShowPreview(!showPreview); } }, "Preview"),
+        showPreview && (React.createElement("div", { className: styles.Preview },
+            React.createElement(TreeView, { value: previewValue }),
+            duration && (React.createElement("div", { className: styles.Duration },
+                duration.toFixed(2),
+                " ms"))))));
+}
+
+var math = create(all, {});
+function MathView(_a) {
+    var expr = _a.expr, _b = _a.displayMode, displayMode = _b === void 0 ? false : _b;
+    var latex = "";
+    try {
+        latex = math.parse(expr).toTex({ parenthesis: "auto" });
+    }
+    catch (e) {
+        latex = String(expr); // fallback on parse error
+    }
+    var html = katex.renderToString(latex, {
+        throwOnError: false,
+        displayMode: displayMode,
+    });
+    return React.createElement("span", { dangerouslySetInnerHTML: { __html: html } });
+}
+var Calc = React.memo(function (_a) {
+    var _b;
+    var id = _a.id, data = _a.data, selected = _a.selected;
+    var expression = (((_b = data.params) === null || _b === void 0 ? void 0 : _b.expression) || "").toString();
+    // add free variables to inputs
+    var inputs = __assign({}, (data.inputDefs || {}));
+    var symbols = getUnboundSymbols(expression);
+    symbols.forEach(function (symbol) {
+        if (!inputs[symbol]) {
+            inputs[symbol] = {
+                type: "number",
+            };
+        }
+    });
+    return (React.createElement(GenericNode, { id: id, data: data, selected: selected, inputs: inputs },
+        React.createElement(MathView, { expr: expression, displayMode: true })));
+});
+Calc.displayName = "CalcNode";
+
+var Default = React.memo(function (_a) {
+    var id = _a.id, data = _a.data, selected = _a.selected;
+    return React.createElement(GenericNode, { id: id, data: data, selected: selected });
+});
+Default.displayName = "DefaultNode";
+
+function uid() {
+    return Math.random().toString(36).substring(2, 15);
+}
+var Merge = React.memo(function (_a) {
+    var id = _a.id, data = _a.data, selected = _a.selected;
+    var inputs = Object.fromEntries(Object.keys(data.inputs || {}).map(function (name, i) { return [
+        name,
+        { type: "any", label: "D".concat(i + 1) },
+    ]; }));
+    var inputCount = Object.keys(inputs).length;
+    inputs[uid()] = { type: "any", label: "D".concat(inputCount + 1) };
+    var outputs = __assign({}, (data.outputDefs || {}));
+    return (React.createElement(NodeContainer, { label: data.name, selected: selected, id: id },
+        React.createElement("div", { className: styles.Ports },
+            Object.entries(outputs || {}).map(function (_a) {
+                var _b = __read(_a, 2), name = _b[0], varDef = _b[1];
+                return (React.createElement(Output, { key: name, name: name, varDef: varDef, id: id }));
+            }),
+            Object.entries(inputs || {}).map(function (_a) {
+                var _b = __read(_a, 2), name = _b[0], varDef = _b[1];
+                return (React.createElement(Input, { key: name, name: name, varDef: varDef, id: id, data: data }));
+            }))));
+});
+Merge.displayName = "MergeNode";
+
+var nodeTypes = {
+    Default: Default,
+    Calc: Calc,
+    Log: Log,
+    Merge: Merge,
+};
+
+var variableStore = create$1(function (set, get, api) {
+    return persist(function (pset, pget) { return ({
+        data: {},
+        getVar: function (scope, name, persist) {
+            if (persist) {
+                return pget().data["".concat(scope, "|").concat(name)];
+            }
+            else {
+                return get().data["".concat(scope, "|").concat(name)];
+            }
+        },
+        setVar: function (scope, name, value, persist) {
+            var _a, _b;
+            var key = "".concat(scope, "|").concat(name);
+            if (persist) {
+                var oldData = pget().data;
+                var newValue = typeof value === "function"
+                    ? value(oldData[key])
+                    : value;
+                var data = __assign(__assign({}, oldData), (_a = {}, _a[key] = newValue, _a));
+                pset({ data: data });
+            }
+            else {
+                var oldData = get().data;
+                var newValue = typeof value === "function"
+                    ? value(oldData[key])
+                    : value;
+                var data = __assign(__assign({}, oldData), (_b = {}, _b[key] = newValue, _b));
+                set({ data: data });
+            }
+        },
+    }); }, {
+        name: "variable-storage", // unique name
+        // getStorage: () => sessionStorage, // (optional) by default the 'localStorage' is used
+    })(set, get, api);
+});
+/**
+ * scope restricts the variable scope, for example to a view id
+ * @param scope
+ * @param name
+ */
+var useVariable = function (scope, name, initial, persist) {
+    if (persist === void 0) { persist = true; }
+    var value = variableStore(function (_a) {
+        var getVar = _a.getVar;
+        return getVar(scope, name, persist);
+    });
+    if (typeof value === "undefined")
+        value = initial;
+    var setVar = variableStore(function (_a) {
+        var setVar = _a.setVar;
+        return setVar;
+    });
+    var setValue = function (value) { return setVar(scope, name, value, persist); };
+    return [value, setValue];
+};
+
+function usePositions(fn) {
+    return useVariable("rules", "".concat(fn.name, ".positions"), {});
+}
+function useUpdatePositions(fn) {
+    var _a = __read(usePositions(fn), 2), positions = _a[0], setPositions = _a[1];
+    return React.useCallback(function (id, position) {
+        positions[id] = position;
+        setPositions(positions);
+    }, [positions, setPositions]);
+}
+
+// helpers
+function updateNodeArguments(node, inputs, params) {
+    return __assign(__assign({}, node), { data: __assign(__assign({}, node.data), { inputs: inputs, params: params }) });
+}
+/**
+ * flow state stores nodes and edges for the flow graph these can be updated when the function changes
+ * using setFn
+ */
+var useFlowState = create$1(function (set, get) { return ({
+    engine: null,
+    fn: null,
+    options: {},
+    nodes: [],
+    edges: [],
+    setNodes: function (updater) {
+        set(function (state) { return ({ nodes: updater(state.nodes) }); });
+    },
+    setEdges: function (updater) {
+        set(function (state) { return ({ edges: updater(state.edges) }); });
+    },
+    setFn: function (fn) {
+        // console.log("setFn", fn);
+        var _a = get(), oldFn = _a.fn, nodes = _a.nodes, edges = _a.edges, engine = _a.engine, options = _a.options;
+        // update the graph by shallow comparison
+        if (!engine) {
+            throw new Error("Engine not set");
+        }
+        var oldKeys = Object.keys((oldFn === null || oldFn === void 0 ? void 0 : oldFn.body) || {});
+        var newKeys = Object.keys(fn.body || {});
+        // remove all the nodes that were removed
+        nodes = nodes === null || nodes === void 0 ? void 0 : nodes.filter(function (node) { return newKeys.includes(node.id); });
+        // remove all the edges that were removed
+        edges = edges === null || edges === void 0 ? void 0 : edges.filter(function (edge) {
+            return (newKeys.includes(edge.source) && newKeys.includes(edge.target));
+        });
+        // create the new nodes that were added
+        var addedKeys = newKeys.filter(function (key) { return !oldKeys.includes(key); });
+        addedKeys.forEach(function (key, index) {
+            var _a;
+            var fncall = (_a = fn.body) === null || _a === void 0 ? void 0 : _a[key];
+            // add the node
+            nodes.push(createNode(engine, key, fncall, options));
+            // add edges
+            var refs = getReferences(fncall.inputs || {});
+            refs.forEach(function (ref) {
+                edges.push(createEdge(key, ref));
+            });
+        });
+        // update the changed nodes
+        var changedKeys = newKeys.filter(function (key) {
+            var _a, _b;
+            // shallow comparison
+            return ((_a = fn.body) === null || _a === void 0 ? void 0 : _a[key]) !== ((_b = oldFn === null || oldFn === void 0 ? void 0 : oldFn.body) === null || _b === void 0 ? void 0 : _b[key]);
+        });
+        // console.log("changed keys", changedKeys);
+        changedKeys.forEach(function (key) {
+            var _a;
+            //  update the nodes that were changed
+            var fncall = (_a = fn.body) === null || _a === void 0 ? void 0 : _a[key];
+            nodes = nodes === null || nodes === void 0 ? void 0 : nodes.map(function (n) {
+                if (n.id === key) {
+                    return updateNodeArguments(n, fncall.inputs, fncall.params);
+                }
+                return n;
+            });
+            // update incoming edges
+            var refs = getReferences(fncall.inputs || {});
+            // remove all incoming edges
+            edges = edges === null || edges === void 0 ? void 0 : edges.filter(function (e) { return e.target !== key; });
+            // add the edge
+            refs.forEach(function (ref) {
+                edges.push(createEdge(key, ref));
+            });
+        });
+        // console.log("final graph", nodes, edges);
+        // update the function, nodes and edges
+        set({ fn: fn, nodes: nodes, edges: edges });
+    },
+    init: function (fn, engine, options) {
+        // console.log("initing");
+        set({ engine: engine, options: options });
+        get().setFn(fn);
+    },
+}); });
+/**
+ * creates a flow state and provides handlers to update nodes and edges
+ */
+function useFlow(fn, engine, options) {
+    var state = useFlowState();
+    React.useEffect(function () {
+        state.init(fn, engine, options);
+    }, [engine]);
+    React.useEffect(function () {
+        state.setFn(fn);
+    }, [fn]);
+    return React.useMemo(function () { return ({
+        nodes: state.nodes,
+        edges: state.edges,
+        setNodes: state.setNodes,
+        setEdges: state.setEdges,
+    }); }, [state]);
+}
+function createNode(engine, id, fncall, options) {
+    var _a, _b;
+    var calledFn = engine.getFunction(fncall.name);
+    // create a node for each function call
+    return {
+        id: id,
+        data: {
+            name: fncall.name,
+            label: fncall.label || (calledFn === null || calledFn === void 0 ? void 0 : calledFn.label) || fncall.name,
+            description: calledFn === null || calledFn === void 0 ? void 0 : calledFn.description,
+            inputs: fncall.inputs,
+            params: fncall.params,
+            inputDefs: (calledFn === null || calledFn === void 0 ? void 0 : calledFn.inputs) || {},
+            paramDefs: (calledFn === null || calledFn === void 0 ? void 0 : calledFn.params) || {},
+            outputDefs: (calledFn === null || calledFn === void 0 ? void 0 : calledFn.outputs) || {},
+            onChange: ((_a = options.onDataChange) === null || _a === void 0 ? void 0 : _a.call(options, id)) || (function () { }),
+        },
+        position: ((_b = options.positions) === null || _b === void 0 ? void 0 : _b[id]) || { x: 0, y: 0 },
+        dragHandle: options.dragHandle,
+        type: (calledFn === null || calledFn === void 0 ? void 0 : calledFn.nodeType) || "Default",
+    };
+}
+function createEdge(nodeId, ref) {
+    return {
+        id: "".concat(ref.path, "-").concat(nodeId, ".").concat(ref.name),
+        source: ref.refNode,
+        target: nodeId,
+        sourceHandle: "".concat(ref.refNode, "-").concat(ref.refField),
+        targetHandle: "".concat(nodeId, "-").concat(ref.name),
+    };
+}
+
+var ConnectionLine = (function (_a) {
+    var _b;
+    var fromX = _a.fromX, fromY = _a.fromY, toX = _a.toX, toY = _a.toY, fromHandle = _a.fromHandle, fromNode = _a.fromNode, connectionStatus = _a.connectionStatus;
+    var _c = useConnection(), toNode = _c.toNode, toHandle = _c.toHandle;
+    // correcting the start point as we moved the nodes in our custom ports
+    if (fromNode && fromHandle) {
+        fromX = (fromNode === null || fromNode === void 0 ? void 0 : fromNode.position.x) + fromHandle.x;
+        if (fromHandle.position === "right") {
+            fromX += fromHandle.width;
+        }
+    }
+    if (toNode && toHandle) {
+        toX = toHandle.x - toHandle.width / 2; // align to left side of the handle
+        if (toHandle.position === "right") {
+            toX += toHandle.width;
+        }
+    }
+    var d = getSimpleBezierPath({
+        sourceX: fromX,
+        sourceY: fromY,
+        targetX: toX,
+        targetY: toY,
+        sourcePosition: Position.Right,
+        targetPosition: Position.Left,
+    });
+    return (React.createElement("g", { className: classNames(styles$1.ConnectionPath, "react-flow__connection-path", (_b = {}, _b[styles$1.valid] = connectionStatus === "valid", _b)) },
+        React.createElement("path", { d: d[0] })));
+});
+
+function FlowInner(_a) {
+    var fn = _a.function, engine = _a.engine, onChange = _a.onChange, onClick = _a.onClick, onSelect = _a.onSelect;
+    var _b = __read(React.useState(null), 2), instance = _b[0], setInstance = _b[1];
+    var updatePosition = useUpdatePositions(fn);
+    var _c = __read(usePositions(fn), 1), positions = _c[0];
+    var handleDataChange = function (id) { return function (newData) {
+        onChange === null || onChange === void 0 ? void 0 : onChange(function (fn) {
+            // update the function definition
+            // console.log("before fn call update", Object.keys(fn.body));
+            var body = __assign({}, fn.body);
+            var fncall = __assign(__assign({}, (body[id] || {})), newData);
+            body[id] = fncall;
+            // console.log("after fn call update", Object.keys(body));
+            var updatedFn = __assign(__assign({}, fn), { body: body });
+            return updatedFn;
+        });
+    }; };
+    var _d = useFlow(fn, engine, {
+        dragHandle: ".".concat(styles.Label),
+        positions: positions,
+        onDataChange: handleDataChange,
+    }), nodes = _d.nodes, edges = _d.edges, setNodes = _d.setNodes, setEdges = _d.setEdges;
+    // node selection handler
+    var handleSelect = React.useCallback(function (_a) {
+        var nodes = _a.nodes;
+        onSelect === null || onSelect === void 0 ? void 0 : onSelect(nodes.map(function (n) { return n.id; }) || []);
+    }, [onSelect]);
+    useOnSelectionChange({
+        onChange: handleSelect,
+    });
+    // dropping nodes
+    var _e = __read(useDrop({
+        accept: "flow-node",
+        drop: function (item, monitor) {
+            var pos = monitor.getClientOffset();
+            if (instance && pos) {
+                var position_1 = instance.screenToFlowPosition(pos);
+                // console.log("handle drop", position);
+                onChange === null || onChange === void 0 ? void 0 : onChange(function (fn) {
+                    return engine.applyNodeAdd(fn, item.name, function (fnCall, id) {
+                        // console.log("node added", id, position);
+                        updatePosition(id, position_1);
+                    });
+                });
+            }
+        },
+        collect: function (monitor) {
+            return {
+                isOver: monitor.isOver(),
+            };
+        },
+    }), 2); _e[0].isOver; var drop = _e[1];
+    // connecting nodes
+    var onConnect = React.useCallback(function (params) {
+        var _a, _b;
+        var sourceField = (_a = params.sourceHandle) === null || _a === void 0 ? void 0 : _a.split("-")[1];
+        var targetField = (_b = params.targetHandle) === null || _b === void 0 ? void 0 : _b.split("-")[1];
+        if (!sourceField || !targetField) {
+            console.warn("Invalid connection handles", params);
+            return;
+        }
+        onChange === null || onChange === void 0 ? void 0 : onChange(function (fn) {
+            return engine.applyNodeConnect(fn, params.source, params.target, sourceField, targetField);
+        });
+    }, [fn, onChange]);
+    // deleting nodes
+    var onNodesDelete = React.useCallback(function (nodesToDelete) {
+        onChange === null || onChange === void 0 ? void 0 : onChange(function (fn) {
+            return engine.applyNodeDelete(fn, nodesToDelete.map(function (n) { return n.id; }));
+        });
+    }, [onChange, fn]);
+    // deleting edges
+    var onEdgesDelete = React.useCallback(function (edgesToDelete) {
+        onChange === null || onChange === void 0 ? void 0 : onChange(function (fn) {
+            var newFn = fn;
+            edgesToDelete.forEach(function (edge) {
+                var _a, _b;
+                var sourceField = (_a = edge.sourceHandle) === null || _a === void 0 ? void 0 : _a.split("-")[1];
+                var targetField = (_b = edge.targetHandle) === null || _b === void 0 ? void 0 : _b.split("-")[1];
+                if (!sourceField || !targetField) {
+                    console.warn("Invalid connection handles", edge);
+                    return;
+                }
+                newFn = engine.applyEdgeDelete(newFn, edge.source, edge.target, sourceField, targetField);
+            });
+            return newFn;
+        });
+    }, [onChange, fn]);
+    // handle canvas clicks to be able to place nodes
+    var handleClick = function (e) {
+        if (instance) {
+            var position = instance.screenToFlowPosition({
+                x: e.clientX,
+                y: e.clientY,
+            });
+            onClick === null || onClick === void 0 ? void 0 : onClick(e, position);
+        }
+    };
+    var onNodesChange = React.useCallback(function (changes) {
+        return setNodes(function (nodesSnapshot) {
+            return applyNodeChanges(changes, nodesSnapshot);
+        });
+    }, []);
+    var onEdgesChange = React.useCallback(function (changes) {
+        return setEdges(function (edgesSnapshot) {
+            return applyEdgeChanges(changes, edgesSnapshot);
+        });
+    }, []);
+    return (React.createElement(ReactFlow, { ref: drop, nodes: nodes, edges: edges, nodeTypes: nodeTypes, onNodesChange: onNodesChange, onEdgesChange: onEdgesChange, onNodesDelete: onNodesDelete, onEdgesDelete: onEdgesDelete, onNodeDragStop: function (e, n) { return updatePosition(n.id, n.position); }, onConnect: onConnect, onInit: setInstance, onPaneClick: handleClick, fitView: true, 
+        // panOnDrag={false}
+        selectionOnDrag: true, minZoom: 0.1, maxZoom: 4, deleteKeyCode: "Delete", connectionLineComponent: ConnectionLine },
+        React.createElement(Background, { variant: BackgroundVariant.Dots }),
+        React.createElement(Controls, null)));
+}
+function Flow(_a) {
+    var fn = _a.function, engine = _a.engine, _b = _a.onChange, onChange = _b === void 0 ? function () { } : _b, onClick = _a.onClick, onSelect = _a.onSelect, customControls = _a.customControls;
+    return (React.createElement(FlowContext.Provider, { value: { engine: engine, controls: customControls } },
+        React.createElement(ReactFlowProvider, null,
+            React.createElement(FlowInner, { function: fn, engine: engine, onChange: onChange, onClick: onClick, onSelect: onSelect }))));
+}
+
+function useDraggableNode(name, fn) {
+    var _a = __read(useDrag({
+        type: "flow-node",
+        item: { name: name, fn: fn },
+        collect: function (monitor) { return ({
+            isDragging: monitor.isDragging(),
+        }); },
+    }), 2), drag = _a[1];
+    return function (ref) { return drag(ref); };
+}
+
+/**
+ * using functions
+ *
+ * in React context
+ * - use useFunction. This will build the function, mount it if needed and provides a run function.
+ *
+ *
+ * in Vanilla context
+ * - use engine.build(fn) to build the function
+ * - use engine.mount(fn) to mount the function (if it has a mount function)
+ * - use await engine.run(fn, inputs) to run the function and get the result
+ */
+function useFunction(engine, fn, mount) {
+    var _this = this;
+    var _a = __read(React.useState(null), 2), result = _a[0], setResult = _a[1];
+    var builtFn = React.useMemo(function () { return engine.build(fn); }, [fn]);
+    React.useEffect(function () {
+        if (mount) {
+            return engine.mount(builtFn);
+        }
+    }, [builtFn, mount]);
+    var run = React.useCallback(function (inputs) { return __awaiter(_this, void 0, void 0, function () {
+        var result;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, engine.run(builtFn, inputs)];
+                case 1:
+                    result = _a.sent();
+                    setResult(result);
+                    return [2 /*return*/, result];
+            }
+        });
+    }); }, [builtFn]);
+    return React.useMemo(function () { return ({
+        fn: builtFn,
+        run: run,
+        result: result,
+    }); }, [builtFn, run, result]);
+}
+
+export { DISCARD, Engine, Flow, Lib, binaryOnTree, binaryOnTreeBranch, broadCast, expandTree, getBranch, getReferences, getValue$1 as getValue, graftTree, interpolate, isReference, isSingleTon, isTree, mapTree, mapTreeBranch, nAryOnTree, nAryOnTreeBranch, normalizeVarDef, parseReference, primitives, sameShape, simplifyTree, toArray, topSort, treeSize, trimTree, uid$1 as uid, useDraggableNode, useFlow, useFunction, usePositions, useUpdatePositions, useVariable };
+//# sourceMappingURL=index.esm.js.map