@linkdlab/funcnodes_react_flow 0.1.4 → 0.1.5

package/dist/index.js

@@ -100,6 +100,16 @@ eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extr
 
 /***/ }),
 
+/***/ "./src/frontend/utils/select.scss":
+/*!****************************************!*\
+  !*** ./src/frontend/utils/select.scss ***!
+  \****************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/utils/select.scss?");
+
+/***/ }),
+
 /***/ "./src/frontend/utils/table.scss":
 /*!***************************************!*\
   !*** ./src/frontend/utils/table.scss ***!
@@ -110,13 +120,43 @@ eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extr
 
 /***/ }),
 
+/***/ "./src/frontend/datarenderer/data_renderer_overlay.tsx":
+/*!*************************************************************!*\
+  !*** ./src/frontend/datarenderer/data_renderer_overlay.tsx ***!
+  \*************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   DataOverlayRendererForIo: () => (/* binding */ DataOverlayRendererForIo)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../funcnodesreactflow */ \"./src/frontend/funcnodesreactflow/index.tsx\");\n/* harmony import */ var _node_io_io__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node/io/io */ \"./src/frontend/node/io/io.tsx\");\n/* harmony import */ var _rendermappings__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./rendermappings */ \"./src/frontend/datarenderer/rendermappings.tsx\");\n/* harmony import */ var _default_preview_renderer__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./default_preview_renderer */ \"./src/frontend/datarenderer/default_preview_renderer.tsx\");\n\r\n\r\n\r\n\r\n\r\nvar DataOverlayRendererForIo = function (io) {\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var render = fnrf_zst.render_options();\r\n    var typestring = (0,_node_io_io__WEBPACK_IMPORTED_MODULE_2__.pick_best_io_type)(io.type, render.typemap || {})[0];\r\n    if (!typestring)\r\n        return _default_preview_renderer__WEBPACK_IMPORTED_MODULE_4__.DictOutput;\r\n    var _a = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_rendermappings__WEBPACK_IMPORTED_MODULE_3__.RenderMappingContext), DataOverlayRenderer = _a.DataOverlayRenderer, DataPreviewViewRenderer = _a.DataPreviewViewRenderer;\r\n    if (DataOverlayRenderer[typestring])\r\n        return DataOverlayRenderer[typestring];\r\n    if (DataPreviewViewRenderer[typestring])\r\n        return DataPreviewViewRenderer[typestring];\r\n    return _default_preview_renderer__WEBPACK_IMPORTED_MODULE_4__.DictOutput;\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/datarenderer/data_renderer_overlay.tsx?");
+
+/***/ }),
+
+/***/ "./src/frontend/datarenderer/default_preview_renderer.tsx":
+/*!****************************************************************!*\
+  !*** ./src/frontend/datarenderer/default_preview_renderer.tsx ***!
+  \****************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Base64ImageOutput: () => (/* binding */ Base64ImageOutput),\n/* harmony export */   DictOutput: () => (/* binding */ DictOutput),\n/* harmony export */   SingleValueOutput: () => (/* binding */ SingleValueOutput),\n/* harmony export */   TableOutput: () => (/* binding */ TableOutput)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _utils_jsondata__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../utils/jsondata */ \"./src/frontend/utils/jsondata.tsx\");\n/* harmony import */ var _utils_table__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils/table */ \"./src/frontend/utils/table.tsx\");\n/* harmony import */ var _images__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./images */ \"./src/frontend/datarenderer/images.tsx\");\n\r\n\r\n\r\n\r\nvar Base64ImageOutput = function (_a) {\r\n    var io = _a.io;\r\n    var value = io.fullvalue;\r\n    if (value == undefined)\r\n        value = io.value;\r\n    if (value === undefined) {\r\n        value = \"\";\r\n    }\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_images__WEBPACK_IMPORTED_MODULE_3__.Base64ImageRenderer, { value: value });\r\n};\r\nvar SingleValueOutput = function (_a) {\r\n    var io = _a.io;\r\n    var value = io.fullvalue;\r\n    if (value == undefined)\r\n        value = io.value;\r\n    if (value === undefined) {\r\n        value = \"\";\r\n    }\r\n    else {\r\n        value = JSON.stringify(io.value).replace(/\\\\n/g, \"\\n\"); //respect \"\\n\" in strings\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"pre\", null, value)));\r\n};\r\nvar TableOutput = function (_a) {\r\n    var io = _a.io;\r\n    var value = io.fullvalue;\r\n    if (value == undefined)\r\n        value = io.value;\r\n    if (value === undefined) {\r\n        value = [];\r\n    }\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_utils_table__WEBPACK_IMPORTED_MODULE_2__.SortableTable, { tabledata: value });\r\n};\r\nvar DictOutput = function (_a) {\r\n    var io = _a.io;\r\n    var value = io.fullvalue;\r\n    if (value === undefined)\r\n        value = io.value;\r\n    if (value === undefined) {\r\n        value = {};\r\n    }\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_utils_jsondata__WEBPACK_IMPORTED_MODULE_1__[\"default\"], { data: value });\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/datarenderer/default_preview_renderer.tsx?");
+
+/***/ }),
+
 /***/ "./src/frontend/datarenderer/images.tsx":
 /*!**********************************************!*\
   !*** ./src/frontend/datarenderer/images.tsx ***!
   \**********************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Base64ImageRenderer: () => (/* binding */ Base64ImageRenderer)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n\r\nvar Base64ImageRenderer = function (_a) {\r\n    var value = _a.value, renderoptions = _a.renderoptions;\r\n    if (renderoptions === undefined)\r\n        renderoptions = {};\r\n    if (renderoptions.format === undefined)\r\n        renderoptions.format = 'jpeg';\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"img\", { src: 'data:image/' + renderoptions.format + ';base64,' + value, style: {\r\n            maxWidth: '100%',\r\n            maxHeight: '100%'\r\n        } }));\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/datarenderer/images.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Base64ImageRenderer: () => (/* binding */ Base64ImageRenderer)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n\r\nvar Base64ImageRenderer = function (_a) {\r\n    var value = _a.value, renderoptions = _a.renderoptions;\r\n    if (renderoptions === undefined)\r\n        renderoptions = {};\r\n    if (renderoptions.format === undefined)\r\n        renderoptions.format = \"jpeg\";\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"img\", { src: \"data:image/\" + renderoptions.format + \";base64,\" + value, style: {\r\n            maxWidth: \"100%\",\r\n            maxHeight: \"100%\"\r\n        } }));\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/datarenderer/images.tsx?");
+
+/***/ }),
+
+/***/ "./src/frontend/datarenderer/rendermappings.tsx":
+/*!******************************************************!*\
+  !*** ./src/frontend/datarenderer/rendermappings.tsx ***!
+  \******************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   RenderMappingContext: () => (/* binding */ RenderMappingContext),\n/* harmony export */   RenderMappingProvider: () => (/* binding */ RenderMappingProvider)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_io_default_input_renderer__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node/io/default_input_renderer */ \"./src/frontend/node/io/default_input_renderer.tsx\");\n/* harmony import */ var _default_preview_renderer__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./default_preview_renderer */ \"./src/frontend/datarenderer/default_preview_renderer.tsx\");\nvar __assign = (undefined && undefined.__assign) || function () {\r\n    __assign = Object.assign || function(t) {\r\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n            s = arguments[i];\r\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\r\n                t[p] = s[p];\r\n        }\r\n        return t;\r\n    };\r\n    return __assign.apply(this, arguments);\r\n};\r\n\r\n\r\n\r\nvar _Inputrenderer = {\r\n    float: _node_io_default_input_renderer__WEBPACK_IMPORTED_MODULE_1__.FloatInput,\r\n    int: _node_io_default_input_renderer__WEBPACK_IMPORTED_MODULE_1__.IntegerInput,\r\n    bool: _node_io_default_input_renderer__WEBPACK_IMPORTED_MODULE_1__.BooleanInput,\r\n    string: _node_io_default_input_renderer__WEBPACK_IMPORTED_MODULE_1__.StringInput,\r\n    str: _node_io_default_input_renderer__WEBPACK_IMPORTED_MODULE_1__.StringInput,\r\n    color: _node_io_default_input_renderer__WEBPACK_IMPORTED_MODULE_1__.ColorInput,\r\n    select: _node_io_default_input_renderer__WEBPACK_IMPORTED_MODULE_1__.SelectionInput,\r\n    \"enum\": _node_io_default_input_renderer__WEBPACK_IMPORTED_MODULE_1__.SelectionInput\r\n};\r\nvar _HandlePreviewGenerators = {};\r\nvar _DataOverlayViewGenerators = {};\r\nvar _DataPreviewViewRenderer = {\r\n    string: _default_preview_renderer__WEBPACK_IMPORTED_MODULE_2__.SingleValueOutput,\r\n    table: _default_preview_renderer__WEBPACK_IMPORTED_MODULE_2__.TableOutput,\r\n    image: _default_preview_renderer__WEBPACK_IMPORTED_MODULE_2__.Base64ImageOutput,\r\n    dict: _default_preview_renderer__WEBPACK_IMPORTED_MODULE_2__.DictOutput\r\n};\r\nvar _DataViewRenderer = {};\r\nvar _initialRenderMappings = {\r\n    Inputrenderer: _Inputrenderer,\r\n    HandlePreviewRenderer: _HandlePreviewGenerators,\r\n    DataOverlayRenderer: _DataOverlayViewGenerators,\r\n    DataPreviewViewRenderer: _DataPreviewViewRenderer,\r\n    DataViewRenderer: _DataViewRenderer\r\n};\r\nvar renderMappingReducer = function (state, action) {\r\n    var _a, _b, _c, _d, _e;\r\n    var options = action.options || {};\r\n    var overwrite = options.overwrite === undefined ? true : options.overwrite;\r\n    switch (action.type) {\r\n        case \"EXTEND_INPUT_RENDER\":\r\n            if (!overwrite && state.Inputrenderer[action.payload.type]) {\r\n                return state;\r\n            }\r\n            return __assign(__assign({}, state), { Inputrenderer: __assign(__assign({}, state.Inputrenderer), (_a = {}, _a[action.payload.type] = action.payload.component, _a)) });\r\n        case \"EXTEND_HANDLE_PREVIEW_RENDER\":\r\n            if (!overwrite && state.HandlePreviewRenderer[action.payload.type]) {\r\n                return state;\r\n            }\r\n            return __assign(__assign({}, state), { HandlePreviewRenderer: __assign(__assign({}, state.HandlePreviewRenderer), (_b = {}, _b[action.payload.type] = action.payload.component, _b)) });\r\n        case \"EXTEND_DATA_OVERLAY_RENDER\":\r\n            if (!overwrite && state.DataOverlayRenderer[action.payload.type]) {\r\n                return state;\r\n            }\r\n            return __assign(__assign({}, state), { DataOverlayRenderer: __assign(__assign({}, state.DataOverlayRenderer), (_c = {}, _c[action.payload.type] = action.payload.component, _c)) });\r\n        case \"EXTEND_DATA_PREVIEW_RENDER\":\r\n            if (!overwrite && state.DataPreviewViewRenderer[action.payload.type]) {\r\n                return state;\r\n            }\r\n            return __assign(__assign({}, state), { DataPreviewViewRenderer: __assign(__assign({}, state.DataPreviewViewRenderer), (_d = {}, _d[action.payload.type] = action.payload.component, _d)) });\r\n        case \"EXTEND_DATA_VIEW_RENDER\":\r\n            if (!overwrite && state.DataViewRenderer[action.payload.type]) {\r\n                return state;\r\n            }\r\n            return __assign(__assign({}, state), { DataViewRenderer: __assign(__assign({}, state.DataViewRenderer), (_e = {}, _e[action.payload.type] = action.payload.component, _e)) });\r\n        case \"EXTEND_FROM_PLUGIN\":\r\n            var something_new = false;\r\n            var checkpairs = [\r\n                [action.payload.plugin.input_renderers || {}, state.Inputrenderer],\r\n                [\r\n                    action.payload.plugin.handle_preview_renderers || {},\r\n                    state.HandlePreviewRenderer,\r\n                ],\r\n                [\r\n                    action.payload.plugin.data_overlay_renderers || {},\r\n                    state.DataOverlayRenderer,\r\n                ],\r\n                [\r\n                    action.payload.plugin.data_preview_renderers || {},\r\n                    state.DataPreviewViewRenderer,\r\n                ],\r\n                [\r\n                    action.payload.plugin.data_view_renderers || {},\r\n                    state.DataViewRenderer,\r\n                ],\r\n            ];\r\n            for (var _i = 0, checkpairs_1 = checkpairs; _i < checkpairs_1.length; _i++) {\r\n                var _f = checkpairs_1[_i], new_Inputrenderer = _f[0], old_Inputrenderer = _f[1];\r\n                if (Object.keys(new_Inputrenderer).length > 0) {\r\n                    if (overwrite) {\r\n                        something_new = true;\r\n                    }\r\n                    else {\r\n                        for (var key in new_Inputrenderer) {\r\n                            if (!old_Inputrenderer[key]) {\r\n                                something_new = true;\r\n                                break;\r\n                            }\r\n                        }\r\n                    }\r\n                }\r\n                if (something_new)\r\n                    break;\r\n            }\r\n            if (!something_new) {\r\n                return state;\r\n            }\r\n            for (var _g = 0, checkpairs_2 = checkpairs; _g < checkpairs_2.length; _g++) {\r\n                var _h = checkpairs_2[_g], new_Inputrenderer = _h[0], old_Inputrenderer = _h[1];\r\n                for (var key in new_Inputrenderer) {\r\n                    if (overwrite || !old_Inputrenderer[key]) {\r\n                        old_Inputrenderer[key] = new_Inputrenderer[key];\r\n                    }\r\n                }\r\n            }\r\n            var newstate = __assign({}, state);\r\n            return newstate;\r\n        default:\r\n            return state;\r\n    }\r\n};\r\nvar RenderMappingProvider = function (_a) {\r\n    var children = _a.children;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useReducer)(renderMappingReducer, _initialRenderMappings), state = _b[0], dispatch = _b[1];\r\n    var extendInputRenderMapping = function (type, component, options) {\r\n        dispatch({\r\n            type: \"EXTEND_INPUT_RENDER\",\r\n            payload: { type: type, component: component },\r\n            options: options\r\n        });\r\n    };\r\n    var extendHandlePreviewRenderMapping = function (type, component, options) {\r\n        dispatch({\r\n            type: \"EXTEND_HANDLE_PREVIEW_RENDER\",\r\n            payload: { type: type, component: component },\r\n            options: options\r\n        });\r\n    };\r\n    var extendDataOverlayRenderMapping = function (type, component, options) {\r\n        dispatch({\r\n            type: \"EXTEND_DATA_OVERLAY_RENDER\",\r\n            payload: { type: type, component: component },\r\n            options: options\r\n        });\r\n    };\r\n    var extendDataPreviewRenderMapping = function (type, component, options) {\r\n        dispatch({\r\n            type: \"EXTEND_DATA_PREVIEW_RENDER\",\r\n            payload: { type: type, component: component },\r\n            options: options\r\n        });\r\n    };\r\n    var extendDataViewRenderMapping = function (type, component, options) {\r\n        dispatch({\r\n            type: \"EXTEND_DATA_VIEW_RENDER\",\r\n            payload: { type: type, component: component },\r\n            options: options\r\n        });\r\n    };\r\n    var extendFromPlugin = function (plugin, options) {\r\n        dispatch({\r\n            type: \"EXTEND_FROM_PLUGIN\",\r\n            payload: { plugin: plugin },\r\n            options: options\r\n        });\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(RenderMappingContext.Provider, { value: {\r\n            Inputrenderer: state.Inputrenderer,\r\n            HandlePreviewRenderer: state.HandlePreviewRenderer,\r\n            DataOverlayRenderer: state.DataOverlayRenderer,\r\n            DataPreviewViewRenderer: state.DataPreviewViewRenderer,\r\n            DataViewRenderer: state.DataViewRenderer,\r\n            extendInputRenderMapping: extendInputRenderMapping,\r\n            extendHandlePreviewRenderMapping: extendHandlePreviewRenderMapping,\r\n            extendDataOverlayRenderMapping: extendDataOverlayRenderMapping,\r\n            extendDataPreviewRenderMapping: extendDataPreviewRenderMapping,\r\n            extendDataViewRenderMapping: extendDataViewRenderMapping,\r\n            extendFromPlugin: extendFromPlugin\r\n        } }, children));\r\n};\r\nvar RenderMappingContext = (0,react__WEBPACK_IMPORTED_MODULE_0__.createContext)({\r\n    Inputrenderer: _initialRenderMappings.Inputrenderer,\r\n    HandlePreviewRenderer: _initialRenderMappings.HandlePreviewRenderer,\r\n    DataOverlayRenderer: _initialRenderMappings.DataOverlayRenderer,\r\n    DataPreviewViewRenderer: _initialRenderMappings.DataPreviewViewRenderer,\r\n    DataViewRenderer: _initialRenderMappings.DataViewRenderer,\r\n    extendInputRenderMapping: function (_type, _component, _options) { },\r\n    extendHandlePreviewRenderMapping: function (_type, _component, _options) { },\r\n    extendDataOverlayRenderMapping: function (_type, _component, _options) { },\r\n    extendDataPreviewRenderMapping: function (_type, _component, _options) { },\r\n    extendDataViewRenderMapping: function (_type, _component, _options) { },\r\n    extendFromPlugin: function (_plugin, _options) { }\r\n});\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/datarenderer/rendermappings.tsx?");
 
 /***/ }),
 
@@ -146,7 +186,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \***************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   FuncNodesContext: () => (/* binding */ FuncNodesContext),\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _states_fnrfzst__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../states/fnrfzst */ \"./src/states/fnrfzst.ts\");\n/* harmony import */ var _funcnodes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../funcnodes */ \"./src/funcnodes/index.ts\");\n/* harmony import */ var _header__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../header */ \"./src/frontend/header/index.tsx\");\n/* harmony import */ var _lib__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../lib */ \"./src/frontend/lib.tsx\");\n/* harmony import */ var _react_flow_layer__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./react_flow_layer */ \"./src/frontend/funcnodesreactflow/react_flow_layer.tsx\");\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\r\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n    return new (P || (P = Promise))(function (resolve, reject) {\r\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n    });\r\n};\r\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\r\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n    function verb(n) { return function (v) { return step([n, v]); }; }\r\n    function step(op) {\r\n        if (f) throw new TypeError(\"Generator is already executing.\");\r\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\r\n            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;\r\n            if (y = 0, t) op = [op[0] & 2, t.value];\r\n            switch (op[0]) {\r\n                case 0: case 1: t = op; break;\r\n                case 4: _.label++; return { value: op[1], done: false };\r\n                case 5: _.label++; y = op[1]; op = [0]; continue;\r\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n                default:\r\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n                    if (t[2]) _.ops.pop();\r\n                    _.trys.pop(); continue;\r\n            }\r\n            op = body.call(thisArg, _);\r\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n    }\r\n};\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar FuncNodesContext = (0,react__WEBPACK_IMPORTED_MODULE_0__.createContext)((0,_states_fnrfzst__WEBPACK_IMPORTED_MODULE_1__[\"default\"])());\r\nvar InnerFuncnodesReactFlow = function (_a) {\r\n    var fnrf_zst = _a.fnrf_zst;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(\"\"), workermanageruri = _b[0], setWorkermanageruri = _b[1];\r\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(undefined), worker = _c[0], setWorker = _c[1];\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        function fetch_worker_manager() {\r\n            return __awaiter(this, void 0, void 0, function () {\r\n                var response, workerewsuri;\r\n                return __generator(this, function (_a) {\r\n                    switch (_a.label) {\r\n                        case 0: return [4 /*yield*/, fetch(\"/worker_manager\")];\r\n                        case 1:\r\n                            response = _a.sent();\r\n                            return [4 /*yield*/, response.text()];\r\n                        case 2:\r\n                            workerewsuri = _a.sent();\r\n                            setWorkermanageruri(workerewsuri);\r\n                            return [2 /*return*/];\r\n                    }\r\n                });\r\n            });\r\n        }\r\n        fetch_worker_manager();\r\n    }, []);\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        if (workermanageruri) {\r\n            var workermanager = new _funcnodes__WEBPACK_IMPORTED_MODULE_2__.WorkerManager(workermanageruri, fnrf_zst);\r\n            workermanager.on_setWorker = setWorker;\r\n            fnrf_zst.workermanager = workermanager;\r\n        }\r\n    }, [workermanageruri]);\r\n    fnrf_zst.worker = worker;\r\n    // const worker = new WebSocketWorker(\"ws://localhost:9382\", fnrf_zst);\r\n    // fnrf_zst.worker = worker;\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(FuncNodesContext.Provider, { value: fnrf_zst },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"funcnodesreactflowcontainer\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_header__WEBPACK_IMPORTED_MODULE_3__[\"default\"], null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"funcnodesreactflowbody\" },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_lib__WEBPACK_IMPORTED_MODULE_4__[\"default\"], null),\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_react_flow_layer__WEBPACK_IMPORTED_MODULE_5__[\"default\"], null)))));\r\n};\r\nvar FuncnodesReactFlow = function () {\r\n    var fnrf_zst = (0,_states_fnrfzst__WEBPACK_IMPORTED_MODULE_1__[\"default\"])();\r\n    // @ts-ignore\r\n    window.fnrf_zst = fnrf_zst; // For debugging\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(InnerFuncnodesReactFlow, { fnrf_zst: fnrf_zst });\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FuncnodesReactFlow);\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/funcnodesreactflow/index.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   FuncNodesContext: () => (/* binding */ FuncNodesContext),\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _states_fnrfzst__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../states/fnrfzst */ \"./src/states/fnrfzst.ts\");\n/* harmony import */ var _funcnodes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../funcnodes */ \"./src/funcnodes/index.ts\");\n/* harmony import */ var _header__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../header */ \"./src/frontend/header/index.tsx\");\n/* harmony import */ var _lib__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../lib */ \"./src/frontend/lib.tsx\");\n/* harmony import */ var _react_flow_layer__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./react_flow_layer */ \"./src/frontend/funcnodesreactflow/react_flow_layer.tsx\");\n/* harmony import */ var _datarenderer_rendermappings__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../datarenderer/rendermappings */ \"./src/frontend/datarenderer/rendermappings.tsx\");\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\r\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n    return new (P || (P = Promise))(function (resolve, reject) {\r\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n    });\r\n};\r\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\r\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n    function verb(n) { return function (v) { return step([n, v]); }; }\r\n    function step(op) {\r\n        if (f) throw new TypeError(\"Generator is already executing.\");\r\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\r\n            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;\r\n            if (y = 0, t) op = [op[0] & 2, t.value];\r\n            switch (op[0]) {\r\n                case 0: case 1: t = op; break;\r\n                case 4: _.label++; return { value: op[1], done: false };\r\n                case 5: _.label++; y = op[1]; op = [0]; continue;\r\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n                default:\r\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n                    if (t[2]) _.ops.pop();\r\n                    _.trys.pop(); continue;\r\n            }\r\n            op = body.call(thisArg, _);\r\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n    }\r\n};\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar FuncNodesContext = (0,react__WEBPACK_IMPORTED_MODULE_0__.createContext)((0,_states_fnrfzst__WEBPACK_IMPORTED_MODULE_1__[\"default\"])({}));\r\nvar InnerFuncnodesReactFlow = function (_a) {\r\n    var fnrf_zst = _a.fnrf_zst;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(\"\"), workermanageruri = _b[0], setWorkermanageruri = _b[1];\r\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(fnrf_zst.options.default_worker), worker = _c[0], setWorker = _c[1];\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        function fetch_worker_manager() {\r\n            return __awaiter(this, void 0, void 0, function () {\r\n                var response, workerewsuri;\r\n                return __generator(this, function (_a) {\r\n                    switch (_a.label) {\r\n                        case 0: return [4 /*yield*/, fetch(\"/worker_manager\")];\r\n                        case 1:\r\n                            response = _a.sent();\r\n                            return [4 /*yield*/, response.text()];\r\n                        case 2:\r\n                            workerewsuri = _a.sent();\r\n                            setWorkermanageruri(workerewsuri);\r\n                            return [2 /*return*/];\r\n                    }\r\n                });\r\n            });\r\n        }\r\n        if (fnrf_zst.options.useWorkerManager)\r\n            fetch_worker_manager();\r\n    }, []);\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        if (workermanageruri) {\r\n            var workermanager = new _funcnodes__WEBPACK_IMPORTED_MODULE_2__.WorkerManager(workermanageruri, fnrf_zst);\r\n            workermanager.on_setWorker = setWorker;\r\n            fnrf_zst.workermanager = workermanager;\r\n        }\r\n    }, [workermanageruri]);\r\n    fnrf_zst.worker = worker;\r\n    fnrf_zst.auto_progress();\r\n    // const worker = new WebSocketWorker(\"ws://localhost:9382\", fnrf_zst);\r\n    // fnrf_zst.worker = worker;\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_datarenderer_rendermappings__WEBPACK_IMPORTED_MODULE_6__.RenderMappingProvider, null,\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(FuncNodesContext.Provider, { value: fnrf_zst },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"funcnodesreactflowcontainer\" },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_header__WEBPACK_IMPORTED_MODULE_3__[\"default\"], null),\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"funcnodesreactflowbody\" },\r\n                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_lib__WEBPACK_IMPORTED_MODULE_4__[\"default\"], null),\r\n                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_react_flow_layer__WEBPACK_IMPORTED_MODULE_5__[\"default\"], null))))));\r\n};\r\nvar FuncnodesReactFlow = function (_a) {\r\n    var _b = _a.useWorkerManager, useWorkerManager = _b === void 0 ? true : _b, _c = _a.default_worker, default_worker = _c === void 0 ? undefined : _c;\r\n    if (!useWorkerManager && default_worker === undefined) {\r\n        return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, \"Error: If you don't use a worker manager, you must provide a default worker.\"));\r\n    }\r\n    var fnrf_zst = (0,_states_fnrfzst__WEBPACK_IMPORTED_MODULE_1__[\"default\"])({\r\n        useWorkerManager: useWorkerManager,\r\n        default_worker: default_worker\r\n    });\r\n    if (default_worker) {\r\n        default_worker.set_zustand(fnrf_zst);\r\n    }\r\n    // @ts-ignore\r\n    window.fnrf_zst = fnrf_zst; // For debugging\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(InnerFuncnodesReactFlow, { fnrf_zst: fnrf_zst });\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FuncnodesReactFlow);\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/funcnodesreactflow/index.tsx?");
 
 /***/ }),
 
@@ -156,7 +196,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \**************************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! reactflow */ \"reactflow\");\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(reactflow__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! .. */ \"./src/frontend/index.tsx\");\n/* harmony import */ var zustand_react_shallow__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! zustand/react/shallow */ \"zustand/react/shallow\");\n/* harmony import */ var zustand_react_shallow__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(zustand_react_shallow__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _node__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../node */ \"./src/frontend/node/index.tsx\");\n/* harmony import */ var _edge__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../edge */ \"./src/frontend/edge.tsx\");\n/* harmony import */ var reactflow_dist_style_css__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! reactflow/dist/style.css */ \"reactflow/dist/style.css\");\n/* harmony import */ var reactflow_dist_style_css__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(reactflow_dist_style_css__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var _funcnodesreactflow_scss__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./funcnodesreactflow.scss */ \"./src/frontend/funcnodesreactflow/funcnodesreactflow.scss\");\nvar __assign = (undefined && undefined.__assign) || function () {\r\n    __assign = Object.assign || function(t) {\r\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n            s = arguments[i];\r\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\r\n                t[p] = s[p];\r\n        }\r\n        return t;\r\n    };\r\n    return __assign.apply(this, arguments);\r\n};\r\nvar __rest = (undefined && undefined.__rest) || function (s, e) {\r\n    var t = {};\r\n    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n        t[p] = s[p];\r\n    if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\r\n            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\r\n                t[p[i]] = s[p[i]];\r\n        }\r\n    return t;\r\n};\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar selector = function (state) { return ({\r\n    nodes: state.nodes,\r\n    edges: state.edges,\r\n    onNodesChange: state.onNodesChange,\r\n    onEdgesChange: state.onEdgesChange,\r\n    onConnect: state.onConnect\r\n}); };\r\nvar nodeTypes = { \"default\": _node__WEBPACK_IMPORTED_MODULE_4__[\"default\"] };\r\nvar edgeTypes = {\r\n    \"default\": _edge__WEBPACK_IMPORTED_MODULE_5__[\"default\"]\r\n};\r\nvar ReactFlowManager = function () {\r\n    var rfinstance = (0,reactflow__WEBPACK_IMPORTED_MODULE_1__.useReactFlow)();\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    fnrf_zst.rf_instance = rfinstance;\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n};\r\nvar KeyHandler = function () {\r\n    var _a;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    var delPressed = (0,reactflow__WEBPACK_IMPORTED_MODULE_1__.useKeyPress)('Delete');\r\n    var edges = (0,reactflow__WEBPACK_IMPORTED_MODULE_1__.useEdges)();\r\n    var nodes = (0,reactflow__WEBPACK_IMPORTED_MODULE_1__.useNodes)();\r\n    if (delPressed) {\r\n        for (var _i = 0, edges_1 = edges; _i < edges_1.length; _i++) {\r\n            var edge = edges_1[_i];\r\n            if (edge.selected) {\r\n                if (!fnrf_zst.worker)\r\n                    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n                if (!edge.source || !edge.target)\r\n                    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n                if (!edge.sourceHandle || !edge.targetHandle)\r\n                    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n                (_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.remove_edge({\r\n                    src_nid: edge.source,\r\n                    src_ioid: edge.sourceHandle,\r\n                    trg_nid: edge.target,\r\n                    trg_ioid: edge.targetHandle\r\n                });\r\n            }\r\n        }\r\n        for (var _b = 0, nodes_1 = nodes; _b < nodes_1.length; _b++) {\r\n            var node = nodes_1[_b];\r\n            if (node.selected) {\r\n                if (!fnrf_zst.worker)\r\n                    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n                fnrf_zst.worker.remove_node(node.id);\r\n            }\r\n        }\r\n    }\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n};\r\nvar ContextMenu = function (_a) {\r\n    var id = _a.id, top = _a.top, left = _a.left, right = _a.right, bottom = _a.bottom, props = __rest(_a, [\"id\", \"top\", \"left\", \"right\", \"bottom\"]);\r\n    var _b = (0,reactflow__WEBPACK_IMPORTED_MODULE_1__.useReactFlow)(), getNode = _b.getNode, setNodes = _b.setNodes, addNodes = _b.addNodes, setEdges = _b.setEdges;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    var duplicateNode = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () {\r\n        var rfnode = getNode(id);\r\n        if (!rfnode)\r\n            return;\r\n        var position = {\r\n            x: rfnode.position.x + 50,\r\n            y: rfnode.position.y + 50\r\n        };\r\n        addNodes(__assign(__assign({}, rfnode), { id: \"\".concat(rfnode.id, \"-copy\"), position: position }));\r\n    }, [id, getNode, addNodes]);\r\n    var deleteNode = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () {\r\n        fnrf_zst.on_node_action({ type: 'delete', id: id, from_remote: false });\r\n    }, [id, setNodes, setEdges]);\r\n    var nodestore = fnrf_zst.nodespace.get_node(id, false);\r\n    if (!nodestore)\r\n        return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, \" \");\r\n    var node = nodestore();\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", __assign({ style: { top: top, left: left, right: right, bottom: bottom }, className: 'context-menu' }, props),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"p\", { style: { fontWeight: 'bold' } },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"small\", null, node.name)),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { onClick: duplicateNode }, \"duplicate\"),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { onClick: deleteNode }, \"delete\")));\r\n};\r\nvar ReactFlowLayer = function () {\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    var reactflowRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        fnrf_zst.reactflowRef = reactflowRef.current;\r\n    }, [reactflowRef]);\r\n    var _a = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null), menu = _a[0], setMenu = _a[1];\r\n    // const onNodeContextMenu = useCallback(\r\n    //   (event: React.MouseEvent, node: Node) => {\r\n    //     if (!reactflowRef.current) return;\r\n    //     // Prevent native context menu from showing\r\n    //     event.preventDefault();\r\n    //     // Calculate position of the context menu. We want to make sure it\r\n    //     // doesn't get positioned off-screen.\r\n    //     const pane = reactflowRef.current.getBoundingClientRect();\r\n    //     const clientX = event.clientX as number;\r\n    //     const clientY = event.clientY as number;\r\n    //     setMenu({\r\n    //       id: node.id,\r\n    //       top: clientY < pane.height - 200 ? clientY : undefined,\r\n    //       left: clientX < pane.width - 200 ? clientX : undefined,\r\n    //       right: clientX >= pane.width - 200 ? pane.width - clientX : undefined,\r\n    //       bottom:\r\n    //         clientY >= pane.height - 200 ? pane.height - clientY : undefined,\r\n    //     });\r\n    //   },\r\n    //   [setMenu]\r\n    // );\r\n    var onPaneClick = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () { return setMenu(null); }, [setMenu]);\r\n    var _b = fnrf_zst.useReactFlowStore((0,zustand_react_shallow__WEBPACK_IMPORTED_MODULE_3__.useShallow)(selector)), nodes = _b.nodes, edges = _b.edges, onNodesChange = _b.onNodesChange, onEdgesChange = _b.onEdgesChange, onConnect = _b.onConnect;\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'reactflowlayer' },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement((reactflow__WEBPACK_IMPORTED_MODULE_1___default()), { nodes: nodes, edges: edges, onNodesChange: onNodesChange, onEdgesChange: onEdgesChange, onConnect: onConnect, nodeTypes: nodeTypes, edgeTypes: edgeTypes, minZoom: 0.1, maxZoom: 2, fitView: true, ref: reactflowRef, \r\n            //  onNodeContextMenu={onNodeContextMenu}\r\n            onPaneClick: onPaneClick },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(ReactFlowManager, null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(KeyHandler, null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(reactflow__WEBPACK_IMPORTED_MODULE_1__.Background, { color: '#888' // Color of the grid lines\r\n                , gap: 16, size: 1 }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(reactflow__WEBPACK_IMPORTED_MODULE_1__.MiniMap, { nodeStrokeWidth: 3, pannable: true, zoomable: true, zoomStep: 3 }),\r\n            menu && react__WEBPACK_IMPORTED_MODULE_0___default().createElement(ContextMenu, __assign({ onClick: onPaneClick }, menu)))));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReactFlowLayer);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/funcnodesreactflow/react_flow_layer.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! reactflow */ \"reactflow\");\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(reactflow__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! .. */ \"./src/frontend/index.tsx\");\n/* harmony import */ var zustand_react_shallow__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! zustand/react/shallow */ \"zustand/react/shallow\");\n/* harmony import */ var zustand_react_shallow__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(zustand_react_shallow__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _node__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../node */ \"./src/frontend/node/index.tsx\");\n/* harmony import */ var _edge__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../edge */ \"./src/frontend/edge.tsx\");\n/* harmony import */ var reactflow_dist_style_css__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! reactflow/dist/style.css */ \"reactflow/dist/style.css\");\n/* harmony import */ var reactflow_dist_style_css__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(reactflow_dist_style_css__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var _funcnodesreactflow_scss__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./funcnodesreactflow.scss */ \"./src/frontend/funcnodesreactflow/funcnodesreactflow.scss\");\nvar __assign = (undefined && undefined.__assign) || function () {\r\n    __assign = Object.assign || function(t) {\r\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n            s = arguments[i];\r\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\r\n                t[p] = s[p];\r\n        }\r\n        return t;\r\n    };\r\n    return __assign.apply(this, arguments);\r\n};\r\nvar __rest = (undefined && undefined.__rest) || function (s, e) {\r\n    var t = {};\r\n    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n        t[p] = s[p];\r\n    if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\r\n            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\r\n                t[p[i]] = s[p[i]];\r\n        }\r\n    return t;\r\n};\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n// import { useForceGraph } from \"../../utils/autolayout\";\r\nvar selector = function (state) { return ({\r\n    nodes: state.nodes,\r\n    edges: state.edges,\r\n    onNodesChange: state.onNodesChange,\r\n    onEdgesChange: state.onEdgesChange,\r\n    onConnect: state.onConnect\r\n}); };\r\nvar nodeTypes = { \"default\": _node__WEBPACK_IMPORTED_MODULE_4__[\"default\"] };\r\nvar edgeTypes = {\r\n    \"default\": _edge__WEBPACK_IMPORTED_MODULE_5__[\"default\"]\r\n};\r\nvar ReactFlowManager = function () {\r\n    var rfinstance = (0,reactflow__WEBPACK_IMPORTED_MODULE_1__.useReactFlow)();\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    fnrf_zst.rf_instance = rfinstance;\r\n    // useForceGraph();\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n};\r\nvar KeyHandler = function () {\r\n    var _a;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    var delPressed = (0,reactflow__WEBPACK_IMPORTED_MODULE_1__.useKeyPress)(\"Delete\");\r\n    var edges = (0,reactflow__WEBPACK_IMPORTED_MODULE_1__.useEdges)();\r\n    var nodes = (0,reactflow__WEBPACK_IMPORTED_MODULE_1__.useNodes)();\r\n    if (delPressed) {\r\n        for (var _i = 0, edges_1 = edges; _i < edges_1.length; _i++) {\r\n            var edge = edges_1[_i];\r\n            if (edge.selected) {\r\n                if (!fnrf_zst.worker)\r\n                    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n                if (!edge.source || !edge.target)\r\n                    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n                if (!edge.sourceHandle || !edge.targetHandle)\r\n                    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n                (_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.remove_edge({\r\n                    src_nid: edge.source,\r\n                    src_ioid: edge.sourceHandle,\r\n                    trg_nid: edge.target,\r\n                    trg_ioid: edge.targetHandle\r\n                });\r\n            }\r\n        }\r\n        for (var _b = 0, nodes_1 = nodes; _b < nodes_1.length; _b++) {\r\n            var node = nodes_1[_b];\r\n            if (node.selected) {\r\n                if (!fnrf_zst.worker)\r\n                    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n                fnrf_zst.worker.remove_node(node.id);\r\n            }\r\n        }\r\n    }\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n};\r\nvar ContextMenu = function (_a) {\r\n    var id = _a.id, top = _a.top, left = _a.left, right = _a.right, bottom = _a.bottom, props = __rest(_a, [\"id\", \"top\", \"left\", \"right\", \"bottom\"]);\r\n    var _b = (0,reactflow__WEBPACK_IMPORTED_MODULE_1__.useReactFlow)(), getNode = _b.getNode, setNodes = _b.setNodes, addNodes = _b.addNodes, setEdges = _b.setEdges;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    var duplicateNode = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () {\r\n        var rfnode = getNode(id);\r\n        if (!rfnode)\r\n            return;\r\n        var position = {\r\n            x: rfnode.position.x + 50,\r\n            y: rfnode.position.y + 50\r\n        };\r\n        addNodes(__assign(__assign({}, rfnode), { id: \"\".concat(rfnode.id, \"-copy\"), position: position }));\r\n    }, [id, getNode, addNodes]);\r\n    var deleteNode = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () {\r\n        fnrf_zst.on_node_action({ type: \"delete\", id: id, from_remote: false });\r\n    }, [id, setNodes, setEdges]);\r\n    var nodestore = fnrf_zst.nodespace.get_node(id, false);\r\n    if (!nodestore)\r\n        return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, \" \");\r\n    var node = nodestore();\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", __assign({ style: { top: top, left: left, right: right, bottom: bottom }, className: \"context-menu\" }, props),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"p\", { style: { fontWeight: \"bold\" } },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"small\", null, node.name)),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { onClick: duplicateNode }, \"duplicate\"),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { onClick: deleteNode }, \"delete\")));\r\n};\r\nvar ReactFlowLayer = function () {\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    var reactflowRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        fnrf_zst.reactflowRef = reactflowRef.current;\r\n    }, [reactflowRef]);\r\n    var _a = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null), menu = _a[0], setMenu = _a[1];\r\n    // const onNodeContextMenu = useCallback(\r\n    //   (event: React.MouseEvent, node: Node) => {\r\n    //     if (!reactflowRef.current) return;\r\n    //     // Prevent native context menu from showing\r\n    //     event.preventDefault();\r\n    //     // Calculate position of the context menu. We want to make sure it\r\n    //     // doesn't get positioned off-screen.\r\n    //     const pane = reactflowRef.current.getBoundingClientRect();\r\n    //     const clientX = event.clientX as number;\r\n    //     const clientY = event.clientY as number;\r\n    //     setMenu({\r\n    //       id: node.id,\r\n    //       top: clientY < pane.height - 200 ? clientY : undefined,\r\n    //       left: clientX < pane.width - 200 ? clientX : undefined,\r\n    //       right: clientX >= pane.width - 200 ? pane.width - clientX : undefined,\r\n    //       bottom:\r\n    //         clientY >= pane.height - 200 ? pane.height - clientY : undefined,\r\n    //     });\r\n    //   },\r\n    //   [setMenu]\r\n    // );\r\n    var onPaneClick = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () { return setMenu(null); }, [setMenu]);\r\n    var _b = fnrf_zst.useReactFlowStore((0,zustand_react_shallow__WEBPACK_IMPORTED_MODULE_3__.useShallow)(selector)), nodes = _b.nodes, edges = _b.edges, onNodesChange = _b.onNodesChange, onEdgesChange = _b.onEdgesChange, onConnect = _b.onConnect;\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"reactflowlayer\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement((reactflow__WEBPACK_IMPORTED_MODULE_1___default()), { nodes: nodes, edges: edges, onNodesChange: onNodesChange, onEdgesChange: onEdgesChange, onConnect: onConnect, nodeTypes: nodeTypes, edgeTypes: edgeTypes, minZoom: 0.1, maxZoom: 2, fitView: true, ref: reactflowRef, \r\n            //  onNodeContextMenu={onNodeContextMenu}\r\n            onPaneClick: onPaneClick },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(ReactFlowManager, null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(KeyHandler, null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(reactflow__WEBPACK_IMPORTED_MODULE_1__.Background, { color: \"#888\" // Color of the grid lines\r\n                , gap: 16, size: 1 }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(reactflow__WEBPACK_IMPORTED_MODULE_1__.MiniMap, { nodeStrokeWidth: 3, pannable: true, zoomable: true, zoomStep: 3 }),\r\n            menu && react__WEBPACK_IMPORTED_MODULE_0___default().createElement(ContextMenu, __assign({ onClick: onPaneClick }, menu)))));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReactFlowLayer);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/funcnodesreactflow/react_flow_layer.tsx?");
 
 /***/ }),
 
@@ -166,7 +206,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \***************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../funcnodesreactflow */ \"./src/frontend/funcnodesreactflow/index.tsx\");\n/* harmony import */ var _header_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./header.scss */ \"./src/frontend/header/header.scss\");\n/* harmony import */ var _dialog__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../dialog */ \"./src/frontend/dialog.tsx\");\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\r\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n    return new (P || (P = Promise))(function (resolve, reject) {\r\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n    });\r\n};\r\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\r\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n    function verb(n) { return function (v) { return step([n, v]); }; }\r\n    function step(op) {\r\n        if (f) throw new TypeError(\"Generator is already executing.\");\r\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\r\n            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;\r\n            if (y = 0, t) op = [op[0] & 2, t.value];\r\n            switch (op[0]) {\r\n                case 0: case 1: t = op; break;\r\n                case 4: _.label++; return { value: op[1], done: false };\r\n                case 5: _.label++; y = op[1]; op = [0]; continue;\r\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n                default:\r\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n                    if (t[2]) _.ops.pop();\r\n                    _.trys.pop(); continue;\r\n            }\r\n            op = body.call(thisArg, _);\r\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n    }\r\n};\r\n\r\n\r\n\r\n\r\n\r\nvar NewWorkerDialog = function (_a) {\r\n    var trigger = _a.trigger;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(\"\"), name = _b[0], setName = _b[1];\r\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false), copyLib = _c[0], setCopyLib = _c[1];\r\n    var _d = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false), copyNS = _d[0], setCopyNS = _d[1];\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var workersstate = fnrf_zst.workers();\r\n    var _e = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({\r\n        name: \"None\",\r\n        uuid: \"\"\r\n    }), reference = _e[0], setReference = _e[1];\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dialog__WEBPACK_IMPORTED_MODULE_3__[\"default\"], { trigger: trigger, title: \"New Worker\", description: \"Please provide a name and select a another worker as interpreter reference\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n            \"Name:\",\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"br\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { className: \"styledinput\", onChange: function (e) {\r\n                    setName(e.currentTarget.value);\r\n                }, value: name })),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n            \"Reference Worker:\",\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"br\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"select\", { className: \"styleddropdown\", onChange: function (e) {\r\n                    var uuid = e.target.value;\r\n                    var name = e.target.selectedOptions[0].innerText;\r\n                    setReference({ name: name, uuid: uuid });\r\n                }, value: reference.uuid },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"option\", { value: \"\" }, \"None\"),\r\n                Object.keys(workersstate).map(function (workerid) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"option\", { className: \"\", key: workerid, value: workerid }, workersstate[workerid].name || workerid)); })),\r\n            reference.uuid && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n                    \"Copy Lib:\",\r\n                    \" \",\r\n                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"checkbox\", className: \"styledcheckbox\", checked: copyLib, onChange: function (e) {\r\n                            setCopyLib(e.currentTarget.checked);\r\n                        } })),\r\n                copyLib && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n                    \"Copy Nodespace\",\r\n                    \" \",\r\n                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"checkbox\", className: \"styledcheckbox\", checked: copyNS, onChange: function (e) {\r\n                            setCopyNS(e.currentTarget.checked);\r\n                            if (e.currentTarget.checked) {\r\n                                setCopyLib(true);\r\n                            }\r\n                        } }))))),\r\n            name && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\", onClick: function () {\r\n                        var _a;\r\n                        (_a = fnrf_zst.workermanager) === null || _a === void 0 ? void 0 : _a.new_worker({\r\n                            name: name,\r\n                            reference: reference.uuid,\r\n                            copyLib: copyLib,\r\n                            copyNS: copyNS\r\n                        });\r\n                    } }, \"Create\"))))));\r\n};\r\nvar Statusbar = function () {\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var progress = fnrf_zst.progress_state();\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"statusbar\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"span\", { className: \"statusbar-progressbar\", style: { width: Math.min(100, 100 * progress.progress) + \"%\" } }),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"span\", { className: \"statusbar-message\" }, progress.message)));\r\n};\r\nvar FuncnodesHeader = function () {\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var workersstate = fnrf_zst.workers();\r\n    var onNew = function () {\r\n        var _a;\r\n        var alert = window.confirm(\"Are you sure you want to start a new flow?\");\r\n        if (alert) {\r\n            (_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.clear();\r\n        }\r\n    };\r\n    var onSave = function () { return __awaiter(void 0, void 0, void 0, function () {\r\n        var data, blob, url, a;\r\n        var _a;\r\n        return __generator(this, function (_b) {\r\n            switch (_b.label) {\r\n                case 0: return [4 /*yield*/, ((_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.save())];\r\n                case 1:\r\n                    data = _b.sent();\r\n                    if (!data)\r\n                        return [2 /*return*/];\r\n                    blob = new Blob([JSON.stringify(data)], {\r\n                        type: \"application/json\"\r\n                    });\r\n                    url = URL.createObjectURL(blob);\r\n                    a = document.createElement(\"a\");\r\n                    a.href = url;\r\n                    a.download = \"flow.json\";\r\n                    a.click();\r\n                    URL.revokeObjectURL(url);\r\n                    a.remove();\r\n                    return [2 /*return*/];\r\n            }\r\n        });\r\n    }); };\r\n    var onOpen = function () { return __awaiter(void 0, void 0, void 0, function () {\r\n        var input;\r\n        return __generator(this, function (_a) {\r\n            input = document.createElement(\"input\");\r\n            input.type = \"file\";\r\n            input.accept = \".json\";\r\n            input.onchange = function (e) { return __awaiter(void 0, void 0, void 0, function () {\r\n                var file, reader;\r\n                var _a;\r\n                return __generator(this, function (_b) {\r\n                    file = (_a = e.target.files) === null || _a === void 0 ? void 0 : _a[0];\r\n                    if (!file)\r\n                        return [2 /*return*/];\r\n                    reader = new FileReader();\r\n                    reader.onload = function (e) { return __awaiter(void 0, void 0, void 0, function () {\r\n                        var contents, data;\r\n                        var _a, _b;\r\n                        return __generator(this, function (_c) {\r\n                            switch (_c.label) {\r\n                                case 0:\r\n                                    contents = (_a = e.target) === null || _a === void 0 ? void 0 : _a.result;\r\n                                    if (!contents)\r\n                                        return [2 /*return*/];\r\n                                    data = JSON.parse(contents);\r\n                                    return [4 /*yield*/, ((_b = fnrf_zst.worker) === null || _b === void 0 ? void 0 : _b.load(data))];\r\n                                case 1:\r\n                                    _c.sent();\r\n                                    return [2 /*return*/];\r\n                            }\r\n                        });\r\n                    }); };\r\n                    reader.readAsText(file);\r\n                    return [2 /*return*/];\r\n                });\r\n            }); };\r\n            input.click();\r\n            return [2 /*return*/];\r\n        });\r\n    }); };\r\n    var workerselectchange = function (e) {\r\n        var workerid = e.target.value;\r\n        if (workerid === \"__select__\")\r\n            return;\r\n        if (!fnrf_zst.workers)\r\n            return;\r\n        if (!fnrf_zst.workermanager)\r\n            return;\r\n        if (!workersstate[workerid])\r\n            return;\r\n        if (!workersstate[workerid].active) {\r\n            //create popup\r\n            var ans = window.confirm(\"this is an inactive worker, selecting it will start it, continue?\");\r\n            if (!ans)\r\n                return;\r\n        }\r\n        fnrf_zst.workermanager.set_active(workerid);\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"funcnodesreactflowheader\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Statusbar, null)),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"select\", { className: \"workerselect styleddropdown\", value: fnrf_zst.worker ? fnrf_zst.worker.uuid : \"__select__\", onChange: workerselectchange },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"option\", { disabled: true, value: \"__select__\" }, \"Select Worker\"),\r\n                Object.keys(workersstate).map(function (workerid) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"option\", { className: \"workerselectoption\" +\r\n                        (workersstate[workerid].active ? \" active\" : \" inactive\"), key: workerid, value: workerid }, workersstate[workerid].name || workerid)); }))),\r\n        fnrf_zst.worker && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null,\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\", onClick: function () {\r\n                        if (!fnrf_zst.worker)\r\n                            return;\r\n                        fnrf_zst.worker.stop();\r\n                    } }, \"stop worker\")),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\", onClick: function () {\r\n                        var _a;\r\n                        if (!fnrf_zst.worker)\r\n                            return;\r\n                        (_a = fnrf_zst.workermanager) === null || _a === void 0 ? void 0 : _a.restart_worker(fnrf_zst.worker.uuid);\r\n                    } }, \"restart worker\")))),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NewWorkerDialog, { trigger: react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\" }, \"new worker\") })),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\", onClick: onNew }, \"new nodespace\")),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\", onClick: onOpen }, \"open\")),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\", onClick: onSave }, \"save\"))));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FuncnodesHeader);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/header/index.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../funcnodesreactflow */ \"./src/frontend/funcnodesreactflow/index.tsx\");\n/* harmony import */ var _header_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./header.scss */ \"./src/frontend/header/header.scss\");\n/* harmony import */ var _dialog__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../dialog */ \"./src/frontend/dialog.tsx\");\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\r\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n    return new (P || (P = Promise))(function (resolve, reject) {\r\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n    });\r\n};\r\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\r\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n    function verb(n) { return function (v) { return step([n, v]); }; }\r\n    function step(op) {\r\n        if (f) throw new TypeError(\"Generator is already executing.\");\r\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\r\n            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;\r\n            if (y = 0, t) op = [op[0] & 2, t.value];\r\n            switch (op[0]) {\r\n                case 0: case 1: t = op; break;\r\n                case 4: _.label++; return { value: op[1], done: false };\r\n                case 5: _.label++; y = op[1]; op = [0]; continue;\r\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n                default:\r\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n                    if (t[2]) _.ops.pop();\r\n                    _.trys.pop(); continue;\r\n            }\r\n            op = body.call(thisArg, _);\r\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n    }\r\n};\r\n\r\n\r\n\r\n\r\n\r\nvar NewWorkerDialog = function (_a) {\r\n    var trigger = _a.trigger;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(\"\"), name = _b[0], setName = _b[1];\r\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false), copyLib = _c[0], setCopyLib = _c[1];\r\n    var _d = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false), copyNS = _d[0], setCopyNS = _d[1];\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var workersstate = fnrf_zst.workers();\r\n    var _e = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({\r\n        name: \"None\",\r\n        uuid: \"\"\r\n    }), reference = _e[0], setReference = _e[1];\r\n    if (!fnrf_zst.options.useWorkerManager)\r\n        return null;\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dialog__WEBPACK_IMPORTED_MODULE_3__[\"default\"], { trigger: trigger, title: \"New Worker\", description: \"Please provide a name and select a another worker as interpreter reference\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n            \"Name:\",\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"br\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { className: \"styledinput\", onChange: function (e) {\r\n                    setName(e.currentTarget.value);\r\n                }, value: name })),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n            \"Reference Worker:\",\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"br\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"select\", { className: \"styleddropdown\", onChange: function (e) {\r\n                    var uuid = e.target.value;\r\n                    var name = e.target.selectedOptions[0].innerText;\r\n                    setReference({ name: name, uuid: uuid });\r\n                }, value: reference.uuid },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"option\", { value: \"\" }, \"None\"),\r\n                Object.keys(workersstate).map(function (workerid) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"option\", { className: \"\", key: workerid, value: workerid }, workersstate[workerid].name || workerid)); })),\r\n            reference.uuid && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n                    \"Copy Lib:\",\r\n                    \" \",\r\n                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"checkbox\", className: \"styledcheckbox\", checked: copyLib, onChange: function (e) {\r\n                            setCopyLib(e.currentTarget.checked);\r\n                        } })),\r\n                copyLib && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n                    \"Copy Nodespace\",\r\n                    \" \",\r\n                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"checkbox\", className: \"styledcheckbox\", checked: copyNS, onChange: function (e) {\r\n                            setCopyNS(e.currentTarget.checked);\r\n                            if (e.currentTarget.checked) {\r\n                                setCopyLib(true);\r\n                            }\r\n                        } }))))),\r\n            name && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\", onClick: function () {\r\n                        var _a;\r\n                        (_a = fnrf_zst.workermanager) === null || _a === void 0 ? void 0 : _a.new_worker({\r\n                            name: name,\r\n                            reference: reference.uuid,\r\n                            copyLib: copyLib,\r\n                            copyNS: copyNS\r\n                        });\r\n                    } }, \"Create\"))))));\r\n};\r\nvar Statusbar = function () {\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var progress = fnrf_zst.progress_state();\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"statusbar\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"span\", { className: \"statusbar-progressbar\", style: { width: Math.min(100, 100 * progress.progress) + \"%\" } }),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"span\", { className: \"statusbar-message\" }, progress.message)));\r\n};\r\nvar FuncnodesHeader = function () {\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var workersstate = fnrf_zst.workers();\r\n    var onNew = function () {\r\n        var _a;\r\n        var alert = window.confirm(\"Are you sure you want to start a new flow?\");\r\n        if (alert) {\r\n            (_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.clear();\r\n        }\r\n    };\r\n    var onSave = function () { return __awaiter(void 0, void 0, void 0, function () {\r\n        var data, blob, url, a;\r\n        var _a;\r\n        return __generator(this, function (_b) {\r\n            switch (_b.label) {\r\n                case 0: return [4 /*yield*/, ((_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.save())];\r\n                case 1:\r\n                    data = _b.sent();\r\n                    if (!data)\r\n                        return [2 /*return*/];\r\n                    blob = new Blob([JSON.stringify(data)], {\r\n                        type: \"application/json\"\r\n                    });\r\n                    url = URL.createObjectURL(blob);\r\n                    a = document.createElement(\"a\");\r\n                    a.href = url;\r\n                    a.download = \"flow.json\";\r\n                    a.click();\r\n                    URL.revokeObjectURL(url);\r\n                    a.remove();\r\n                    return [2 /*return*/];\r\n            }\r\n        });\r\n    }); };\r\n    var onOpen = function () { return __awaiter(void 0, void 0, void 0, function () {\r\n        var input;\r\n        return __generator(this, function (_a) {\r\n            input = document.createElement(\"input\");\r\n            input.type = \"file\";\r\n            input.accept = \".json\";\r\n            input.onchange = function (e) { return __awaiter(void 0, void 0, void 0, function () {\r\n                var file, reader;\r\n                var _a;\r\n                return __generator(this, function (_b) {\r\n                    file = (_a = e.target.files) === null || _a === void 0 ? void 0 : _a[0];\r\n                    if (!file)\r\n                        return [2 /*return*/];\r\n                    reader = new FileReader();\r\n                    reader.onload = function (e) { return __awaiter(void 0, void 0, void 0, function () {\r\n                        var contents, data;\r\n                        var _a, _b;\r\n                        return __generator(this, function (_c) {\r\n                            switch (_c.label) {\r\n                                case 0:\r\n                                    contents = (_a = e.target) === null || _a === void 0 ? void 0 : _a.result;\r\n                                    if (!contents)\r\n                                        return [2 /*return*/];\r\n                                    data = JSON.parse(contents);\r\n                                    return [4 /*yield*/, ((_b = fnrf_zst.worker) === null || _b === void 0 ? void 0 : _b.load(data))];\r\n                                case 1:\r\n                                    _c.sent();\r\n                                    return [2 /*return*/];\r\n                            }\r\n                        });\r\n                    }); };\r\n                    reader.readAsText(file);\r\n                    return [2 /*return*/];\r\n                });\r\n            }); };\r\n            input.click();\r\n            return [2 /*return*/];\r\n        });\r\n    }); };\r\n    var workerselectchange = function (e) {\r\n        var workerid = e.target.value;\r\n        if (workerid === \"__select__\")\r\n            return;\r\n        if (!fnrf_zst.workers)\r\n            return;\r\n        if (!fnrf_zst.workermanager)\r\n            return;\r\n        if (!workersstate[workerid])\r\n            return;\r\n        if (!workersstate[workerid].active) {\r\n            //create popup\r\n            var ans = window.confirm(\"this is an inactive worker, selecting it will start it, continue?\");\r\n            if (!ans)\r\n                return;\r\n        }\r\n        fnrf_zst.workermanager.set_active(workerid);\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"funcnodesreactflowheader\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Statusbar, null)),\r\n        fnrf_zst.options.useWorkerManager && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"select\", { className: \"workerselect styleddropdown\", value: fnrf_zst.worker ? fnrf_zst.worker.uuid : \"__select__\", onChange: workerselectchange },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"option\", { disabled: true, value: \"__select__\" }, \"Select Worker\"),\r\n                Object.keys(workersstate).map(function (workerid) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"option\", { className: \"workerselectoption\" +\r\n                        (workersstate[workerid].active ? \" active\" : \" inactive\"), key: workerid, value: workerid }, workersstate[workerid].name || workerid)); })))),\r\n        fnrf_zst.worker && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null,\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\", onClick: function () {\r\n                        if (!fnrf_zst.worker)\r\n                            return;\r\n                        fnrf_zst.worker.stop();\r\n                    } }, \"stop worker\")),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\", onClick: function () {\r\n                        var _a;\r\n                        if (!fnrf_zst.worker)\r\n                            return;\r\n                        if (!fnrf_zst.workermanager)\r\n                            return console.error(\"no wm\");\r\n                        (_a = fnrf_zst.workermanager) === null || _a === void 0 ? void 0 : _a.restart_worker(fnrf_zst.worker.uuid);\r\n                    } }, \"restart worker\")))),\r\n        fnrf_zst.options.useWorkerManager && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NewWorkerDialog, { trigger: react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\" }, \"new worker\") }))),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\", onClick: onNew }, \"new nodespace\")),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\", onClick: onOpen }, \"open\")),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"headerelement\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { className: \"styledbtn\", onClick: onSave }, \"save\"))));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FuncnodesHeader);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/header/index.tsx?");
 
 /***/ }),
 
@@ -186,7 +226,17 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \******************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   LibraryItem: () => (/* binding */ LibraryShelf),\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _lib_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./lib.scss */ \"./src/frontend/lib.scss\");\n/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./index */ \"./src/frontend/index.tsx\");\n/* harmony import */ var _mui_icons_material_Search__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @mui/icons-material/Search */ \"@mui/icons-material/Search\");\n/* harmony import */ var _mui_icons_material_Search__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_Search__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _mui_icons_material_Close__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @mui/icons-material/Close */ \"@mui/icons-material/Close\");\n/* harmony import */ var _mui_icons_material_Close__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_Close__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @mui/icons-material/ExpandLess */ \"@mui/icons-material/ExpandLess\");\n/* harmony import */ var _mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var _dialog__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./dialog */ \"./src/frontend/dialog.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar LibraryNode = function (_a) {\r\n    var item = _a.item;\r\n    var zustand = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_index__WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    var add_to_flow = function () {\r\n        var _a;\r\n        (_a = zustand.worker) === null || _a === void 0 ? void 0 : _a.add_node(item.node_id);\r\n    };\r\n    var nodeclick = function (event) {\r\n        // if double click, add node to graph\r\n        if (event.detail === 2) {\r\n            add_to_flow();\r\n        }\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'libnodeentry', onClick: nodeclick, title: item.description }, item.node_name || item.node_id));\r\n};\r\nvar filterShelf = function (shelf, filter) {\r\n    var _a, _b, _c, _d;\r\n    var hasFilteredNodes = (_b = (_a = shelf.nodes) === null || _a === void 0 ? void 0 : _a.some(function (node) {\r\n        return node.node_id.toLowerCase().includes(filter.toLowerCase());\r\n    })) !== null && _b !== void 0 ? _b : false;\r\n    var hasFilteredSubShelves = (_d = (_c = shelf.subshelves) === null || _c === void 0 ? void 0 : _c.some(function (subShelf) { return filterShelf(subShelf, filter); })) !== null && _d !== void 0 ? _d : false;\r\n    return hasFilteredNodes || hasFilteredSubShelves;\r\n};\r\nvar LibraryShelf = function (_a) {\r\n    var _b;\r\n    var item = _a.item, filter = _a.filter;\r\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false), isOpen = _c[0], setIsOpen = _c[1];\r\n    var handleToggle = function () { return setIsOpen(!isOpen); };\r\n    var filterednodes = (_b = item.nodes) === null || _b === void 0 ? void 0 : _b.filter(function (node) {\r\n        return node.node_id.toLowerCase().includes(filter.toLowerCase());\r\n    });\r\n    var _isopen = isOpen || filter.length > 0;\r\n    if (!filterShelf(item, filter)) {\r\n        return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'shelfcontainer' },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'shelftitle', onClick: handleToggle, style: { cursor: 'pointer' }, title: item.description },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'shelftitle_text' }, item.name),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'expandicon ' + (_isopen ? 'open' : 'close') },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement((_mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_5___default()), null))),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'libnodecontainer ' + (_isopen ? 'open' : 'close') },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'libnodecontainer_inner' },\r\n                filterednodes && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, filterednodes.map(function (subItem, idx) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LibraryNode, { key: idx, item: subItem })); }))),\r\n                item.subshelves && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, item.subshelves.map(function (subItem, idx) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LibraryShelf, { key: idx, item: subItem, filter: filter })); }))))),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"hr\", null)));\r\n};\r\nvar LibFilter = function (_a) {\r\n    // input with left icon\r\n    var filter = _a.filter, setFilter = _a.setFilter;\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'libfilter' },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement((_mui_icons_material_Search__WEBPACK_IMPORTED_MODULE_3___default()), { fontSize: 'inherit' }),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: 'text', placeholder: 'Filter', value: filter, onChange: function (e) {\r\n                setFilter(e.target.value);\r\n            } }),\r\n        filter && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((_mui_icons_material_Close__WEBPACK_IMPORTED_MODULE_4___default()), { fontSize: 'inherit', onClick: function () {\r\n                setFilter('');\r\n            } }))));\r\n};\r\nvar AddLibraryOverLay = function (_a) {\r\n    var children = _a.children;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(''), newlib = _b[0], setNewLib = _b[1];\r\n    var zustand = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_index__WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    if (!zustand.worker) {\r\n        return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n    }\r\n    var add_new_lib = function () {\r\n        if (zustand.worker === undefined) {\r\n            return;\r\n        }\r\n        zustand.worker.add_lib(newlib);\r\n        setNewLib('');\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dialog__WEBPACK_IMPORTED_MODULE_6__[\"default\"], { title: 'Add Library', trigger: children, description: 'Add a new library to the current worker.', buttons: [\r\n            {\r\n                text: 'add',\r\n                onClick: add_new_lib\r\n            }\r\n        ] },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { className: 'styledinput', type: 'text', value: newlib, onChange: function (e) {\r\n                setNewLib(e.target.value);\r\n            } })));\r\n};\r\nvar Library = function () {\r\n    var zustand = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_index__WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    var libstate = zustand.lib.libstate(function (state) { return state.state; });\r\n    var _a = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(''), filter = _a[0], setFilter = _a[1];\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'libcontainer' },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'library' },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'libtitle' }, \"Lib\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"hr\", { className: 'hr_prominent' }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LibFilter, { filter: filter, setFilter: setFilter }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'vscrollcontainer' }, libstate.shelves.map(function (item, idx) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LibraryShelf, { key: idx, item: item, filter: filter })); })),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"hr\", null)),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'addlib' },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(AddLibraryOverLay, null,\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { disabled: zustand.worker === undefined }, \"Add Library\")))));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Library);\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/lib.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   LibraryItem: () => (/* binding */ LibraryShelf),\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _lib_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./lib.scss */ \"./src/frontend/lib.scss\");\n/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./index */ \"./src/frontend/index.tsx\");\n/* harmony import */ var _mui_icons_material_Search__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @mui/icons-material/Search */ \"@mui/icons-material/Search\");\n/* harmony import */ var _mui_icons_material_Search__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_Search__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _mui_icons_material_Close__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @mui/icons-material/Close */ \"@mui/icons-material/Close\");\n/* harmony import */ var _mui_icons_material_Close__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_Close__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @mui/icons-material/ExpandLess */ \"@mui/icons-material/ExpandLess\");\n/* harmony import */ var _mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var _dialog__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./dialog */ \"./src/frontend/dialog.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar LibraryNode = function (_a) {\r\n    var item = _a.item;\r\n    var zustand = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_index__WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    var add_to_flow = function () {\r\n        var _a;\r\n        (_a = zustand.worker) === null || _a === void 0 ? void 0 : _a.add_node(item.node_id);\r\n    };\r\n    var nodeclick = function (event) {\r\n        // if double click, add node to graph\r\n        if (event.detail === 2) {\r\n            add_to_flow();\r\n        }\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"libnodeentry\", onClick: nodeclick, title: item.description }, item.node_name || item.node_id));\r\n};\r\nvar filterShelf = function (shelf, filter) {\r\n    var _a, _b, _c, _d;\r\n    var hasFilteredNodes = (_b = (_a = shelf.nodes) === null || _a === void 0 ? void 0 : _a.some(function (node) {\r\n        return node.node_id.toLowerCase().includes(filter.toLowerCase());\r\n    })) !== null && _b !== void 0 ? _b : false;\r\n    var hasFilteredSubShelves = (_d = (_c = shelf.subshelves) === null || _c === void 0 ? void 0 : _c.some(function (subShelf) { return filterShelf(subShelf, filter); })) !== null && _d !== void 0 ? _d : false;\r\n    return hasFilteredNodes || hasFilteredSubShelves;\r\n};\r\nvar LibraryShelf = function (_a) {\r\n    var _b;\r\n    var item = _a.item, filter = _a.filter;\r\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false), isOpen = _c[0], setIsOpen = _c[1];\r\n    var handleToggle = function () { return setIsOpen(!isOpen); };\r\n    var filterednodes = (_b = item.nodes) === null || _b === void 0 ? void 0 : _b.filter(function (node) {\r\n        return node.node_id.toLowerCase().includes(filter.toLowerCase());\r\n    });\r\n    var _isopen = isOpen || filter.length > 0;\r\n    if (!filterShelf(item, filter)) {\r\n        return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"shelfcontainer\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"shelftitle\", onClick: handleToggle, style: { cursor: \"pointer\" }, title: item.description },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"shelftitle_text\" }, item.name),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"expandicon \" + (_isopen ? \"open\" : \"close\") },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement((_mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_5___default()), null))),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"libnodecontainer \" + (_isopen ? \"open\" : \"close\") },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"libnodecontainer_inner\" },\r\n                filterednodes && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, filterednodes.map(function (subItem, idx) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LibraryNode, { key: idx, item: subItem })); }))),\r\n                item.subshelves && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, item.subshelves.map(function (subItem, idx) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LibraryShelf, { key: idx, item: subItem, filter: filter })); }))))),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"hr\", null)));\r\n};\r\nvar LibFilter = function (_a) {\r\n    // input with left icon\r\n    var filter = _a.filter, setFilter = _a.setFilter;\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"libfilter\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement((_mui_icons_material_Search__WEBPACK_IMPORTED_MODULE_3___default()), { fontSize: \"inherit\" }),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"text\", placeholder: \"Filter\", value: filter, onChange: function (e) {\r\n                setFilter(e.target.value);\r\n            } }),\r\n        filter && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((_mui_icons_material_Close__WEBPACK_IMPORTED_MODULE_4___default()), { fontSize: \"inherit\", onClick: function () {\r\n                setFilter(\"\");\r\n            } }))));\r\n};\r\nvar AddLibraryOverLay = function (_a) {\r\n    var children = _a.children;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(\"\"), newlib = _b[0], setNewLib = _b[1];\r\n    var zustand = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_index__WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    if (!zustand.worker) {\r\n        return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n    }\r\n    var add_new_lib = function () {\r\n        if (zustand.worker === undefined) {\r\n            return;\r\n        }\r\n        zustand.worker.add_lib(newlib);\r\n        setNewLib(\"\");\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dialog__WEBPACK_IMPORTED_MODULE_6__[\"default\"], { title: \"Add Library\", trigger: children, description: \"Add a new library to the current worker.\", buttons: [\r\n            {\r\n                text: \"add\",\r\n                onClick: add_new_lib,\r\n                close: true\r\n            },\r\n        ] },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { className: \"styledinput\", type: \"text\", value: newlib, onChange: function (e) {\r\n                setNewLib(e.target.value);\r\n            } })));\r\n};\r\nvar AddExternalWorkerOverLay = function (_a) {\r\n    var children = _a.children;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(\"\"), newlib = _b[0], setNewLib = _b[1];\r\n    var zustand = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_index__WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    if (!zustand.worker) {\r\n        return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null);\r\n    }\r\n    var add_new_worker = function () {\r\n        if (zustand.worker === undefined) {\r\n            return;\r\n        }\r\n        zustand.worker.add_worker_package(newlib);\r\n        setNewLib(\"\");\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dialog__WEBPACK_IMPORTED_MODULE_6__[\"default\"], { title: \"Add External Worker\", trigger: children, description: \"Add external worker class(es) to the current worker.\", buttons: [\r\n            {\r\n                text: \"add\",\r\n                onClick: add_new_worker,\r\n                close: true\r\n            },\r\n        ] },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { className: \"styledinput\", type: \"text\", value: newlib, onChange: function (e) {\r\n                setNewLib(e.target.value);\r\n            } })));\r\n};\r\nvar ExternalWorkerClassEntry = function (_a) {\r\n    var item = _a.item, mod = _a.mod;\r\n    var zustand = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_index__WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    var add_to_flow = function () {\r\n        var _a;\r\n        (_a = zustand.worker) === null || _a === void 0 ? void 0 : _a.add_external_worker({\r\n            module: mod,\r\n            cls_module: item.module,\r\n            cls_name: item.class_name\r\n        });\r\n    };\r\n    var nodeclick = function (event) {\r\n        // if double click, add node to graph\r\n        if (event.detail === 2) {\r\n            add_to_flow();\r\n        }\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"libnodeentry\", onClick: nodeclick, title: item.name }, item.name || item.module + \".\" + item.class_name));\r\n};\r\nvar ExternalWorkerShelf = function (_a) {\r\n    var externalworkermod = _a.externalworkermod;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false), isOpen = _b[0], setIsOpen = _b[1];\r\n    var handleToggle = function () { return setIsOpen(!isOpen); };\r\n    var _isopen = isOpen;\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"shelfcontainer\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"shelftitle\", onClick: handleToggle, style: { cursor: \"pointer\" }, title: externalworkermod.module },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"shelftitle_text\" }, externalworkermod.module),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"expandicon \" + (_isopen ? \"open\" : \"close\") },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement((_mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_5___default()), null))),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"libnodecontainer \" + (_isopen ? \"open\" : \"close\") },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"libnodecontainer_inner\" }, externalworkermod.worker_classes.map(function (subItem, idx) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(ExternalWorkerClassEntry, { key: idx, item: subItem, mod: externalworkermod.module })); }))),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"hr\", null)));\r\n};\r\nvar Library = function () {\r\n    var _a;\r\n    var zustand = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_index__WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    var libstate = zustand.lib.libstate();\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(\"\"), filter = _b[0], setFilter = _b[1];\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"libcontainer\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"library\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"libtitle\" }, \"Lib\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"hr\", { className: \"hr_prominent\" }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LibFilter, { filter: filter, setFilter: setFilter }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"vscrollcontainer\" }, libstate.lib.shelves.map(function (item, idx) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(LibraryShelf, { key: idx, item: item, filter: filter })); })),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"hr\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"addlib\" },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(AddLibraryOverLay, null,\r\n                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { disabled: zustand.worker === undefined }, \"Add Library\")))),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { style: { paddingTop: \"0.5rem\" } }),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"library\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"libtitle\" }, \"External Worker\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"hr\", { className: \"hr_prominent\" }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"vscrollcontainer\" }, (_a = libstate.external_worker) === null || _a === void 0 ? void 0 : _a.map(function (item, idx) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(ExternalWorkerShelf, { key: idx, externalworkermod: item })); })),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"hr\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"addlib\" },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(AddExternalWorkerOverLay, null,\r\n                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { disabled: zustand.worker === undefined }, \"Add External Worker\"))))));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Library);\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/lib.tsx?");
+
+/***/ }),
+
+/***/ "./src/frontend/node/body_data_renderer.tsx":
+/*!**************************************************!*\
+  !*** ./src/frontend/node/body_data_renderer.tsx ***!
+  \**************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   BodyDataRendererForIo: () => (/* binding */ BodyDataRendererForIo)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../funcnodesreactflow */ \"./src/frontend/funcnodesreactflow/index.tsx\");\n/* harmony import */ var _io_io__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./io/io */ \"./src/frontend/node/io/io.tsx\");\n/* harmony import */ var _datarenderer_data_renderer_overlay__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../datarenderer/data_renderer_overlay */ \"./src/frontend/datarenderer/data_renderer_overlay.tsx\");\n/* harmony import */ var _datarenderer_rendermappings__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../datarenderer/rendermappings */ \"./src/frontend/datarenderer/rendermappings.tsx\");\n/* harmony import */ var _datarenderer_default_preview_renderer__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../datarenderer/default_preview_renderer */ \"./src/frontend/datarenderer/default_preview_renderer.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\nvar BodyDataRendererForIo = function (io) {\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var render = fnrf_zst.render_options();\r\n    var typestring = (0,_io_io__WEBPACK_IMPORTED_MODULE_2__.pick_best_io_type)(io.type, render.typemap || {})[0];\r\n    var overlayhandle = (0,_datarenderer_data_renderer_overlay__WEBPACK_IMPORTED_MODULE_3__.DataOverlayRendererForIo)(io);\r\n    var _a = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_datarenderer_rendermappings__WEBPACK_IMPORTED_MODULE_4__.RenderMappingContext), DataPreviewViewRenderer = _a.DataPreviewViewRenderer, DataViewRenderer = _a.DataViewRenderer;\r\n    if (!typestring)\r\n        return [_datarenderer_default_preview_renderer__WEBPACK_IMPORTED_MODULE_5__.DictOutput, overlayhandle];\r\n    if (DataViewRenderer[typestring])\r\n        return [DataViewRenderer[typestring], overlayhandle];\r\n    if (DataPreviewViewRenderer[typestring])\r\n        return [DataPreviewViewRenderer[typestring], overlayhandle];\r\n    return [_datarenderer_default_preview_renderer__WEBPACK_IMPORTED_MODULE_5__.DictOutput, overlayhandle];\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/body_data_renderer.tsx?");
 
 /***/ }),
 
@@ -206,7 +256,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \*********************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   BooleanInput: () => (/* binding */ BooleanInput),\n/* harmony export */   ColorInput: () => (/* binding */ ColorInput),\n/* harmony export */   FloatInput: () => (/* binding */ FloatInput),\n/* harmony export */   IntegerInput: () => (/* binding */ IntegerInput),\n/* harmony export */   SelectionInput: () => (/* binding */ SelectionInput),\n/* harmony export */   StringInput: () => (/* binding */ StringInput)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../funcnodesreactflow */ \"./src/frontend/funcnodesreactflow/index.tsx\");\n/* harmony import */ var _utils_colorpicker__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../utils/colorpicker */ \"./src/frontend/utils/colorpicker.tsx\");\n\r\n\r\n\r\n\r\nvar BooleanInput = function (_a) {\r\n    var io = _a.io, inputconverter = _a.inputconverter;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var indeterminate = io.value === undefined;\r\n    var cRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        if (!cRef.current)\r\n            return;\r\n        cRef.current.indeterminate = indeterminate;\r\n    }, [cRef, indeterminate]);\r\n    var on_change = function (e) {\r\n        var _a, _b;\r\n        var new_value = e.target.checked;\r\n        try {\r\n            new_value = inputconverter(e.target.checked);\r\n        }\r\n        catch (e) { }\r\n        (_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.set_io_value({\r\n            nid: io.node,\r\n            ioid: io.id,\r\n            value: new_value,\r\n            set_default: ((_b = io.render_options) === null || _b === void 0 ? void 0 : _b.set_default) || false\r\n        });\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { ref: cRef, type: 'checkbox', className: 'styledcheckbox', checked: !!io.value, onChange: on_change, disabled: io.connected }));\r\n};\r\nvar NumberInput = function (_a) {\r\n    var _b, _c;\r\n    var io = _a.io, inputconverter = _a.inputconverter, _d = _a.parser, parser = _d === void 0 ? function (n) { return parseFloat(n); } : _d;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var _e = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(io.value), tempvalue = _e[0], setTempValue = _e[1];\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        setTempValue(io.value);\r\n    }, [io.value]);\r\n    var set_new_value = function (new_value) {\r\n        var _a, _b;\r\n        new_value = parser(parseFloat(new_value.toString()).toString() // parse float for e notation\r\n        );\r\n        if (isNaN(new_value)) {\r\n            new_value = '<NoValue>';\r\n            setTempValue('');\r\n        }\r\n        else {\r\n            setTempValue(new_value.toString());\r\n        }\r\n        try {\r\n            new_value = inputconverter(new_value);\r\n        }\r\n        catch (e) { }\r\n        (_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.set_io_value({\r\n            nid: io.node,\r\n            ioid: io.id,\r\n            value: new_value,\r\n            set_default: ((_b = io.render_options) === null || _b === void 0 ? void 0 : _b.set_default) || false\r\n        });\r\n    };\r\n    var on_change = function (e) {\r\n        set_new_value(e.target.value);\r\n    };\r\n    var v = io.connected ? io.value : tempvalue;\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: 'text', className: 'nodedatainput styledinput', value: v || '', onChange: function (e) { return setTempValue(e.target.value); }, onBlur: on_change, onKeyDown: function (e) {\r\n            // on key up add step to value\r\n            var _a, _b;\r\n            if (e.key === 'ArrowUp') {\r\n                var step = ((_a = io.render_options) === null || _a === void 0 ? void 0 : _a.step) || 1;\r\n                if (e.shiftKey)\r\n                    step *= 10;\r\n                var new_value = (parseFloat(v) || 0) + step;\r\n                // setTempValue(new_value.toString());\r\n                set_new_value(new_value);\r\n                return;\r\n            }\r\n            // on key down subtract step to value\r\n            if (e.key === 'ArrowDown') {\r\n                var step = ((_b = io.render_options) === null || _b === void 0 ? void 0 : _b.step) || 1;\r\n                if (e.shiftKey)\r\n                    step *= 10;\r\n                var new_value = (parseFloat(v) || 0) - step;\r\n                // setTempValue(new_value.toString());\r\n                set_new_value(new_value);\r\n                return;\r\n            }\r\n            //accept only numbers\r\n            if (!/^[0-9.eE+-]$/.test(e.key) &&\r\n                !['Backspace', 'ArrowLeft', 'ArrowRight', 'Delete', 'Tab'].includes(e.key)) {\r\n                e.preventDefault();\r\n            }\r\n        }, disabled: io.connected, step: (_b = io.render_options) === null || _b === void 0 ? void 0 : _b.step, min: (_c = io.value_options) === null || _c === void 0 ? void 0 : _c.min }));\r\n};\r\nvar FloatInput = function (_a) {\r\n    var io = _a.io, inputconverter = _a.inputconverter;\r\n    return NumberInput({ io: io, inputconverter: inputconverter, parser: parseFloat });\r\n};\r\nvar IntegerInput = function (_a) {\r\n    var io = _a.io, inputconverter = _a.inputconverter;\r\n    return NumberInput({ io: io, inputconverter: inputconverter, parser: parseInt });\r\n};\r\nvar StringInput = function (_a) {\r\n    var io = _a.io, inputconverter = _a.inputconverter;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(io.value), tempvalue = _b[0], setTempValue = _b[1];\r\n    var on_change = function (e) {\r\n        var _a, _b;\r\n        var new_value = e.target.value;\r\n        try {\r\n            new_value = inputconverter(new_value);\r\n        }\r\n        catch (e) { }\r\n        if (!new_value)\r\n            new_value = '<NoValue>';\r\n        (_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.set_io_value({\r\n            nid: io.node,\r\n            ioid: io.id,\r\n            value: new_value,\r\n            set_default: ((_b = io.render_options) === null || _b === void 0 ? void 0 : _b.set_default) || false\r\n        });\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { className: 'nodedatainput styledinput', value: io.connected ? io.value : tempvalue, onChange: function (e) { return setTempValue(e.target.value); }, onBlur: on_change, disabled: io.connected }));\r\n};\r\nvar _parse_string = function (s) { return s; };\r\nvar _parse_number = function (s) { return parseFloat(s); };\r\nvar _parse_boolean = function (s) { return !!s; };\r\nvar _parse_null = function (s) { return (s === 'null' ? null : s); };\r\nvar get_parser = function (datatype) {\r\n    if (datatype === 'nuinputconvertermber') {\r\n        return _parse_number;\r\n    }\r\n    if (datatype === 'boolean') {\r\n        return _parse_boolean;\r\n    }\r\n    if (datatype === 'undefined') {\r\n        return _parse_null;\r\n    }\r\n    return _parse_string;\r\n};\r\nvar SelectionInput = function (_a) {\r\n    var _b;\r\n    var io = _a.io, inputconverter = _a.inputconverter, parser = _a.parser;\r\n    var options = ((_b = io.value_options) === null || _b === void 0 ? void 0 : _b.options) || [];\r\n    if (Array.isArray(options)) {\r\n        options = {\r\n            type: 'enum',\r\n            values: options,\r\n            keys: options.map(function (x) { return x.toString(); }),\r\n            nullable: false\r\n        };\r\n    }\r\n    options = options;\r\n    if (options.nullable &&\r\n        !options.values.includes(null) &&\r\n        !options.keys.includes('None')) {\r\n        options.values.unshift(null);\r\n        options.keys.unshift('None');\r\n    }\r\n    //make key value pairs\r\n    var optionsmap = [];\r\n    for (var i = 0; i < options.values.length; i++) {\r\n        // set const t to \"string\", \"number\",\"boolean\" \"null\" depenting on the type of options.values[i]\r\n        var t = options.values[i] === null || options.values[i] === undefined\r\n            ? 'undefined'\r\n            : typeof options.values[i];\r\n        var v_1 = options.values[i];\r\n        if (v_1 === null) {\r\n            v_1 = 'null';\r\n        }\r\n        if (v_1 === undefined) {\r\n            v_1 = 'undefined';\r\n        }\r\n        optionsmap.push([options.keys[i], v_1.toString(), t]);\r\n    }\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var on_change = function (e) {\r\n        var _a, _b;\r\n        // Find the selected option element\r\n        var selectedOption = e.target.options[e.target.selectedIndex];\r\n        // Retrieve the datatype attribute from the selected option\r\n        var datatype = selectedOption.getAttribute('datatype');\r\n        // Use the existing parser or get a new one based on the datatype\r\n        var p = parser || get_parser(datatype);\r\n        var new_value = p(e.target.value);\r\n        try {\r\n            new_value = inputconverter(e.target.value);\r\n        }\r\n        catch (e) { }\r\n        (_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.set_io_value({\r\n            nid: io.node,\r\n            ioid: io.id,\r\n            value: new_value,\r\n            set_default: ((_b = io.render_options) === null || _b === void 0 ? void 0 : _b.set_default) || false\r\n        });\r\n    };\r\n    var v = io.value;\r\n    if (v === null) {\r\n        v = 'null';\r\n    }\r\n    if (v === undefined) {\r\n        v = 'undefined';\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"select\", { value: v, onChange: on_change, disabled: io.connected, className: 'nodedatainput styleddropdown' },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"option\", { value: '<NoValue>', disabled: true }, \"select\"),\r\n        optionsmap.map(function (option) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"option\", { key: option[0], value: option[1], datatype: option[2] }, option[0])); })));\r\n};\r\nvar ColorInput = function (_a) {\r\n    var _b;\r\n    var io = _a.io;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var colorspace = ((_b = io.value_options) === null || _b === void 0 ? void 0 : _b.colorspace) || 'hex';\r\n    var on_change = function (colorconverter) {\r\n        var _a, _b;\r\n        var new_value = '<NoValue>';\r\n        if (colorconverter) {\r\n            if (colorconverter[colorspace])\r\n                new_value = colorconverter[colorspace]();\r\n            else\r\n                new_value = colorconverter.hex();\r\n        }\r\n        try {\r\n            new_value = new_value;\r\n        }\r\n        catch (e) { }\r\n        (_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.set_io_value({\r\n            nid: io.node,\r\n            ioid: io.id,\r\n            value: new_value,\r\n            set_default: ((_b = io.render_options) === null || _b === void 0 ? void 0 : _b.set_default) || false\r\n        });\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_utils_colorpicker__WEBPACK_IMPORTED_MODULE_2__[\"default\"], { onChange: on_change, inicolordata: io.value, inicolorspace: colorspace }));\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/io/default_input_renderer.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   BooleanInput: () => (/* binding */ BooleanInput),\n/* harmony export */   ColorInput: () => (/* binding */ ColorInput),\n/* harmony export */   FloatInput: () => (/* binding */ FloatInput),\n/* harmony export */   IntegerInput: () => (/* binding */ IntegerInput),\n/* harmony export */   SelectionInput: () => (/* binding */ SelectionInput),\n/* harmony export */   StringInput: () => (/* binding */ StringInput)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../funcnodesreactflow */ \"./src/frontend/funcnodesreactflow/index.tsx\");\n/* harmony import */ var _utils_colorpicker__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../utils/colorpicker */ \"./src/frontend/utils/colorpicker.tsx\");\n/* harmony import */ var _radix_ui_react_slider__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @radix-ui/react-slider */ \"@radix-ui/react-slider\");\n/* harmony import */ var _radix_ui_react_slider__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_radix_ui_react_slider__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @radix-ui/react-tooltip */ \"@radix-ui/react-tooltip\");\n/* harmony import */ var _radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _utils_select__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../utils/select */ \"./src/frontend/utils/select.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar BooleanInput = function (_a) {\r\n    var io = _a.io, inputconverter = _a.inputconverter;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var indeterminate = io.value === undefined;\r\n    var cRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        if (!cRef.current)\r\n            return;\r\n        cRef.current.indeterminate = indeterminate;\r\n    }, [cRef, indeterminate]);\r\n    var on_change = function (e) {\r\n        var _a;\r\n        var new_value = e.target.checked;\r\n        try {\r\n            new_value = inputconverter[0](e.target.checked);\r\n        }\r\n        catch (e) { }\r\n        (_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.set_io_value({\r\n            nid: io.node,\r\n            ioid: io.id,\r\n            value: new_value,\r\n            set_default: io.render_options.set_default\r\n        });\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { ref: cRef, type: \"checkbox\", className: \"styledcheckbox booleaninput\", checked: !!inputconverter[1](io.value), onChange: on_change, disabled: io.connected }));\r\n};\r\nvar NumberInput = function (_a) {\r\n    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;\r\n    var io = _a.io, inputconverter = _a.inputconverter, _o = _a.parser, parser = _o === void 0 ? function (n) { return parseFloat(n); } : _o;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var _p = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(inputconverter[1](io.value)), tempvalue = _p[0], setTempValue = _p[1];\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        setTempValue(inputconverter[1](io.value));\r\n    }, [io.value]);\r\n    var set_new_value = function (new_value) {\r\n        var _a, _b, _c;\r\n        new_value = parser(parseFloat(new_value.toString()).toString() // parse float for e notation\r\n        );\r\n        if (isNaN(new_value)) {\r\n            new_value = \"<NoValue>\";\r\n            setTempValue(\"\");\r\n        }\r\n        else {\r\n            if (((_a = io.value_options) === null || _a === void 0 ? void 0 : _a.min) !== undefined &&\r\n                new_value < io.value_options.min)\r\n                new_value = io.value_options.min;\r\n            if (((_b = io.value_options) === null || _b === void 0 ? void 0 : _b.max) !== undefined &&\r\n                new_value > io.value_options.max)\r\n                new_value = io.value_options.max;\r\n            setTempValue(new_value.toString());\r\n        }\r\n        try {\r\n            new_value = inputconverter[0](new_value);\r\n        }\r\n        catch (e) { }\r\n        (_c = fnrf_zst.worker) === null || _c === void 0 ? void 0 : _c.set_io_value({\r\n            nid: io.node,\r\n            ioid: io.id,\r\n            value: new_value,\r\n            set_default: io.render_options.set_default\r\n        });\r\n    };\r\n    var on_change = function (e) {\r\n        set_new_value(e.target.value);\r\n    };\r\n    var v = io.connected ? inputconverter[1](io.value) : tempvalue;\r\n    if (v === undefined)\r\n        v = (_b = io.value_options) === null || _b === void 0 ? void 0 : _b.min;\r\n    if (v === undefined)\r\n        v = (_c = io.value_options) === null || _c === void 0 ? void 0 : _c.max;\r\n    if (v === undefined)\r\n        v = \"\";\r\n    if (v === null)\r\n        v = \"\";\r\n    if (((_d = io.value_options) === null || _d === void 0 ? void 0 : _d.max) !== undefined &&\r\n        ((_e = io.value_options) === null || _e === void 0 ? void 0 : _e.min) !== undefined) {\r\n        return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { style: { minWidth: \"100px\" }, className: \"SliderContainer\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_slider__WEBPACK_IMPORTED_MODULE_3__.Root, { className: \"SliderRoot\", value: [v === undefined ? (_f = io.value_options) === null || _f === void 0 ? void 0 : _f.min : v], min: (_g = io.value_options) === null || _g === void 0 ? void 0 : _g.min, max: (_h = io.value_options) === null || _h === void 0 ? void 0 : _h.max, step: io.render_options.step ||\r\n                    (((_j = io.value_options) === null || _j === void 0 ? void 0 : _j.max) - ((_k = io.value_options) === null || _k === void 0 ? void 0 : _k.min)) / 1000, disabled: io.connected, onValueCommit: function (value) {\r\n                    if (isNaN(value[0]))\r\n                        return;\r\n                    set_new_value(value[0]);\r\n                }, onValueChange: function (value) {\r\n                    if (isNaN(value[0]))\r\n                        return;\r\n                    setTempValue(value[0].toString());\r\n                } },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_slider__WEBPACK_IMPORTED_MODULE_3__.Track, { className: \"SliderTrack\" },\r\n                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_slider__WEBPACK_IMPORTED_MODULE_3__.Range, { className: \"SliderRange\" })),\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_4__.TooltipProvider, null,\r\n                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_4__.Root, { open: true },\r\n                        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_4__.Trigger, { asChild: true },\r\n                            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_slider__WEBPACK_IMPORTED_MODULE_3__.Thumb, { className: \"SliderThumb\" })),\r\n                        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_4__.Content, { className: \"SliderTooltipContent\" }, v))))));\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"text\", className: \"nodedatainput styledinput numberinput\", value: v, onChange: function (e) { return setTempValue(e.target.value); }, onBlur: on_change, onKeyDown: function (e) {\r\n            // on key up add step to value\r\n            if (e.key === \"ArrowUp\") {\r\n                var step = io.render_options.step || 1;\r\n                if (e.shiftKey)\r\n                    step *= 10;\r\n                var new_value = (parseFloat(v) || 0) + step;\r\n                // setTempValue(new_value.toString());\r\n                set_new_value(new_value);\r\n                return;\r\n            }\r\n            // on key down subtract step to value\r\n            if (e.key === \"ArrowDown\") {\r\n                var step = io.render_options.step || 1;\r\n                if (e.shiftKey)\r\n                    step *= 10;\r\n                var new_value = (parseFloat(v) || 0) - step;\r\n                // setTempValue(new_value.toString());\r\n                set_new_value(new_value);\r\n                return;\r\n            }\r\n            //accept only numbers\r\n            if (!/^[0-9.eE+-]$/.test(e.key) &&\r\n                ![\"Backspace\", \"ArrowLeft\", \"ArrowRight\", \"Delete\", \"Tab\"].includes(e.key)) {\r\n                e.preventDefault();\r\n            }\r\n        }, disabled: io.connected, step: io.render_options.step, min: (_l = io.value_options) === null || _l === void 0 ? void 0 : _l.min, max: (_m = io.value_options) === null || _m === void 0 ? void 0 : _m.max }));\r\n};\r\nvar FloatInput = function (_a) {\r\n    var io = _a.io, inputconverter = _a.inputconverter;\r\n    return NumberInput({ io: io, inputconverter: inputconverter, parser: parseFloat });\r\n};\r\nvar IntegerInput = function (_a) {\r\n    var io = _a.io, inputconverter = _a.inputconverter;\r\n    return NumberInput({ io: io, inputconverter: inputconverter, parser: parseInt });\r\n};\r\nvar StringInput = function (_a) {\r\n    var io = _a.io, inputconverter = _a.inputconverter;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(inputconverter[1](io.value)), tempvalue = _b[0], setTempValue = _b[1];\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        setTempValue(inputconverter[1](io.value));\r\n    }, [io.value]);\r\n    var on_change = function (e) {\r\n        var _a;\r\n        var new_value = e.target.value;\r\n        if (!new_value)\r\n            new_value = \"<NoValue>\";\r\n        try {\r\n            new_value = inputconverter[0](new_value);\r\n        }\r\n        catch (e) { }\r\n        (_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.set_io_value({\r\n            nid: io.node,\r\n            ioid: io.id,\r\n            value: new_value,\r\n            set_default: io.render_options.set_default\r\n        });\r\n    };\r\n    var v = io.connected ? inputconverter[1](io.value) : tempvalue;\r\n    if (v === undefined || v === null)\r\n        v = \"\";\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { className: \"nodedatainput styledinput stringinput\", value: v, onChange: function (e) { return setTempValue(e.target.value); }, onBlur: on_change, disabled: io.connected }));\r\n};\r\nvar _parse_string = function (s) { return s; };\r\nvar _parse_number = function (s) { return parseFloat(s); };\r\nvar _parse_boolean = function (s) { return !!s; };\r\nvar _parse_null = function (s) { return (s === \"null\" ? null : s); };\r\nvar get_parser = function (datatype) {\r\n    if (datatype === \"nuinputconvertermber\") {\r\n        return _parse_number;\r\n    }\r\n    if (datatype === \"boolean\") {\r\n        return _parse_boolean;\r\n    }\r\n    if (datatype === \"undefined\") {\r\n        return _parse_null;\r\n    }\r\n    return _parse_string;\r\n};\r\nvar SelectionInput = function (_a) {\r\n    var _b;\r\n    var io = _a.io, inputconverter = _a.inputconverter, parser = _a.parser;\r\n    var options = ((_b = io.value_options) === null || _b === void 0 ? void 0 : _b.options) || [];\r\n    if (Array.isArray(options)) {\r\n        options = {\r\n            type: \"enum\",\r\n            values: options,\r\n            keys: options.map(function (x) { return x.toString(); }),\r\n            nullable: false\r\n        };\r\n    }\r\n    options = options;\r\n    if (options.nullable &&\r\n        !options.values.includes(null) &&\r\n        !options.keys.includes(\"None\")) {\r\n        options.values.unshift(null);\r\n        options.keys.unshift(\"None\");\r\n    }\r\n    //make key value pairs\r\n    var optionsmap = [];\r\n    for (var i = 0; i < options.values.length; i++) {\r\n        // set const t to \"string\", \"number\",\"boolean\" \"null\" depenting on the type of options.values[i]\r\n        var t = options.values[i] === null || options.values[i] === undefined\r\n            ? \"undefined\"\r\n            : typeof options.values[i];\r\n        var v_1 = options.values[i];\r\n        if (v_1 === null) {\r\n            v_1 = \"null\";\r\n        }\r\n        if (v_1 === undefined) {\r\n            v_1 = \"undefined\";\r\n        }\r\n        optionsmap.push([options.keys[i], v_1.toString(), t]);\r\n    }\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var on_change_value = function (_a) {\r\n        var _b;\r\n        var value = _a.value, \r\n        // label\r\n        datatype = _a.datatype;\r\n        // Use the existing parser or get a new one based on the datatype\r\n        var p = parser || get_parser(datatype);\r\n        var new_value = p(value);\r\n        try {\r\n            new_value = inputconverter[0](value);\r\n        }\r\n        catch (e) { }\r\n        (_b = fnrf_zst.worker) === null || _b === void 0 ? void 0 : _b.set_io_value({\r\n            nid: io.node,\r\n            ioid: io.id,\r\n            value: new_value,\r\n            set_default: io.render_options.set_default\r\n        });\r\n    };\r\n    var on_change = function (e) {\r\n        // Find the selected option element\r\n        var selectedOption = e.target.options[e.target.selectedIndex];\r\n        // Retrieve the datatype attribute from the selected option\r\n        var datatype = selectedOption.getAttribute(\"datatype\");\r\n        on_change_value({\r\n            value: e.target.value,\r\n            // label: selectedOption.text,\r\n            datatype: datatype || \"string\"\r\n        });\r\n    };\r\n    var v = io.value;\r\n    if (v === null) {\r\n        v = \"null\";\r\n    }\r\n    if (v === undefined) {\r\n        v = \"undefined\";\r\n    }\r\n    var default_entry = optionsmap.find(function (option) { return option[1] === v; });\r\n    var default_value;\r\n    if (default_entry !== undefined) {\r\n        default_value = {\r\n            value: default_entry[1],\r\n            label: default_entry[0],\r\n            datatype: default_entry[2]\r\n        };\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_utils_select__WEBPACK_IMPORTED_MODULE_5__[\"default\"], { className: \"nodedatainput styleddropdown\", options: optionsmap.map(function (option) { return ({\r\n            value: option[1],\r\n            label: option[0],\r\n            datatype: option[2]\r\n        }); }), defaultValue: default_value, onChange: function (newValue) {\r\n            if (newValue === null)\r\n                newValue = {\r\n                    value: \"<NoValue>\",\r\n                    label: \"<NoValue>\",\r\n                    datatype: \"string\"\r\n                };\r\n            on_change_value(newValue);\r\n        } }));\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"select\", { value: v, onChange: on_change, disabled: io.connected, className: \"nodedatainput styleddropdown\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"option\", { value: \"<NoValue>\", disabled: true }, \"select\"),\r\n        optionsmap.map(function (option) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"option\", { key: option[0], value: option[1], datatype: option[2] }, option[0])); })));\r\n};\r\nvar ColorInput = function (_a) {\r\n    var _b;\r\n    var io = _a.io;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var colorspace = ((_b = io.value_options) === null || _b === void 0 ? void 0 : _b.colorspace) || \"hex\";\r\n    var on_change = function (colorconverter) {\r\n        var _a;\r\n        var new_value = \"<NoValue>\";\r\n        if (colorconverter) {\r\n            if (colorconverter[colorspace])\r\n                new_value = colorconverter[colorspace]();\r\n            else\r\n                new_value = colorconverter.hex();\r\n        }\r\n        if (colorconverter === null)\r\n            new_value = null;\r\n        try {\r\n            new_value = new_value;\r\n        }\r\n        catch (e) { }\r\n        (_a = fnrf_zst.worker) === null || _a === void 0 ? void 0 : _a.set_io_value({\r\n            nid: io.node,\r\n            ioid: io.id,\r\n            value: new_value,\r\n            set_default: io.render_options.set_default\r\n        });\r\n    };\r\n    var allow_null = false;\r\n    if (typeof io.type !== \"string\" &&\r\n        \"anyOf\" in io.type &&\r\n        io.type.anyOf !== undefined) {\r\n        allow_null = io.type.anyOf.some(function (x) { return x === \"None\"; });\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_utils_colorpicker__WEBPACK_IMPORTED_MODULE_2__[\"default\"], { onChange: on_change, inicolordata: io.value, allow_null: allow_null, inicolorspace: colorspace }));\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/io/default_input_renderer.tsx?");
 
 /***/ }),
 
@@ -216,7 +266,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \********************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   InLineOutput: () => (/* binding */ InLineOutput)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n\r\nvar InLineOutput = function (_a) {\r\n    var io = _a.io;\r\n    var value = io.fullvalue;\r\n    if (value == undefined)\r\n        value = io.value;\r\n    if (value === undefined) {\r\n        value = '';\r\n    }\r\n    else {\r\n        value = JSON.stringify(io.value).replace(/\\\\n/g, '\\n'); //respect \"\\n\" in strings\r\n    }\r\n    //truncate the string if it is too long\r\n    if (value.length > 63) {\r\n        value = value.slice(0, 60) + '...';\r\n    }\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, value);\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/io/default_output_render.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   InLineOutput: () => (/* binding */ InLineOutput)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n\r\nvar InLineOutput = function (_a) {\r\n    var io = _a.io;\r\n    var value = io.fullvalue;\r\n    if (value == undefined)\r\n        value = io.value;\r\n    if (value === undefined) {\r\n        value = \"\";\r\n    }\r\n    else {\r\n        value = JSON.stringify(io.value).replace(/\\\\n/g, \"\\n\"); //respect \"\\n\" in strings\r\n    }\r\n    //truncate the string if it is too long\r\n    if (value.length > 63) {\r\n        value = value.slice(0, 60) + \"...\";\r\n    }\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, value);\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/io/default_output_render.tsx?");
 
 /***/ }),
 
@@ -226,7 +276,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \**************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   PreviewHandleDataRendererForIo: () => (/* binding */ PreviewHandleDataRendererForIo)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../funcnodesreactflow */ \"./src/frontend/funcnodesreactflow/index.tsx\");\n/* harmony import */ var _io__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./io */ \"./src/frontend/node/io/io.tsx\");\n/* harmony import */ var _utils_table__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../utils/table */ \"./src/frontend/utils/table.tsx\");\n/* harmony import */ var _utils_jsondata__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../utils/jsondata */ \"./src/frontend/utils/jsondata.tsx\");\n/* harmony import */ var _datarenderer_images__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../datarenderer/images */ \"./src/frontend/datarenderer/images.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar TableOutput = function (_a) {\r\n    var io = _a.io;\r\n    var value = io.fullvalue;\r\n    if (value == undefined)\r\n        value = io.value;\r\n    if (value === undefined) {\r\n        value = [];\r\n    }\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_utils_table__WEBPACK_IMPORTED_MODULE_3__.SortableTable, { tabledata: value });\r\n};\r\nvar DictOutput = function (_a) {\r\n    var io = _a.io;\r\n    var value = io.fullvalue;\r\n    if (value === undefined)\r\n        value = io.value;\r\n    if (value === undefined) {\r\n        value = {};\r\n    }\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_utils_jsondata__WEBPACK_IMPORTED_MODULE_4__[\"default\"], { data: value });\r\n};\r\nvar Base64ImageOutput = function (_a) {\r\n    var io = _a.io;\r\n    var value = io.fullvalue;\r\n    if (value == undefined)\r\n        value = io.value;\r\n    if (value === undefined) {\r\n        value = '';\r\n    }\r\n    return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_datarenderer_images__WEBPACK_IMPORTED_MODULE_5__.Base64ImageRenderer, { value: value });\r\n};\r\nvar SingleValueOutput = function (_a) {\r\n    var io = _a.io;\r\n    var value = io.fullvalue;\r\n    if (value == undefined)\r\n        value = io.value;\r\n    if (value === undefined) {\r\n        value = '';\r\n    }\r\n    else {\r\n        value = JSON.stringify(io.value).replace(/\\\\n/g, '\\n'); //respect \"\\n\" in strings\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null,\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"pre\", null, value)));\r\n};\r\nvar HandlePreviouGenerators = {\r\n    string: SingleValueOutput,\r\n    table: TableOutput,\r\n    image: Base64ImageOutput,\r\n    dict: DictOutput\r\n};\r\nvar PreviewHandleDataRendererForIo = function (io) {\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var render = fnrf_zst.render_options();\r\n    var typestring = (0,_io__WEBPACK_IMPORTED_MODULE_2__.pick_best_io_type)(io.type, render.typemap || {})[0];\r\n    return typestring && HandlePreviouGenerators[typestring]\r\n        ? HandlePreviouGenerators[typestring]\r\n        : DictOutput;\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/io/handle_renderer.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   PreviewHandleDataRendererForIo: () => (/* binding */ PreviewHandleDataRendererForIo)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../funcnodesreactflow */ \"./src/frontend/funcnodesreactflow/index.tsx\");\n/* harmony import */ var _io__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./io */ \"./src/frontend/node/io/io.tsx\");\n/* harmony import */ var _datarenderer_data_renderer_overlay__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../datarenderer/data_renderer_overlay */ \"./src/frontend/datarenderer/data_renderer_overlay.tsx\");\n/* harmony import */ var _datarenderer_rendermappings__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../datarenderer/rendermappings */ \"./src/frontend/datarenderer/rendermappings.tsx\");\n/* harmony import */ var _datarenderer_default_preview_renderer__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../datarenderer/default_preview_renderer */ \"./src/frontend/datarenderer/default_preview_renderer.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\nvar PreviewHandleDataRendererForIo = function (io) {\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_funcnodesreactflow__WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var render = fnrf_zst.render_options();\r\n    var typestring = (0,_io__WEBPACK_IMPORTED_MODULE_2__.pick_best_io_type)(io.type, render.typemap || {})[0];\r\n    var _a = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_datarenderer_rendermappings__WEBPACK_IMPORTED_MODULE_4__.RenderMappingContext), HandlePreviewRenderer = _a.HandlePreviewRenderer, DataPreviewViewRenderer = _a.DataPreviewViewRenderer;\r\n    var overlayhandle = (0,_datarenderer_data_renderer_overlay__WEBPACK_IMPORTED_MODULE_3__.DataOverlayRendererForIo)(io);\r\n    if (!typestring)\r\n        return [_datarenderer_default_preview_renderer__WEBPACK_IMPORTED_MODULE_5__.DictOutput, overlayhandle];\r\n    if (HandlePreviewRenderer[typestring])\r\n        return [HandlePreviewRenderer[typestring], overlayhandle];\r\n    if (DataPreviewViewRenderer[typestring])\r\n        return [DataPreviewViewRenderer[typestring], overlayhandle];\r\n    console.warn(\"No preview generator found for type: \", typestring, \"have: \", DataPreviewViewRenderer);\r\n    return [_datarenderer_default_preview_renderer__WEBPACK_IMPORTED_MODULE_5__.DictOutput, overlayhandle];\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/io/handle_renderer.tsx?");
 
 /***/ }),
 
@@ -246,7 +296,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \*************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   HandleWithPreview: () => (/* binding */ HandleWithPreview),\n/* harmony export */   pick_best_io_type: () => (/* binding */ pick_best_io_type)\n/* harmony export */ });\n/* harmony import */ var _radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @radix-ui/react-tooltip */ \"@radix-ui/react-tooltip\");\n/* harmony import */ var _radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _mui_icons_material_LockOpen__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @mui/icons-material/LockOpen */ \"@mui/icons-material/LockOpen\");\n/* harmony import */ var _mui_icons_material_LockOpen__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_LockOpen__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _mui_icons_material_Lock__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @mui/icons-material/Lock */ \"@mui/icons-material/Lock\");\n/* harmony import */ var _mui_icons_material_Lock__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_Lock__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _mui_icons_material_Fullscreen__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @mui/icons-material/Fullscreen */ \"@mui/icons-material/Fullscreen\");\n/* harmony import */ var _mui_icons_material_Fullscreen__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_Fullscreen__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _io_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./io.scss */ \"./src/frontend/node/io/io.scss\");\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! reactflow */ \"reactflow\");\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(reactflow__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var _dialog__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../dialog */ \"./src/frontend/dialog.tsx\");\n/* harmony import */ var _handle_renderer__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./handle_renderer */ \"./src/frontend/node/io/handle_renderer.tsx\");\nvar __assign = (undefined && undefined.__assign) || function () {\r\n    __assign = Object.assign || function(t) {\r\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n            s = arguments[i];\r\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\r\n                t[p] = s[p];\r\n        }\r\n        return t;\r\n    };\r\n    return __assign.apply(this, arguments);\r\n};\r\nvar __rest = (undefined && undefined.__rest) || function (s, e) {\r\n    var t = {};\r\n    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n        t[p] = s[p];\r\n    if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\r\n            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\r\n                t[p[i]] = s[p[i]];\r\n        }\r\n    return t;\r\n};\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar pick_best_io_type = function (iot, typemap) {\r\n    // check if iot is string\r\n    if (typeof iot === 'string') {\r\n        if (iot in typemap) {\r\n            return [typemap[iot], iot];\r\n        }\r\n        return [iot, iot];\r\n    }\r\n    if ('allOf' in iot && iot.allOf !== undefined) {\r\n        return [undefined, undefined];\r\n    }\r\n    if ('anyOf' in iot && iot.anyOf !== undefined) {\r\n        var picks = iot.anyOf.map(function (x) { return pick_best_io_type(x, typemap); });\r\n        for (var _i = 0, picks_1 = picks; _i < picks_1.length; _i++) {\r\n            var pick = picks_1[_i];\r\n            switch (pick[0]) {\r\n                case 'bool':\r\n                    return ['bool', pick[1]];\r\n                case 'enum':\r\n                    return ['enum', pick[1]];\r\n                case 'float':\r\n                    return ['float', pick[1]];\r\n                case 'int':\r\n                    return ['int', pick[1]];\r\n                case 'string':\r\n                    return ['string', pick[1]];\r\n                case 'str':\r\n                    return ['string', pick[1]];\r\n            }\r\n        }\r\n        return [undefined, undefined];\r\n    }\r\n    if (!('type' in iot) || iot.type === undefined) {\r\n        return [undefined, undefined];\r\n    }\r\n    if (iot.type === 'enum') {\r\n        return ['enum', 'enum'];\r\n    }\r\n    return [undefined, undefined];\r\n};\r\nvar HandleWithPreview = function (_a) {\r\n    var io = _a.io, typestring = _a.typestring, preview = _a.preview, props = __rest(_a, [\"io\", \"typestring\", \"preview\"]);\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_6__.useState)(false), locked = _b[0], setLocked = _b[1];\r\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_6__.useState)(false), opened = _c[0], setOpened = _c[1];\r\n    var pvhandle = preview || (0,_handle_renderer__WEBPACK_IMPORTED_MODULE_8__.PreviewHandleDataRendererForIo)(io);\r\n    return (react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__.Provider, null,\r\n        react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__.Root, { open: locked || opened, onOpenChange: setOpened },\r\n            react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__.Trigger, { asChild: true },\r\n                react__WEBPACK_IMPORTED_MODULE_6___default().createElement(reactflow__WEBPACK_IMPORTED_MODULE_5__.Handle, __assign({ id: io.id }, props))),\r\n            react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__.Portal, null,\r\n                react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__.Content, { className: 'iotooltipcontent', sideOffset: 5 },\r\n                    react__WEBPACK_IMPORTED_MODULE_6___default().createElement(\"div\", { className: 'iotooltip_container' },\r\n                        react__WEBPACK_IMPORTED_MODULE_6___default().createElement(\"div\", { className: 'iotooltip_header' },\r\n                            locked ? (react__WEBPACK_IMPORTED_MODULE_6___default().createElement((_mui_icons_material_Lock__WEBPACK_IMPORTED_MODULE_2___default()), { onClick: function () { return setLocked(false); } })) : (react__WEBPACK_IMPORTED_MODULE_6___default().createElement((_mui_icons_material_LockOpen__WEBPACK_IMPORTED_MODULE_1___default()), { onClick: function () { return setLocked(true); } })),\r\n                            pvhandle && (react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_dialog__WEBPACK_IMPORTED_MODULE_7__[\"default\"], { trigger: react__WEBPACK_IMPORTED_MODULE_6___default().createElement((_mui_icons_material_Fullscreen__WEBPACK_IMPORTED_MODULE_3___default()), null), onOpenChange: function (open) {\r\n                                    if (open) {\r\n                                        io.try_get_full_value();\r\n                                    }\r\n                                    setLocked(open);\r\n                                } }, pvhandle({ io: io })))),\r\n                        pvhandle\r\n                            ? pvhandle({ io: io })\r\n                            : \"no preview available for \\\"\".concat(typestring, \"\\\"\")),\r\n                    react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__.Arrow, { className: 'iotooltipcontentarrow' }))))));\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/io/io.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   HandleWithPreview: () => (/* binding */ HandleWithPreview),\n/* harmony export */   pick_best_io_type: () => (/* binding */ pick_best_io_type)\n/* harmony export */ });\n/* harmony import */ var _radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @radix-ui/react-tooltip */ \"@radix-ui/react-tooltip\");\n/* harmony import */ var _radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _mui_icons_material_LockOpen__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @mui/icons-material/LockOpen */ \"@mui/icons-material/LockOpen\");\n/* harmony import */ var _mui_icons_material_LockOpen__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_LockOpen__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _mui_icons_material_Lock__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @mui/icons-material/Lock */ \"@mui/icons-material/Lock\");\n/* harmony import */ var _mui_icons_material_Lock__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_Lock__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _mui_icons_material_Fullscreen__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @mui/icons-material/Fullscreen */ \"@mui/icons-material/Fullscreen\");\n/* harmony import */ var _mui_icons_material_Fullscreen__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_Fullscreen__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _io_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./io.scss */ \"./src/frontend/node/io/io.scss\");\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! reactflow */ \"reactflow\");\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(reactflow__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var _dialog__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../dialog */ \"./src/frontend/dialog.tsx\");\n/* harmony import */ var _handle_renderer__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./handle_renderer */ \"./src/frontend/node/io/handle_renderer.tsx\");\nvar __assign = (undefined && undefined.__assign) || function () {\r\n    __assign = Object.assign || function(t) {\r\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n            s = arguments[i];\r\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\r\n                t[p] = s[p];\r\n        }\r\n        return t;\r\n    };\r\n    return __assign.apply(this, arguments);\r\n};\r\nvar __rest = (undefined && undefined.__rest) || function (s, e) {\r\n    var t = {};\r\n    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n        t[p] = s[p];\r\n    if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\r\n            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\r\n                t[p[i]] = s[p[i]];\r\n        }\r\n    return t;\r\n};\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar pick_best_io_type = function (iot, typemap) {\r\n    // check if iot is string\r\n    if (typeof iot === \"string\") {\r\n        if (iot in typemap) {\r\n            return [typemap[iot], iot];\r\n        }\r\n        return [iot, iot];\r\n    }\r\n    if (\"allOf\" in iot && iot.allOf !== undefined) {\r\n        return [undefined, undefined];\r\n    }\r\n    if (\"anyOf\" in iot && iot.anyOf !== undefined) {\r\n        var picks = iot.anyOf.map(function (x) { return pick_best_io_type(x, typemap); });\r\n        for (var _i = 0, picks_1 = picks; _i < picks_1.length; _i++) {\r\n            var pick = picks_1[_i];\r\n            switch (pick[0]) {\r\n                case \"bool\":\r\n                    return [\"bool\", pick[1]];\r\n                case \"enum\":\r\n                    return [\"enum\", pick[1]];\r\n                case \"float\":\r\n                    return [\"float\", pick[1]];\r\n                case \"int\":\r\n                    return [\"int\", pick[1]];\r\n                case \"string\":\r\n                    return [\"string\", pick[1]];\r\n                case \"str\":\r\n                    return [\"string\", pick[1]];\r\n            }\r\n        }\r\n        return [undefined, undefined];\r\n    }\r\n    if (!(\"type\" in iot) || iot.type === undefined) {\r\n        return [undefined, undefined];\r\n    }\r\n    if (iot.type === \"enum\") {\r\n        return [\"enum\", \"enum\"];\r\n    }\r\n    return [undefined, undefined];\r\n};\r\nvar HandleWithPreview = function (_a) {\r\n    var io = _a.io, typestring = _a.typestring, preview = _a.preview, props = __rest(_a, [\"io\", \"typestring\", \"preview\"]);\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_6__.useState)(false), locked = _b[0], setLocked = _b[1];\r\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_6__.useState)(false), opened = _c[0], setOpened = _c[1];\r\n    var _d = io\r\n        ? (0,_handle_renderer__WEBPACK_IMPORTED_MODULE_8__.PreviewHandleDataRendererForIo)(io)\r\n        : [undefined, undefined], pvhandle = _d[0], overlayhandle = _d[1];\r\n    return (react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__.Provider, null,\r\n        react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__.Root, { open: locked || opened, onOpenChange: setOpened },\r\n            react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__.Trigger, { asChild: true },\r\n                react__WEBPACK_IMPORTED_MODULE_6___default().createElement(reactflow__WEBPACK_IMPORTED_MODULE_5__.Handle, __assign({ id: io.id }, props))),\r\n            react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__.Portal, null,\r\n                react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__.Content, { className: \"iotooltipcontent\", sideOffset: 5 },\r\n                    react__WEBPACK_IMPORTED_MODULE_6___default().createElement(\"div\", { className: \"iotooltip_container\" },\r\n                        react__WEBPACK_IMPORTED_MODULE_6___default().createElement(\"div\", { className: \"iotooltip_header\" },\r\n                            locked ? (react__WEBPACK_IMPORTED_MODULE_6___default().createElement((_mui_icons_material_Lock__WEBPACK_IMPORTED_MODULE_2___default()), { onClick: function () { return setLocked(false); } })) : (react__WEBPACK_IMPORTED_MODULE_6___default().createElement((_mui_icons_material_LockOpen__WEBPACK_IMPORTED_MODULE_1___default()), { onClick: function () { return setLocked(true); } })),\r\n                            overlayhandle && (react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_dialog__WEBPACK_IMPORTED_MODULE_7__[\"default\"], { trigger: react__WEBPACK_IMPORTED_MODULE_6___default().createElement((_mui_icons_material_Fullscreen__WEBPACK_IMPORTED_MODULE_3___default()), null), onOpenChange: function (open) {\r\n                                    if (open) {\r\n                                        io.try_get_full_value();\r\n                                    }\r\n                                    setLocked(open);\r\n                                } }, overlayhandle({ io: io })))),\r\n                        pvhandle\r\n                            ? pvhandle({ io: io })\r\n                            : \"no preview available for \\\"\".concat(typestring, \"\\\"\")),\r\n                    react__WEBPACK_IMPORTED_MODULE_6___default().createElement(_radix_ui_react_tooltip__WEBPACK_IMPORTED_MODULE_0__.Arrow, { className: \"iotooltipcontentarrow\" }))))));\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/io/io.tsx?");
 
 /***/ }),
 
@@ -256,7 +306,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \********************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../.. */ \"./src/frontend/index.tsx\");\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! reactflow */ \"reactflow\");\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(reactflow__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _io__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./io */ \"./src/frontend/node/io/io.tsx\");\n/* harmony import */ var _default_input_renderer__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./default_input_renderer */ \"./src/frontend/node/io/default_input_renderer.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\nvar Inputrenderer = {};\r\nvar register_input_renderer = function (type, renderer) {\r\n    Inputrenderer[type] = renderer;\r\n};\r\nregister_input_renderer('float', _default_input_renderer__WEBPACK_IMPORTED_MODULE_4__.FloatInput);\r\nregister_input_renderer('int', _default_input_renderer__WEBPACK_IMPORTED_MODULE_4__.IntegerInput);\r\nregister_input_renderer('bool', _default_input_renderer__WEBPACK_IMPORTED_MODULE_4__.BooleanInput);\r\nregister_input_renderer('string', _default_input_renderer__WEBPACK_IMPORTED_MODULE_4__.StringInput);\r\nregister_input_renderer('str', _default_input_renderer__WEBPACK_IMPORTED_MODULE_4__.StringInput);\r\nregister_input_renderer('color', _default_input_renderer__WEBPACK_IMPORTED_MODULE_4__.ColorInput);\r\nregister_input_renderer('select', _default_input_renderer__WEBPACK_IMPORTED_MODULE_4__.SelectionInput);\r\nregister_input_renderer('enum', _default_input_renderer__WEBPACK_IMPORTED_MODULE_4__.SelectionInput);\r\nvar INPUTCONVERTER = {\r\n    '': function (v) { return v; },\r\n    str_to_json: function (v) {\r\n        return JSON.parse(v);\r\n    },\r\n    str_to_list: function (v) {\r\n        try {\r\n            var a = JSON.parse(v);\r\n            if (Array.isArray(a))\r\n                return a;\r\n            return [a];\r\n        }\r\n        catch (e) {\r\n            try {\r\n                return JSON.parse('[' + v + ']');\r\n            }\r\n            catch (e) { }\r\n        }\r\n        throw new Error('Invalid list');\r\n    }\r\n};\r\nvar NodeInput = function (_a) {\r\n    var _b, _c, _d;\r\n    var io = _a.io;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var render = fnrf_zst.render_options();\r\n    if (io.render_options === undefined) {\r\n        io.render_options = {};\r\n    }\r\n    if (io.render_options.set_default === undefined) {\r\n        io.render_options.set_default = true;\r\n    }\r\n    var _e = (0,_io__WEBPACK_IMPORTED_MODULE_3__.pick_best_io_type)(io.type, render.typemap || {}), typestring = _e[0], otypestring = _e[1];\r\n    var Input = typestring\r\n        ? ((_b = io.value_options) === null || _b === void 0 ? void 0 : _b.options)\r\n            ? _default_input_renderer__WEBPACK_IMPORTED_MODULE_4__.SelectionInput\r\n            : Inputrenderer[typestring]\r\n        : undefined;\r\n    var inputconverterf = INPUTCONVERTER[(_d = (otypestring && ((_c = render.inputconverter) === null || _c === void 0 ? void 0 : _c[otypestring]))) !== null && _d !== void 0 ? _d : ''];\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'nodeinput' },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_io__WEBPACK_IMPORTED_MODULE_3__.HandleWithPreview, { io: io, typestring: typestring, position: reactflow__WEBPACK_IMPORTED_MODULE_2__.Position.Left, type: 'target' }),\r\n        Input && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'iovaluefield nodrag' },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, { io: io, inputconverter: inputconverterf }))),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'ioname' }, io.name)));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (NodeInput);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/io/nodeinput.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../.. */ \"./src/frontend/index.tsx\");\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! reactflow */ \"reactflow\");\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(reactflow__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _io__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./io */ \"./src/frontend/node/io/io.tsx\");\n/* harmony import */ var _default_input_renderer__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./default_input_renderer */ \"./src/frontend/node/io/default_input_renderer.tsx\");\n/* harmony import */ var _datarenderer_rendermappings__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../datarenderer/rendermappings */ \"./src/frontend/datarenderer/rendermappings.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar INPUTCONVERTER = {\r\n    \"\": [function (v) { return v; }, function (v) { return v; }],\r\n    str_to_json: [\r\n        function (v) {\r\n            return JSON.parse(v);\r\n        },\r\n        function (v) {\r\n            if (typeof v === \"string\")\r\n                return v;\r\n            return JSON.stringify(v);\r\n        },\r\n    ],\r\n    str_to_list: [\r\n        function (v) {\r\n            try {\r\n                var a = JSON.parse(v);\r\n                if (Array.isArray(a))\r\n                    return a;\r\n                return [a];\r\n            }\r\n            catch (e) {\r\n                try {\r\n                    return JSON.parse(\"[\" + v + \"]\");\r\n                }\r\n                catch (e) { }\r\n            }\r\n            throw new Error(\"Invalid list\");\r\n        },\r\n        function (v) { return JSON.stringify(v); },\r\n    ]\r\n};\r\nvar NodeInput = function (_a) {\r\n    var _b, _c, _d;\r\n    var io = _a.io;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_1__.FuncNodesContext);\r\n    var render = fnrf_zst.render_options();\r\n    var _e = (0,_io__WEBPACK_IMPORTED_MODULE_3__.pick_best_io_type)(io.render_options.type, render.typemap || {}), typestring = _e[0], otypestring = _e[1];\r\n    var Inputrenderer = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_datarenderer_rendermappings__WEBPACK_IMPORTED_MODULE_5__.RenderMappingContext).Inputrenderer;\r\n    var Input = typestring\r\n        ? ((_b = io.value_options) === null || _b === void 0 ? void 0 : _b.options)\r\n            ? _default_input_renderer__WEBPACK_IMPORTED_MODULE_4__.SelectionInput\r\n            : Inputrenderer[typestring]\r\n        : undefined;\r\n    var inputconverterf = INPUTCONVERTER[(_d = (otypestring && ((_c = render.inputconverter) === null || _c === void 0 ? void 0 : _c[otypestring]))) !== null && _d !== void 0 ? _d : \"\"];\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"nodeinput\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_io__WEBPACK_IMPORTED_MODULE_3__.HandleWithPreview, { io: io, typestring: typestring, position: reactflow__WEBPACK_IMPORTED_MODULE_2__.Position.Left, type: \"target\" }),\r\n        Input && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"iovaluefield nodrag\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, { io: io, inputconverter: inputconverterf }))),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"ioname\" }, io.name)));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (NodeInput);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/io/nodeinput.tsx?");
 
 /***/ }),
 
@@ -266,7 +316,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \*********************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! reactflow */ \"reactflow\");\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(reactflow__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../.. */ \"./src/frontend/index.tsx\");\n/* harmony import */ var _io__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./io */ \"./src/frontend/node/io/io.tsx\");\n/* harmony import */ var _default_output_render__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./default_output_render */ \"./src/frontend/node/io/default_output_render.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\nvar NodeOutput = function (_a) {\r\n    var io = _a.io;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    var render = fnrf_zst.render_options();\r\n    var typestring = (0,_io__WEBPACK_IMPORTED_MODULE_3__.pick_best_io_type)(io.type, render.typemap || {})[0];\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'nodeoutput' },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_io__WEBPACK_IMPORTED_MODULE_3__.HandleWithPreview, { io: io, typestring: typestring, position: reactflow__WEBPACK_IMPORTED_MODULE_1__.Position.Right, type: 'source' }),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'ioname' }, io.name),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'iovaluefield' },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_default_output_render__WEBPACK_IMPORTED_MODULE_4__.InLineOutput, { io: io }))));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (NodeOutput);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/io/nodeoutput.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! reactflow */ \"reactflow\");\n/* harmony import */ var reactflow__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(reactflow__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../.. */ \"./src/frontend/index.tsx\");\n/* harmony import */ var _io__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./io */ \"./src/frontend/node/io/io.tsx\");\n/* harmony import */ var _default_output_render__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./default_output_render */ \"./src/frontend/node/io/default_output_render.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\nvar NodeOutput = function (_a) {\r\n    var io = _a.io;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_2__.FuncNodesContext);\r\n    var render = fnrf_zst.render_options();\r\n    var typestring = (0,_io__WEBPACK_IMPORTED_MODULE_3__.pick_best_io_type)(io.type, render.typemap || {})[0];\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"nodeoutput\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_io__WEBPACK_IMPORTED_MODULE_3__.HandleWithPreview, { io: io, typestring: typestring, position: reactflow__WEBPACK_IMPORTED_MODULE_1__.Position.Right, type: \"source\" }),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"ioname\" }, io.name),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"iovaluefield\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_default_output_render__WEBPACK_IMPORTED_MODULE_4__.InLineOutput, { io: io }))));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (NodeOutput);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/io/nodeoutput.tsx?");
 
 /***/ }),
 
@@ -276,7 +326,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @mui/icons-material/ExpandLess */ \"@mui/icons-material/ExpandLess\");\n/* harmony import */ var _mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _mui_icons_material_Lan__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @mui/icons-material/Lan */ \"@mui/icons-material/Lan\");\n/* harmony import */ var _mui_icons_material_Lan__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_Lan__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _mui_icons_material_PlayCircleFilled__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @mui/icons-material/PlayCircleFilled */ \"@mui/icons-material/PlayCircleFilled\");\n/* harmony import */ var _mui_icons_material_PlayCircleFilled__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_PlayCircleFilled__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _node_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./node.scss */ \"./src/frontend/node/node.scss\");\n/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! .. */ \"./src/frontend/index.tsx\");\n/* harmony import */ var _io__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./io */ \"./src/frontend/node/io/index.tsx\");\n/* harmony import */ var _io_handle_renderer__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./io/handle_renderer */ \"./src/frontend/node/io/handle_renderer.tsx\");\n/* harmony import */ var _dialog__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../dialog */ \"./src/frontend/dialog.tsx\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar NodeHeader = function (_a) {\r\n    var node_data = _a.node_data;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_5__.FuncNodesContext);\r\n    var clicktrigger = function () {\r\n        fnrf_zst.on_node_action({\r\n            type: 'trigger',\r\n            from_remote: false,\r\n            id: node_data.id\r\n        });\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'nodeheader' },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'nodeheader_element' },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement((_mui_icons_material_PlayCircleFilled__WEBPACK_IMPORTED_MODULE_3___default()), { fontSize: 'inherit', className: 'triggerbutton', onClick: clicktrigger }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement((_mui_icons_material_Lan__WEBPACK_IMPORTED_MODULE_2___default()), { fontSize: 'inherit' })),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'nodeheader_element nodeheader_title' },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'nodeheader_title_text' }, node_data.node_name)),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'nodeheader_element' },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement((_mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_1___default()), { fontSize: 'inherit' }))));\r\n};\r\nvar NodeDataRenderer = function (_a) {\r\n    var _b, _c, _d, _e;\r\n    var node_data = _a.node_data;\r\n    var io = ((_c = (_b = node_data.render_options) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.src)\r\n        ? node_data.io[(_e = (_d = node_data.render_options) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.src]\r\n        : undefined;\r\n    var pvhandle = io && (0,_io_handle_renderer__WEBPACK_IMPORTED_MODULE_7__.PreviewHandleDataRendererForIo)(io);\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'nodrag' }, pvhandle && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dialog__WEBPACK_IMPORTED_MODULE_8__[\"default\"], { trigger: react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, pvhandle({ io: io })), onOpenChange: function (open) {\r\n            if (open) {\r\n                io === null || io === void 0 ? void 0 : io.try_get_full_value();\r\n            }\r\n        } }, pvhandle({ io: io })))));\r\n};\r\nvar NodeBody = function (_a) {\r\n    var _b, _c;\r\n    var node_data = _a.node_data;\r\n    var inputs = Object.values(node_data.io).filter(function (io) { return io.is_input; });\r\n    var outputs = Object.values(node_data.io).filter(function (io) { return !io.is_input; });\r\n    if ((_c = (_b = node_data.render_options) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.src) {\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'nodebody' },\r\n        outputs.map(function (io) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_io__WEBPACK_IMPORTED_MODULE_6__.NodeOutput, { key: io.id, io: io })); }),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NodeDataRenderer, { node_data: node_data }),\r\n        inputs.map(function (io) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_io__WEBPACK_IMPORTED_MODULE_6__.NodeInput, { key: io.id, io: io })); })));\r\n};\r\nvar NodeName = function (_a) {\r\n    var node_data = _a.node_data;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(node_data.name), name = _b[0], setName = _b[1];\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        setName(node_data.name);\r\n    }, [node_data]);\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_5__.FuncNodesContext);\r\n    var handleChange = function (event) {\r\n        setName(event.target.value);\r\n    };\r\n    var finalSetName = function (e) {\r\n        var new_name = e.target.value;\r\n        fnrf_zst.on_node_action({\r\n            type: 'update',\r\n            from_remote: false,\r\n            id: node_data.id,\r\n            node: { name: new_name }\r\n        });\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { className: 'nodename_input', value: name, onChange: handleChange, onBlur: finalSetName }));\r\n};\r\nvar NodeFooter = function (_a) {\r\n    var node_data = _a.node_data;\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'nodefooter' }, node_data.error && react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'nodeerror' }, node_data.error)));\r\n};\r\n/**\r\n * A generic function to deeply merge two objects of type T.\r\n *\r\n * @param {T} target - The target object to be merged.\r\n * @param {DeepPartial<T>} source - The source object to merge into the target. All properties of this object are optional.\r\n *\r\n * @returns {Object} An object containing the merged object (new_obj) and a boolean indicating if there was a change (change).\r\n *\r\n * @throws {Type 'string' cannot be used to index type 'T'} This error is ignored using the @ts-ignore directive because we are dynamically accessing properties of a generic type T.\r\n */\r\nvar DefaultNode = function (_a) {\r\n    var data = _a.data;\r\n    // Use the NodeStore to get the data for the node.\r\n    var storedata = data.UseNodeStore();\r\n    var collapsed = storedata.frontend.collapsed || true;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false), visualTrigger = _b[0], setVisualTrigger = _b[1];\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        var timeoutId;\r\n        // When in_trigger becomes true, set visualTrigger to true immediately\r\n        if (storedata.in_trigger) {\r\n            setVisualTrigger(true);\r\n        }\r\n        else if (visualTrigger) {\r\n            // When in_trigger becomes false, wait for a minimum duration before setting visualTrigger to false\r\n            timeoutId = setTimeout(function () { return setVisualTrigger(false); }, 200); // 50ms or any other duration you see fit\r\n        }\r\n        return function () { return clearTimeout(timeoutId); }; // Cleanup timeout on component unmount or state changes\r\n    }, [storedata.in_trigger, visualTrigger]);\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null,\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'innernode' +\r\n                (visualTrigger ? ' intrigger' : '') +\r\n                (storedata.error ? ' error' : '') },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NodeHeader, { node_data: storedata }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NodeName, { node_data: storedata }),\r\n            collapsed ? null : react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NodeBody, { node_data: storedata }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NodeFooter, { node_data: storedata }))));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (DefaultNode);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/node.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @mui/icons-material/ExpandLess */ \"@mui/icons-material/ExpandLess\");\n/* harmony import */ var _mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _mui_icons_material_Lan__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @mui/icons-material/Lan */ \"@mui/icons-material/Lan\");\n/* harmony import */ var _mui_icons_material_Lan__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_Lan__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _mui_icons_material_PlayCircleFilled__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @mui/icons-material/PlayCircleFilled */ \"@mui/icons-material/PlayCircleFilled\");\n/* harmony import */ var _mui_icons_material_PlayCircleFilled__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_mui_icons_material_PlayCircleFilled__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _node_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./node.scss */ \"./src/frontend/node/node.scss\");\n/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! .. */ \"./src/frontend/index.tsx\");\n/* harmony import */ var _io__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./io */ \"./src/frontend/node/io/index.tsx\");\n/* harmony import */ var _dialog__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../dialog */ \"./src/frontend/dialog.tsx\");\n/* harmony import */ var _body_data_renderer__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./body_data_renderer */ \"./src/frontend/node/body_data_renderer.tsx\");\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\r\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n    return new (P || (P = Promise))(function (resolve, reject) {\r\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n    });\r\n};\r\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\r\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n    function verb(n) { return function (v) { return step([n, v]); }; }\r\n    function step(op) {\r\n        if (f) throw new TypeError(\"Generator is already executing.\");\r\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\r\n            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;\r\n            if (y = 0, t) op = [op[0] & 2, t.value];\r\n            switch (op[0]) {\r\n                case 0: case 1: t = op; break;\r\n                case 4: _.label++; return { value: op[1], done: false };\r\n                case 5: _.label++; y = op[1]; op = [0]; continue;\r\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n                default:\r\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n                    if (t[2]) _.ops.pop();\r\n                    _.trys.pop(); continue;\r\n            }\r\n            op = body.call(thisArg, _);\r\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n    }\r\n};\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar NodeHeader = function (_a) {\r\n    var node_data = _a.node_data;\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_5__.FuncNodesContext);\r\n    var clicktrigger = function () {\r\n        fnrf_zst.on_node_action({\r\n            type: \"trigger\",\r\n            from_remote: false,\r\n            id: node_data.id\r\n        });\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"nodeheader\" },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"nodeheader_element\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement((_mui_icons_material_PlayCircleFilled__WEBPACK_IMPORTED_MODULE_3___default()), { fontSize: \"inherit\", className: \"triggerbutton\", onClick: clicktrigger }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement((_mui_icons_material_Lan__WEBPACK_IMPORTED_MODULE_2___default()), { fontSize: \"inherit\", onClick: function () { return __awaiter(void 0, void 0, void 0, function () {\r\n                    var _a, _b;\r\n                    var _c;\r\n                    return __generator(this, function (_d) {\r\n                        switch (_d.label) {\r\n                            case 0:\r\n                                console.log(\"get_node_status\");\r\n                                _b = (_a = console).log;\r\n                                return [4 /*yield*/, ((_c = fnrf_zst.worker) === null || _c === void 0 ? void 0 : _c.get_node_status(node_data.id))];\r\n                            case 1:\r\n                                _b.apply(_a, [_d.sent()]);\r\n                                return [2 /*return*/];\r\n                        }\r\n                    });\r\n                }); } })),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"nodeheader_element nodeheader_title\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"nodeheader_title_text\" }, node_data.node_name)),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"nodeheader_element\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement((_mui_icons_material_ExpandLess__WEBPACK_IMPORTED_MODULE_1___default()), { fontSize: \"inherit\" }))));\r\n};\r\nvar NodeDataRenderer = function (_a) {\r\n    var _b, _c, _d, _e;\r\n    var node_data = _a.node_data;\r\n    var io = ((_c = (_b = node_data.render_options) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.src)\r\n        ? node_data.io[(_e = (_d = node_data.render_options) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.src]\r\n        : undefined;\r\n    var _f = io\r\n        ? (0,_body_data_renderer__WEBPACK_IMPORTED_MODULE_8__.BodyDataRendererForIo)(io)\r\n        : [undefined, undefined], pvhandle = _f[0], overlayhandle = _f[1];\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"nodrag nodedatabody\" }, pvhandle && io && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dialog__WEBPACK_IMPORTED_MODULE_7__[\"default\"], { trigger: react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, pvhandle({ io: io })), onOpenChange: function (open) {\r\n            if (open) {\r\n                io === null || io === void 0 ? void 0 : io.try_get_full_value();\r\n            }\r\n        } }, overlayhandle({ io: io })))));\r\n};\r\nvar NodeBody = function (_a) {\r\n    var _b, _c;\r\n    var node_data = _a.node_data;\r\n    var inputs = Object.values(node_data.io).filter(function (io) { return io.is_input; });\r\n    var outputs = Object.values(node_data.io).filter(function (io) { return !io.is_input; });\r\n    if ((_c = (_b = node_data.render_options) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.src) {\r\n    }\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"nodebody\" },\r\n        outputs.map(function (io) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_io__WEBPACK_IMPORTED_MODULE_6__.NodeOutput, { key: io.id, io: io })); }),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NodeDataRenderer, { node_data: node_data }),\r\n        inputs.map(function (io) { return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_io__WEBPACK_IMPORTED_MODULE_6__.NodeInput, { key: io.id, io: io })); })));\r\n};\r\nvar NodeName = function (_a) {\r\n    var node_data = _a.node_data;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(node_data.name), name = _b[0], setName = _b[1];\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        setName(node_data.name);\r\n    }, [node_data]);\r\n    var fnrf_zst = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(___WEBPACK_IMPORTED_MODULE_5__.FuncNodesContext);\r\n    var handleChange = function (event) {\r\n        setName(event.target.value);\r\n    };\r\n    var finalSetName = function (e) {\r\n        var new_name = e.target.value;\r\n        fnrf_zst.on_node_action({\r\n            type: \"update\",\r\n            from_remote: false,\r\n            id: node_data.id,\r\n            node: { name: new_name }\r\n        });\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { className: \"nodename_input\", value: name, onChange: handleChange, onBlur: finalSetName }));\r\n};\r\nvar NodeFooter = function (_a) {\r\n    var node_data = _a.node_data;\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"nodefooter\" }, node_data.error && react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"nodeerror\" }, node_data.error)));\r\n};\r\n/**\r\n * A generic function to deeply merge two objects of type T.\r\n *\r\n * @param {T} target - The target object to be merged.\r\n * @param {DeepPartial<T>} source - The source object to merge into the target. All properties of this object are optional.\r\n *\r\n * @returns {Object} An object containing the merged object (new_obj) and a boolean indicating if there was a change (change).\r\n *\r\n * @throws {Type 'string' cannot be used to index type 'T'} This error is ignored using the @ts-ignore directive because we are dynamically accessing properties of a generic type T.\r\n */\r\nvar DefaultNode = function (_a) {\r\n    var data = _a.data;\r\n    // Use the NodeStore to get the data for the node.\r\n    var storedata = data.UseNodeStore();\r\n    var collapsed = storedata.frontend.collapsed || false;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false), visualTrigger = _b[0], setVisualTrigger = _b[1];\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        var timeoutId;\r\n        // When in_trigger becomes true, set visualTrigger to true immediately\r\n        if (storedata.in_trigger) {\r\n            setVisualTrigger(true);\r\n        }\r\n        else if (visualTrigger) {\r\n            // When in_trigger becomes false, wait for a minimum duration before setting visualTrigger to false\r\n            timeoutId = setTimeout(function () { return setVisualTrigger(false); }, 200); // 50ms or any other duration you see fit\r\n        }\r\n        return function () { return clearTimeout(timeoutId); }; // Cleanup timeout on component unmount or state changes\r\n    }, [storedata.in_trigger, visualTrigger]);\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null,\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"innernode\" +\r\n                (visualTrigger ? \" intrigger\" : \"\") +\r\n                (storedata.error ? \" error\" : \"\") },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NodeHeader, { node_data: storedata }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NodeName, { node_data: storedata }),\r\n            collapsed ? null : react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NodeBody, { node_data: storedata }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NodeFooter, { node_data: storedata }))));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (DefaultNode);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/node/node.tsx?");
 
 /***/ }),
 
@@ -286,7 +336,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \********************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   HSLColorPicker: () => (/* binding */ HSLColorPicker),\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @radix-ui/react-popover */ \"@radix-ui/react-popover\");\n/* harmony import */ var _radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var color_convert__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! color-convert */ \"color-convert\");\n/* harmony import */ var color_convert__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(color_convert__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _colorpicker_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./colorpicker.scss */ \"./src/frontend/utils/colorpicker.scss\");\n\r\n\r\n\r\n\r\nvar create_color_converter = function (type, data) {\r\n    if (!Array.isArray(data))\r\n        data = [data];\r\n    if (data[0] === undefined || data[0] === null)\r\n        return create_color_converter('rgb', [0, 0, 0]);\r\n    // @ts-ignore\r\n    var source = (color_convert__WEBPACK_IMPORTED_MODULE_2___default())[type];\r\n    if (!source)\r\n        throw new Error('Unsupported color type: ' + type);\r\n    source[type] = function () { return data; };\r\n    var checkrgb = source.rgb(data);\r\n    if (!Array.isArray(checkrgb))\r\n        return create_color_converter('rgb', [0, 0, 0]);\r\n    if (checkrgb[0] === undefined || checkrgb[0] === null)\r\n        return create_color_converter('rgb', [0, 0, 0]);\r\n    var checkhsl = source.hsl(data);\r\n    if (!Array.isArray(checkhsl))\r\n        return create_color_converter('rgb', [0, 0, 0]);\r\n    if (checkhsl[0] === undefined || checkhsl[0] === null)\r\n        return create_color_converter('rgb', [0, 0, 0]);\r\n    var converter = {};\r\n    Object.keys(source).forEach(function (key) {\r\n        var entry = source[key];\r\n        //check if entry is a function\r\n        if (typeof entry === 'function') {\r\n            converter[key] = function () { return entry.apply(null, data); };\r\n        }\r\n    });\r\n    return converter;\r\n};\r\nvar HSLColorPicker = function (_a) {\r\n    var onChange = _a.onChange, colorconverter = _a.colorconverter;\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(colorconverter), converter = _b[0], setConverter = _b[1];\r\n    var hsl = converter.hsl();\r\n    var rgb = converter.rgb();\r\n    var hsv = converter.hsv();\r\n    var hex = converter.hex();\r\n    var colorStyle = {\r\n        backgroundColor: \"hsl(\".concat(hsl[0], \", \").concat(hsl[1], \"%, \").concat(hsl[2], \"%)\"),\r\n        padding: '10px',\r\n        margin: '10px 0'\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { style: { backgroundColor: 'white' } },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { style: colorStyle }, \"Color Preview\"),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'colorspace' },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'colorspace_title' }, \"RGB\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Red\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: 'range', min: '0', max: '255', value: rgb[0], onChange: function (e) {\r\n                    var newrgb = [parseInt(e.target.value), rgb[1], rgb[2]];\r\n                    var newconverter = create_color_converter('rgb', newrgb);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: { background: \"linear-gradient(to right, #000, #f00)\" } }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Green\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: 'range', min: '0', max: '255', value: rgb[1], onChange: function (e) {\r\n                    var newrgb = [rgb[0], parseInt(e.target.value), rgb[2]];\r\n                    var newconverter = create_color_converter('rgb', newrgb);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: { background: \"linear-gradient(to right, #000, #0f0)\" } }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Blue\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: 'range', min: '0', max: '255', value: rgb[2], onChange: function (e) {\r\n                    var newrgb = [rgb[0], rgb[1], parseInt(e.target.value)];\r\n                    var newconverter = create_color_converter('rgb', newrgb);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: { background: \"linear-gradient(to right, #000, #00f)\" } })),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'colorspace' },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'colorspace_title' }, \"HSL\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Hue\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: 'range', min: '0', max: '360', value: hsl[0], onChange: function (e) {\r\n                    var newhsl = [parseInt(e.target.value), hsl[1], hsl[2]];\r\n                    var newconverter = create_color_converter('hsl', newhsl);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: {\r\n                    background: \"linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)\"\r\n                } }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Saturation\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: 'range', min: '0', max: '100', value: hsl[1], onChange: function (e) {\r\n                    var newhsl = [hsl[0], parseInt(e.target.value), hsl[2]];\r\n                    var newconverter = create_color_converter('hsl', newhsl);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: {\r\n                    background: \"linear-gradient(to right, #fff, hsl(\".concat(hsl[0], \", 100%, 50%))\")\r\n                } }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Lightness\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: 'range', min: '0', max: '100', value: hsl[2], onChange: function (e) {\r\n                    var newhsl = [hsl[0], hsl[1], parseInt(e.target.value)];\r\n                    var newconverter = create_color_converter('hsl', newhsl);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: {\r\n                    background: \"linear-gradient(to right, #000, hsl(\".concat(hsl[0], \", 100%, 50%), #fff)\")\r\n                } })),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'colorspace' },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'colorspace_title' }, \"HSV\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Hue\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: 'range', min: '0', max: '360', value: hsv[0], onChange: function (e) {\r\n                    var newhsv = [parseInt(e.target.value), hsv[1], hsv[2]];\r\n                    var newconverter = create_color_converter('hsv', newhsv);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: {\r\n                    background: \"linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)\"\r\n                } }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Saturation\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: 'range', min: '0', max: '100', value: hsv[1], onChange: function (e) {\r\n                    var newhsv = [hsv[0], parseInt(e.target.value), hsv[2]];\r\n                    var newconverter = create_color_converter('hsv', newhsv);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: {\r\n                    background: \"linear-gradient(to right, #fff, hsl(\".concat(hsl[0], \", 100%, 50%))\")\r\n                } }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Value\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: 'range', min: '0', max: '100', value: hsv[2], onChange: function (e) {\r\n                    var newhsv = [hsv[0], hsv[1], parseInt(e.target.value)];\r\n                    var newconverter = create_color_converter('hsv', newhsv);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: {\r\n                    background: \"linear-gradient(to right, #000, hsl(\".concat(hsl[0], \", 100%, 50%))\")\r\n                } })),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'colorspace' },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: 'colorspace_title' }, \"HEX\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: 'text', value: hex, onChange: function (e) {\r\n                    var newconverter = create_color_converter('hex', [e.target.value]);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                } }))));\r\n};\r\nvar CustomColorPicker = function (_a) {\r\n    var inicolordata = _a.inicolordata, _b = _a.inicolorspace, inicolorspace = _b === void 0 ? 'hex' : _b, onChange = _a.onChange;\r\n    if (inicolordata === undefined) {\r\n        inicolordata = [0, 0, 0];\r\n        inicolorspace = 'rgb';\r\n    }\r\n    if (!Array.isArray(inicolordata))\r\n        inicolordata = [inicolordata];\r\n    var iniconverter = create_color_converter(inicolorspace, inicolordata);\r\n    if (iniconverter.rgb() === undefined)\r\n        iniconverter = create_color_converter('rgb', [0, 0, 0]);\r\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(iniconverter), color = _c[0], setColor = _c[1];\r\n    var innerSetColor = function (colorconverter) {\r\n        setColor(colorconverter);\r\n        if (onChange)\r\n            onChange(colorconverter);\r\n    };\r\n    var style = {\r\n        background: '#' + color.hex(),\r\n        borderRadius: '0.3rem',\r\n        width: '2rem',\r\n        height: '1rem'\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1__.Root, null,\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1__.Trigger, { asChild: true },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { style: style })),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1__.Portal, null,\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1__.Content, { side: 'left' },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(HSLColorPicker, { onChange: innerSetColor, colorconverter: color })))));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (CustomColorPicker);\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/utils/colorpicker.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   HSLColorPicker: () => (/* binding */ HSLColorPicker),\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @radix-ui/react-popover */ \"@radix-ui/react-popover\");\n/* harmony import */ var _radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var color_convert__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! color-convert */ \"color-convert\");\n/* harmony import */ var color_convert__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(color_convert__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _colorpicker_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./colorpicker.scss */ \"./src/frontend/utils/colorpicker.scss\");\n\r\n\r\n\r\n\r\nvar create_color_converter = function (type, data) {\r\n    if (!Array.isArray(data))\r\n        data = [data];\r\n    if (data[0] === undefined || data[0] === null)\r\n        return create_color_converter(\"rgb\", [0, 0, 0]);\r\n    // @ts-ignore\r\n    var source = (color_convert__WEBPACK_IMPORTED_MODULE_2___default())[type];\r\n    if (!source)\r\n        throw new Error(\"Unsupported color type: \" + type);\r\n    source[type] = function () { return data; };\r\n    var checkrgb = source.rgb(data);\r\n    if (!Array.isArray(checkrgb))\r\n        return create_color_converter(\"rgb\", [0, 0, 0]);\r\n    if (checkrgb[0] === undefined || checkrgb[0] === null)\r\n        return create_color_converter(\"rgb\", [0, 0, 0]);\r\n    var checkhsl = source.hsl(data);\r\n    if (!Array.isArray(checkhsl))\r\n        return create_color_converter(\"rgb\", [0, 0, 0]);\r\n    if (checkhsl[0] === undefined || checkhsl[0] === null)\r\n        return create_color_converter(\"rgb\", [0, 0, 0]);\r\n    var converter = {};\r\n    Object.keys(source).forEach(function (key) {\r\n        var entry = source[key];\r\n        //check if entry is a function\r\n        if (typeof entry === \"function\") {\r\n            converter[key] = function () { return entry.apply(null, data); };\r\n        }\r\n    });\r\n    return converter;\r\n};\r\nvar HSLColorPicker = function (_a) {\r\n    var onChange = _a.onChange, colorconverter = _a.colorconverter, _b = _a.allow_null, allow_null = _b === void 0 ? false : _b;\r\n    if (colorconverter === null && !allow_null)\r\n        throw new Error(\"Color converter is null\");\r\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(colorconverter), converter = _c[0], setConverter = _c[1];\r\n    var _d = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)([0, 0, 0]), hsl = _d[0], setHsl = _d[1];\r\n    var _e = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)([0, 0, 0]), rgb = _e[0], setRgb = _e[1];\r\n    var _f = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)([0, 0, 0]), hsv = _f[0], setHsv = _f[1];\r\n    var _g = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(\"000\"), hex = _g[0], setHex = _g[1];\r\n    // const hsl = converter.hsl() as number[];\r\n    // const rgb = converter.rgb() as number[];\r\n    // const hsv = converter.hsv() as number[];\r\n    // const hex = converter.hex() as string;\r\n    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\r\n        if (!converter) {\r\n            if (!allow_null)\r\n                throw new Error(\"Color converter is null\");\r\n            setRgb([0, 0, 0]);\r\n            setHsl([0, 0, 0]);\r\n            setHsv([0, 0, 0]);\r\n            setHex(\"\");\r\n            return;\r\n        }\r\n        setHsl(converter.hsl());\r\n        setRgb(converter.rgb());\r\n        setHsv(converter.hsv());\r\n        setHex(converter.hex());\r\n    }, [converter]);\r\n    var colorStyle = {\r\n        backgroundColor: \"hsl(\".concat(hsl[0], \", \").concat(hsl[1], \"%, \").concat(hsl[2], \"%)\"),\r\n        padding: \"10px\",\r\n        margin: \"10px 0\"\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { style: { backgroundColor: \"white\" } },\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { style: colorStyle }, \"Color Preview\"),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"colorspace\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"colorspace_title\" }, \"RGB\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Red\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"range\", min: \"0\", max: \"255\", value: rgb[0], onChange: function (e) {\r\n                    var newrgb = [parseInt(e.target.value), rgb[1], rgb[2]];\r\n                    var newconverter = create_color_converter(\"rgb\", newrgb);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: { background: \"linear-gradient(to right, #000, #f00)\" } }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Green\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"range\", min: \"0\", max: \"255\", value: rgb[1], onChange: function (e) {\r\n                    var newrgb = [rgb[0], parseInt(e.target.value), rgb[2]];\r\n                    var newconverter = create_color_converter(\"rgb\", newrgb);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: { background: \"linear-gradient(to right, #000, #0f0)\" } }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Blue\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"range\", min: \"0\", max: \"255\", value: rgb[2], onChange: function (e) {\r\n                    var newrgb = [rgb[0], rgb[1], parseInt(e.target.value)];\r\n                    var newconverter = create_color_converter(\"rgb\", newrgb);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: { background: \"linear-gradient(to right, #000, #00f)\" } })),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"colorspace\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"colorspace_title\" }, \"HSL\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Hue\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"range\", min: \"0\", max: \"360\", value: hsl[0], onChange: function (e) {\r\n                    var newhsl = [parseInt(e.target.value), hsl[1], hsl[2]];\r\n                    var newconverter = create_color_converter(\"hsl\", newhsl);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: {\r\n                    background: \"linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)\"\r\n                } }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Saturation\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"range\", min: \"0\", max: \"100\", value: hsl[1], onChange: function (e) {\r\n                    var newhsl = [hsl[0], parseInt(e.target.value), hsl[2]];\r\n                    var newconverter = create_color_converter(\"hsl\", newhsl);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: {\r\n                    background: \"linear-gradient(to right, #fff, hsl(\".concat(hsl[0], \", 100%, 50%))\")\r\n                } }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Lightness\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"range\", min: \"0\", max: \"100\", value: hsl[2], onChange: function (e) {\r\n                    var newhsl = [hsl[0], hsl[1], parseInt(e.target.value)];\r\n                    var newconverter = create_color_converter(\"hsl\", newhsl);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: {\r\n                    background: \"linear-gradient(to right, #000, hsl(\".concat(hsl[0], \", 100%, 50%), #fff)\")\r\n                } })),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"colorspace\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"colorspace_title\" }, \"HSV\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Hue\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"range\", min: \"0\", max: \"360\", value: hsv[0], onChange: function (e) {\r\n                    var newhsv = [parseInt(e.target.value), hsv[1], hsv[2]];\r\n                    var newconverter = create_color_converter(\"hsv\", newhsv);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: {\r\n                    background: \"linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)\"\r\n                } }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Saturation\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"range\", min: \"0\", max: \"100\", value: hsv[1], onChange: function (e) {\r\n                    var newhsv = [hsv[0], parseInt(e.target.value), hsv[2]];\r\n                    var newconverter = create_color_converter(\"hsv\", newhsv);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: {\r\n                    background: \"linear-gradient(to right, #fff, hsl(\".concat(hsl[0], \", 100%, 50%))\")\r\n                } }),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"label\", null, \"Value\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"range\", min: \"0\", max: \"100\", value: hsv[2], onChange: function (e) {\r\n                    var newhsv = [hsv[0], hsv[1], parseInt(e.target.value)];\r\n                    var newconverter = create_color_converter(\"hsv\", newhsv);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                }, style: {\r\n                    background: \"linear-gradient(to right, #000, hsl(\".concat(hsl[0], \", 100%, 50%))\")\r\n                } })),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"colorspace\" },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", { className: \"colorspace_title\" }, \"HEX\"),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null),\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"input\", { type: \"text\", value: hex, onChange: function (e) {\r\n                    var newconverter = e.target.value === \"\"\r\n                        ? null\r\n                        : create_color_converter(\"hex\", [e.target.value]);\r\n                    setConverter(newconverter);\r\n                    onChange(newconverter);\r\n                } }))));\r\n};\r\nvar CustomColorPicker = function (_a) {\r\n    var inicolordata = _a.inicolordata, _b = _a.inicolorspace, inicolorspace = _b === void 0 ? \"hex\" : _b, _c = _a.allow_null, allow_null = _c === void 0 ? false : _c, onChange = _a.onChange;\r\n    if (inicolordata === undefined) {\r\n        inicolordata = [0, 0, 0];\r\n        inicolorspace = \"rgb\";\r\n    }\r\n    if (!Array.isArray(inicolordata))\r\n        inicolordata = [inicolordata];\r\n    var iniconverter = create_color_converter(inicolorspace, inicolordata);\r\n    if (iniconverter.rgb() === undefined)\r\n        iniconverter = create_color_converter(\"rgb\", [0, 0, 0]);\r\n    var _d = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(iniconverter), color = _d[0], setColor = _d[1];\r\n    var innerSetColor = function (colorconverter) {\r\n        if (colorconverter === null && !allow_null)\r\n            throw new Error(\"Color is null\");\r\n        if (colorconverter !== null)\r\n            setColor(colorconverter);\r\n        if (onChange)\r\n            onChange(colorconverter);\r\n    };\r\n    var style = {\r\n        background: \"#\" + color.hex(),\r\n        borderRadius: \"0.3rem\",\r\n        width: \"2rem\",\r\n        height: \"1rem\"\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1__.Root, null,\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1__.Trigger, { asChild: true },\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"button\", { style: style })),\r\n        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1__.Portal, null,\r\n            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_1__.Content, { side: \"left\" },\r\n                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(HSLColorPicker, { onChange: innerSetColor, colorconverter: color, allow_null: allow_null })))));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (CustomColorPicker);\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/utils/colorpicker.tsx?");
 
 /***/ }),
 
@@ -300,13 +350,23 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 
 /***/ }),
 
+/***/ "./src/frontend/utils/select.tsx":
+/*!***************************************!*\
+  !*** ./src/frontend/utils/select.tsx ***!
+  \***************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_select__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-select */ \"react-select\");\n/* harmony import */ var react_select__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_select__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _select_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./select.scss */ \"./src/frontend/utils/select.scss\");\nvar __assign = (undefined && undefined.__assign) || function () {\r\n    __assign = Object.assign || function(t) {\r\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n            s = arguments[i];\r\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\r\n                t[p] = s[p];\r\n        }\r\n        return t;\r\n    };\r\n    return __assign.apply(this, arguments);\r\n};\r\n\r\n\r\n\r\nvar CustomSelect = function (_a) {\r\n    var options = _a.options, _b = _a.items_per_page, items_per_page = _b === void 0 ? 20 : _b, className = _a.className, defaultValue = _a.defaultValue, onChange = _a.onChange;\r\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(\"\"), searchInput = _c[0], setSearchInput = _c[1];\r\n    var _d = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(0), currentPage = _d[0], setCurrentPage = _d[1];\r\n    var handleInputChange = function (inputValue) {\r\n        setSearchInput(inputValue.toLowerCase());\r\n        setCurrentPage(0);\r\n    };\r\n    var filteredOptions = options.filter(function (option) {\r\n        return (option.label.toLowerCase().includes(searchInput) ||\r\n            option.value.toLowerCase().includes(searchInput));\r\n    });\r\n    var paginatedOptions = filteredOptions.slice(currentPage * items_per_page, (currentPage + 1) * items_per_page);\r\n    var customStyles = {\r\n        control: function (base) { return (__assign(__assign({}, base), { minHeight: undefined })); }\r\n    };\r\n    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react_select__WEBPACK_IMPORTED_MODULE_1___default()), { options: paginatedOptions, onInputChange: handleInputChange, onChange: onChange, inputValue: searchInput, isSearchable: true, placeholder: \"Select an option...\", \r\n        //   menuIsOpen={true}\r\n        className: className, unstyled: true, styles: customStyles, classNamePrefix: \"styled-select\", defaultValue: defaultValue }));\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (CustomSelect);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/utils/select.tsx?");
+
+/***/ }),
+
 /***/ "./src/frontend/utils/table.tsx":
 /*!**************************************!*\
   !*** ./src/frontend/utils/table.tsx ***!
   \**************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   SortableTable: () => (/* binding */ SortableTable)\n/* harmony export */ });\n/* harmony import */ var _mui_material_Table__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @mui/material/Table */ \"@mui/material/Table\");\n/* harmony import */ var _mui_material_Table__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_mui_material_Table__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _mui_material_TableBody__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @mui/material/TableBody */ \"@mui/material/TableBody\");\n/* harmony import */ var _mui_material_TableBody__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_mui_material_TableBody__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _mui_material_TableCell__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @mui/material/TableCell */ \"@mui/material/TableCell\");\n/* harmony import */ var _mui_material_TableCell__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_mui_material_TableCell__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _mui_material_TableContainer__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @mui/material/TableContainer */ \"@mui/material/TableContainer\");\n/* harmony import */ var _mui_material_TableContainer__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_mui_material_TableContainer__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _mui_material_TableHead__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @mui/material/TableHead */ \"@mui/material/TableHead\");\n/* harmony import */ var _mui_material_TableHead__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_mui_material_TableHead__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _mui_material_TableRow__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @mui/material/TableRow */ \"@mui/material/TableRow\");\n/* harmony import */ var _mui_material_TableRow__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_mui_material_TableRow__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var _mui_material_TableSortLabel__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @mui/material/TableSortLabel */ \"@mui/material/TableSortLabel\");\n/* harmony import */ var _mui_material_TableSortLabel__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_mui_material_TableSortLabel__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_7__);\n/* harmony import */ var _table_scss__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./table.scss */ \"./src/frontend/utils/table.scss\");\nvar __spreadArray = (undefined && undefined.__spreadArray) || function (to, from, pack) {\r\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\r\n        if (ar || !(i in from)) {\r\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\r\n            ar[i] = from[i];\r\n        }\r\n    }\r\n    return to.concat(ar || Array.prototype.slice.call(from));\r\n};\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar transform_table_data = function (data) {\r\n    var rows = [];\r\n    if (data === undefined) {\r\n        // return empty table if data is undefined\r\n        return {\r\n            header: [],\r\n            rows: []\r\n        };\r\n    }\r\n    if (data.data === undefined) {\r\n        // if data.data is undefined, make it empty\r\n        data.data = [];\r\n    }\r\n    if (data.columns === undefined) {\r\n        // if np columns are defined, create columns based on the first row\r\n        // if data is empty, there are no columns\r\n        if (data.data.length === 0) {\r\n            data.columns = [];\r\n        }\r\n        else {\r\n            // create columns based on the first row\r\n            data.columns = data.data[0].map(function (_, i) { return \"col\".concat(i); });\r\n        }\r\n    }\r\n    if (data.index === undefined) {\r\n        // if no index is defined, create index based on the number of rows\r\n        data.index = data.data.map(function (_, i) { return \"row\".concat(i); });\r\n    }\r\n    for (var i = 0; i < data.index.length; i++) {\r\n        var row = [data.index[i]];\r\n        for (var j = 0; j < data.columns.length; j++) {\r\n            row.push(data.data[i][j]);\r\n        }\r\n        rows.push(row);\r\n    }\r\n    return {\r\n        header: __spreadArray(['index'], data.columns, true),\r\n        rows: rows\r\n    };\r\n};\r\nvar SortableTable = function (_a) {\r\n    var tabledata = _a.tabledata;\r\n    // State to manage the sorted column and direction\r\n    var transformed_table_data = (0,react__WEBPACK_IMPORTED_MODULE_7__.useMemo)(function () { return transform_table_data(tabledata); }, [tabledata]);\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_7__.useState)('asc'), orderDirection = _b[0], setOrderDirection = _b[1];\r\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_7__.useState)('index'), orderBy = _c[0], setOrderBy = _c[1];\r\n    var order_by_index = transformed_table_data.header.indexOf(orderBy);\r\n    if (order_by_index === -1) {\r\n        order_by_index = 0;\r\n    }\r\n    // Function to handle sorting\r\n    var handleSort = function (column) {\r\n        var isAsc = orderBy === column && orderDirection === 'asc';\r\n        setOrderDirection(isAsc ? 'desc' : 'asc');\r\n        setOrderBy(column);\r\n    };\r\n    // Function to sort data\r\n    var sortData = function (data, comparator) {\r\n        var stabilizedThis = data.map(function (el, index) { return [\r\n            el,\r\n            index\r\n        ]; });\r\n        stabilizedThis.sort(function (a, b) {\r\n            var order = comparator(a[0], b[0]);\r\n            return order;\r\n        });\r\n        return stabilizedThis.map(function (el) { return el[0]; });\r\n    };\r\n    // Comparator function for sorting\r\n    var getComparator = function (order, _orderBy) {\r\n        return order === 'desc'\r\n            ? function (a, b) { return (b[order_by_index] < a[order_by_index] ? -1 : 1); }\r\n            : function (a, b) { return (a[order_by_index] < b[order_by_index] ? -1 : 1); };\r\n    };\r\n    // Sort the rows\r\n    var sortedRows = sortData(transformed_table_data.rows, getComparator(orderDirection, orderBy));\r\n    return (react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableContainer__WEBPACK_IMPORTED_MODULE_3___default()), { className: 'tablecontainer' },\r\n        react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_Table__WEBPACK_IMPORTED_MODULE_0___default()), { size: 'small' },\r\n            react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableHead__WEBPACK_IMPORTED_MODULE_4___default()), { className: 'tableHead' },\r\n                react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableRow__WEBPACK_IMPORTED_MODULE_5___default()), { className: 'tableheadercolor' }, transformed_table_data.header.map(function (column) { return (react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableCell__WEBPACK_IMPORTED_MODULE_2___default()), { key: column, sortDirection: orderBy === column ? orderDirection : false, className: 'tableheadercolor' },\r\n                    react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableSortLabel__WEBPACK_IMPORTED_MODULE_6___default()), { active: orderBy === column, direction: orderBy === column ? orderDirection : 'asc', onClick: function () { return handleSort(column); }, className: 'tableheadercolor', sx: {\r\n                            '& .MuiTableSortLabel-icon': {\r\n                                color: 'inherit !important'\r\n                            }\r\n                        } }, column))); }))),\r\n            react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableBody__WEBPACK_IMPORTED_MODULE_1___default()), null, sortedRows.map(function (row, index) { return (react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableRow__WEBPACK_IMPORTED_MODULE_5___default()), { key: tabledata.index[index] }, row.map(function (cell, i) { return (react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableCell__WEBPACK_IMPORTED_MODULE_2___default()), { key: i, className: i == 0 ? 'indexcol' : 'datacol' }, cell)); }))); })))));\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/utils/table.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   SortableTable: () => (/* binding */ SortableTable)\n/* harmony export */ });\n/* harmony import */ var _mui_material_Table__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @mui/material/Table */ \"@mui/material/Table\");\n/* harmony import */ var _mui_material_Table__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_mui_material_Table__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _mui_material_TableBody__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @mui/material/TableBody */ \"@mui/material/TableBody\");\n/* harmony import */ var _mui_material_TableBody__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_mui_material_TableBody__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _mui_material_TableCell__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @mui/material/TableCell */ \"@mui/material/TableCell\");\n/* harmony import */ var _mui_material_TableCell__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_mui_material_TableCell__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _mui_material_TableContainer__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @mui/material/TableContainer */ \"@mui/material/TableContainer\");\n/* harmony import */ var _mui_material_TableContainer__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_mui_material_TableContainer__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _mui_material_TableHead__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @mui/material/TableHead */ \"@mui/material/TableHead\");\n/* harmony import */ var _mui_material_TableHead__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_mui_material_TableHead__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _mui_material_TableRow__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @mui/material/TableRow */ \"@mui/material/TableRow\");\n/* harmony import */ var _mui_material_TableRow__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_mui_material_TableRow__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var _mui_material_TableSortLabel__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @mui/material/TableSortLabel */ \"@mui/material/TableSortLabel\");\n/* harmony import */ var _mui_material_TableSortLabel__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_mui_material_TableSortLabel__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_7__);\n/* harmony import */ var _table_scss__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./table.scss */ \"./src/frontend/utils/table.scss\");\nvar __spreadArray = (undefined && undefined.__spreadArray) || function (to, from, pack) {\r\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\r\n        if (ar || !(i in from)) {\r\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\r\n            ar[i] = from[i];\r\n        }\r\n    }\r\n    return to.concat(ar || Array.prototype.slice.call(from));\r\n};\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar transform_table_data = function (data) {\r\n    var rows = [];\r\n    if (data === undefined) {\r\n        // return empty table if data is undefined\r\n        return {\r\n            header: [],\r\n            rows: []\r\n        };\r\n    }\r\n    if (data.data === undefined) {\r\n        // if data.data is undefined, make it empty\r\n        data.data = [];\r\n    }\r\n    if (data.columns === undefined) {\r\n        // if np columns are defined, create columns based on the first row\r\n        // if data is empty, there are no columns\r\n        if (data.data.length === 0) {\r\n            data.columns = [];\r\n        }\r\n        else {\r\n            // create columns based on the first row\r\n            data.columns = data.data[0].map(function (_, i) { return \"col\".concat(i); });\r\n        }\r\n    }\r\n    if (data.index === undefined) {\r\n        // if no index is defined, create index based on the number of rows\r\n        data.index = data.data.map(function (_, i) { return \"row\".concat(i); });\r\n    }\r\n    for (var i = 0; i < data.index.length; i++) {\r\n        var row = [data.index[i]];\r\n        for (var j = 0; j < data.columns.length; j++) {\r\n            row.push(data.data[i][j]);\r\n        }\r\n        rows.push(row);\r\n    }\r\n    return {\r\n        header: __spreadArray([\"index\"], data.columns, true),\r\n        rows: rows\r\n    };\r\n};\r\nvar SortableTable = function (_a) {\r\n    var tabledata = _a.tabledata;\r\n    // State to manage the sorted column and direction\r\n    var transformed_table_data = (0,react__WEBPACK_IMPORTED_MODULE_7__.useMemo)(function () { return transform_table_data(tabledata); }, [tabledata]);\r\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_7__.useState)(\"asc\"), orderDirection = _b[0], setOrderDirection = _b[1];\r\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_7__.useState)(\"index\"), orderBy = _c[0], setOrderBy = _c[1];\r\n    var order_by_index = transformed_table_data.header.indexOf(orderBy);\r\n    if (order_by_index === -1) {\r\n        order_by_index = 0;\r\n    }\r\n    // Function to handle sorting\r\n    var handleSort = function (column) {\r\n        var isAsc = orderBy === column && orderDirection === \"asc\";\r\n        setOrderDirection(isAsc ? \"desc\" : \"asc\");\r\n        setOrderBy(column);\r\n    };\r\n    // Function to sort data\r\n    var sortData = function (data, comparator) {\r\n        var stabilizedThis = data.map(function (el, index) { return [\r\n            el,\r\n            index,\r\n        ]; });\r\n        stabilizedThis.sort(function (a, b) {\r\n            var order = comparator(a[0], b[0]);\r\n            return order;\r\n        });\r\n        return stabilizedThis.map(function (el) { return el[0]; });\r\n    };\r\n    // Comparator function for sorting\r\n    var getComparator = function (order, _orderBy) {\r\n        return order === \"desc\"\r\n            ? function (a, b) { return (b[order_by_index] < a[order_by_index] ? -1 : 1); }\r\n            : function (a, b) { return (a[order_by_index] < b[order_by_index] ? -1 : 1); };\r\n    };\r\n    // Sort the rows\r\n    var sortedRows = sortData(transformed_table_data.rows, getComparator(orderDirection, orderBy));\r\n    return (react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableContainer__WEBPACK_IMPORTED_MODULE_3___default()), { className: \"tablecontainer\" },\r\n        react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_Table__WEBPACK_IMPORTED_MODULE_0___default()), { size: \"small\" },\r\n            react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableHead__WEBPACK_IMPORTED_MODULE_4___default()), { className: \"tableHead\" },\r\n                react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableRow__WEBPACK_IMPORTED_MODULE_5___default()), { className: \"tableheadercolor\" }, transformed_table_data.header.map(function (column) { return (react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableCell__WEBPACK_IMPORTED_MODULE_2___default()), { key: column, sortDirection: orderBy === column ? orderDirection : false, className: \"tableheadercolor\" },\r\n                    react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableSortLabel__WEBPACK_IMPORTED_MODULE_6___default()), { active: orderBy === column, direction: orderBy === column ? orderDirection : \"asc\", onClick: function () { return handleSort(column); }, className: \"tableheadercolor\", sx: {\r\n                            \"& .MuiTableSortLabel-icon\": {\r\n                                color: \"inherit !important\"\r\n                            }\r\n                        } }, column))); }))),\r\n            react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableBody__WEBPACK_IMPORTED_MODULE_1___default()), null, sortedRows.map(function (row, index) { return (react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableRow__WEBPACK_IMPORTED_MODULE_5___default()), { key: tabledata.index[index] }, row.map(function (cell, i) { return (react__WEBPACK_IMPORTED_MODULE_7___default().createElement((_mui_material_TableCell__WEBPACK_IMPORTED_MODULE_2___default()), { key: i, className: i == 0 ? \"indexcol\" : \"datacol\" }, cell)); }))); })))));\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/frontend/utils/table.tsx?");
 
 /***/ }),
 
@@ -316,7 +376,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \******************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var uuid__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! uuid */ \"uuid\");\n/* harmony import */ var uuid__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(uuid__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar __assign = (undefined && undefined.__assign) || function () {\r\n    __assign = Object.assign || function(t) {\r\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n            s = arguments[i];\r\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\r\n                t[p] = s[p];\r\n        }\r\n        return t;\r\n    };\r\n    return __assign.apply(this, arguments);\r\n};\r\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\r\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n    return new (P || (P = Promise))(function (resolve, reject) {\r\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n    });\r\n};\r\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\r\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n    function verb(n) { return function (v) { return step([n, v]); }; }\r\n    function step(op) {\r\n        if (f) throw new TypeError(\"Generator is already executing.\");\r\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\r\n            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;\r\n            if (y = 0, t) op = [op[0] & 2, t.value];\r\n            switch (op[0]) {\r\n                case 0: case 1: t = op; break;\r\n                case 4: _.label++; return { value: op[1], done: false };\r\n                case 5: _.label++; y = op[1]; op = [0]; continue;\r\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n                default:\r\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n                    if (t[2]) _.ops.pop();\r\n                    _.trys.pop(); continue;\r\n            }\r\n            op = body.call(thisArg, _);\r\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n    }\r\n};\r\n\r\n\r\nvar FuncNodesWorker = /** @class */ (function () {\r\n    function FuncNodesWorker(data) {\r\n        var _this = this;\r\n        this.uuid = data.uuid;\r\n        this.on_error = data.on_error || console.error;\r\n        this.messagePromises = new Map();\r\n        this._zustand = data.zustand;\r\n        this._nodeupdates = new Map();\r\n        this._nodeupdatetimer = setTimeout(function () {\r\n            _this.perform_update();\r\n        }, 1000);\r\n        this.is_open = true;\r\n    }\r\n    FuncNodesWorker.prototype.fullsync = function () {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var resp, nodeview, _i, _a, node, _b, _c, edge;\r\n            return __generator(this, function (_d) {\r\n                switch (_d.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({ cmd: 'full_state' })];\r\n                    case 1:\r\n                        resp = (_d.sent());\r\n                        console.log('Full state', resp);\r\n                        this._zustand.lib.libstate.getState().set(resp.backend.lib);\r\n                        if (resp.view.renderoptions)\r\n                            this._zustand.update_render_options(resp.view.renderoptions);\r\n                        nodeview = resp.view.nodes;\r\n                        for (_i = 0, _a = resp.backend.nodes; _i < _a.length; _i++) {\r\n                            node = _a[_i];\r\n                            if (nodeview[node.id] !== undefined) {\r\n                                node.frontend = nodeview[node.id];\r\n                            }\r\n                            this._recieve_node_added(node);\r\n                        }\r\n                        for (_b = 0, _c = resp.backend.edges; _b < _c.length; _b++) {\r\n                            edge = _c[_b];\r\n                            this._recieve_edge_added.apply(this, edge);\r\n                        }\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype._recieve_edge_added = function (src_nid, src_ioid, trg_nid, trg_ioid) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                this._zustand.on_edge_action(__assign({ type: 'add', from_remote: true }, { src_nid: src_nid, src_ioid: src_ioid, trg_nid: trg_nid, trg_ioid: trg_ioid }));\r\n                return [2 /*return*/];\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.trigger_node = function (node_id) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: 'trigger_node',\r\n                            kwargs: { nid: node_id },\r\n                            wait_for_response: false\r\n                        })];\r\n                    case 1:\r\n                        _a.sent();\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.add_node = function (node_id) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var resp;\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: 'add_node',\r\n                            kwargs: { id: node_id }\r\n                        })];\r\n                    case 1:\r\n                        resp = _a.sent();\r\n                        this._recieve_node_added(resp);\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.remove_node = function (node_id) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: 'remove_node',\r\n                            kwargs: { id: node_id }\r\n                        })];\r\n                    case 1:\r\n                        _a.sent();\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype._recieve_node_added = function (data) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                this._zustand.on_node_action({\r\n                    type: 'add',\r\n                    node: data,\r\n                    id: data.id,\r\n                    from_remote: true\r\n                });\r\n                return [2 /*return*/];\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.add_edge = function (_a) {\r\n        var src_nid = _a.src_nid, src_ioid = _a.src_ioid, trg_nid = _a.trg_nid, trg_ioid = _a.trg_ioid, _b = _a.replace, replace = _b === void 0 ? false : _b;\r\n        return this._send_cmd({\r\n            cmd: 'add_edge',\r\n            kwargs: { src_nid: src_nid, src_ioid: src_ioid, trg_nid: trg_nid, trg_ioid: trg_ioid, replace: replace }\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.remove_edge = function (_a) {\r\n        var src_nid = _a.src_nid, src_ioid = _a.src_ioid, trg_nid = _a.trg_nid, trg_ioid = _a.trg_ioid;\r\n        return this._send_cmd({\r\n            cmd: 'remove_edge',\r\n            kwargs: { src_nid: src_nid, src_ioid: src_ioid, trg_nid: trg_nid, trg_ioid: trg_ioid }\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.perform_update = function () {\r\n        var _this = this;\r\n        clearTimeout(this._nodeupdatetimer);\r\n        this._nodeupdates.forEach(function (node, id) { return __awaiter(_this, void 0, void 0, function () {\r\n            var ans;\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: 'update_node',\r\n                            kwargs: { nid: id, data: node },\r\n                            wait_for_response: true\r\n                        })];\r\n                    case 1:\r\n                        ans = _a.sent();\r\n                        this._zustand.on_node_action({\r\n                            type: 'update',\r\n                            node: ans,\r\n                            id: id,\r\n                            from_remote: true\r\n                        });\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        }); });\r\n        this._nodeupdates.clear();\r\n        this._nodeupdatetimer = setTimeout(function () {\r\n            _this.perform_update();\r\n        }, 1000);\r\n    };\r\n    FuncNodesWorker.prototype.update_node = function (action) {\r\n        // Add the type to the parameter\r\n        var currentstate = this._nodeupdates.get(action.id);\r\n        if (currentstate) {\r\n            var _a = (0,_utils__WEBPACK_IMPORTED_MODULE_1__.deep_merge)(currentstate, action.node), new_obj = _a.new_obj, change = _a.change;\r\n            if (change) {\r\n                this._nodeupdates.set(action.id, new_obj);\r\n            }\r\n        }\r\n        else {\r\n            this._nodeupdates.set(action.id, action.node);\r\n        }\r\n        if (action.immediate) {\r\n            this.perform_update();\r\n        }\r\n    };\r\n    FuncNodesWorker.prototype.set_io_value = function (_a) {\r\n        var nid = _a.nid, ioid = _a.ioid, value = _a.value, set_default = _a.set_default;\r\n        return this._send_cmd({\r\n            cmd: 'set_io_value',\r\n            kwargs: { nid: nid, ioid: ioid, value: value, set_default: set_default },\r\n            wait_for_response: true\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.clear = function () {\r\n        return this._send_cmd({ cmd: 'clear' });\r\n    };\r\n    FuncNodesWorker.prototype.save = function () {\r\n        return this._send_cmd({ cmd: 'save', wait_for_response: true });\r\n    };\r\n    FuncNodesWorker.prototype.load = function (data) {\r\n        var _this = this;\r\n        return this._send_cmd({\r\n            cmd: 'load_data',\r\n            kwargs: { data: data },\r\n            wait_for_response: true\r\n        }).then(function () {\r\n            _this.fullsync();\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.get_io_value = function (_a) {\r\n        var nid = _a.nid, ioid = _a.ioid;\r\n        return this._send_cmd({\r\n            cmd: 'get_io_value',\r\n            kwargs: { nid: nid, ioid: ioid },\r\n            wait_for_response: true\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype._send_cmd = function (_a) {\r\n        var cmd = _a.cmd, kwargs = _a.kwargs, _b = _a.wait_for_response, wait_for_response = _b === void 0 ? true : _b, _c = _a.response_timeout, response_timeout = _c === void 0 ? 5000 : _c;\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var msg, msid_1, promise;\r\n            var _this = this;\r\n            return __generator(this, function (_d) {\r\n                switch (_d.label) {\r\n                    case 0:\r\n                        msg = {\r\n                            type: 'cmd',\r\n                            cmd: cmd,\r\n                            kwargs: kwargs || {}\r\n                        };\r\n                        if (!wait_for_response) return [3 /*break*/, 2];\r\n                        msid_1 = msg.id || (0,uuid__WEBPACK_IMPORTED_MODULE_0__.v4)();\r\n                        msg.id = msid_1;\r\n                        promise = new Promise(function (resolve, reject) {\r\n                            var timeout = setTimeout(function () {\r\n                                reject('Timeout');\r\n                            }, response_timeout);\r\n                            _this.messagePromises.set(msid_1, {\r\n                                resolve: function (data) {\r\n                                    clearTimeout(timeout);\r\n                                    resolve(data);\r\n                                    _this.messagePromises[\"delete\"](msid_1);\r\n                                },\r\n                                reject: function (err) {\r\n                                    clearTimeout(timeout);\r\n                                    reject(err);\r\n                                    _this.messagePromises[\"delete\"](msid_1);\r\n                                }\r\n                            });\r\n                        });\r\n                        return [4 /*yield*/, this.send(msg)];\r\n                    case 1:\r\n                        _d.sent();\r\n                        return [2 /*return*/, promise];\r\n                    case 2: return [2 /*return*/, this.send(msg)];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.send = function (_data) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                // this is the abstract method that should be implemented by subclasses\r\n                throw new Error('Not implemented');\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.recieve_nodespace_event = function (_a) {\r\n        var event = _a.event, data = _a.data;\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var _b, _c;\r\n            return __generator(this, function (_d) {\r\n                switch (event) {\r\n                    case 'after_set_value':\r\n                        return [2 /*return*/, this._zustand.on_node_action({\r\n                                type: 'update',\r\n                                node: {\r\n                                    id: data.node,\r\n                                    io: (_b = {},\r\n                                        _b[data.io] = {\r\n                                            value: data.result\r\n                                        },\r\n                                        _b)\r\n                                },\r\n                                id: data.node,\r\n                                from_remote: true\r\n                            })];\r\n                    case 'after_update_value_options':\r\n                        return [2 /*return*/, this._zustand.on_node_action({\r\n                                type: 'update',\r\n                                node: {\r\n                                    id: data.node,\r\n                                    io: (_c = {},\r\n                                        _c[data.io] = {\r\n                                            value_options: data.result\r\n                                        },\r\n                                        _c)\r\n                                },\r\n                                id: data.node,\r\n                                from_remote: true\r\n                            })];\r\n                    case 'triggerstart':\r\n                        return [2 /*return*/, this._zustand.on_node_action({\r\n                                type: 'update',\r\n                                node: {\r\n                                    id: data.node,\r\n                                    in_trigger: true\r\n                                },\r\n                                id: data.node,\r\n                                from_remote: true\r\n                            })];\r\n                    case 'triggerdone':\r\n                        return [2 /*return*/, this._zustand.on_node_action({\r\n                                type: 'update',\r\n                                node: {\r\n                                    id: data.node,\r\n                                    in_trigger: false\r\n                                },\r\n                                id: data.node,\r\n                                from_remote: true\r\n                            })];\r\n                    case 'node_trigger_error':\r\n                        return [2 /*return*/, this._zustand.on_node_action({\r\n                                type: 'error',\r\n                                errortype: 'trigger',\r\n                                error: data.error,\r\n                                id: data.node,\r\n                                from_remote: true\r\n                            })];\r\n                    case 'node_removed':\r\n                        return [2 /*return*/, this._zustand.on_node_action({\r\n                                type: 'delete',\r\n                                id: data.node,\r\n                                from_remote: true\r\n                            })];\r\n                    case 'node_added':\r\n                        return [2 /*return*/, this._recieve_node_added(data.node)];\r\n                    case 'after_disconnect':\r\n                        if (!data.result)\r\n                            return [2 /*return*/];\r\n                        if (!Array.isArray(data.result))\r\n                            return [2 /*return*/];\r\n                        if (data.result.length !== 4)\r\n                            return [2 /*return*/];\r\n                        return [2 /*return*/, this._zustand.on_edge_action({\r\n                                type: 'delete',\r\n                                from_remote: true,\r\n                                src_nid: data.result[0],\r\n                                src_ioid: data.result[1],\r\n                                trg_nid: data.result[2],\r\n                                trg_ioid: data.result[3]\r\n                            })];\r\n                    case 'after_connect':\r\n                        if (!data.result)\r\n                            return [2 /*return*/];\r\n                        if (!Array.isArray(data.result))\r\n                            return [2 /*return*/];\r\n                        if (data.result.length !== 4)\r\n                            return [2 /*return*/];\r\n                        return [2 /*return*/, this._recieve_edge_added.apply(this, data.result)];\r\n                    case 'after_add_shelf':\r\n                        if (!data.result)\r\n                            return [2 /*return*/];\r\n                        return [2 /*return*/, this._zustand.lib.libstate.getState().set(data.result)];\r\n                    default:\r\n                        console.warn('Unhandled nodepsace event', event, data);\r\n                        break;\r\n                }\r\n                return [2 /*return*/];\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.add_lib = function (lib) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var ans;\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: 'add_shelf',\r\n                            kwargs: { src: lib },\r\n                            wait_for_response: false\r\n                        })];\r\n                    case 1:\r\n                        ans = _a.sent();\r\n                        return [2 /*return*/, ans];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.recieve = function (data) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var promise, _a;\r\n            return __generator(this, function (_b) {\r\n                switch (_b.label) {\r\n                    case 0:\r\n                        _a = data.type;\r\n                        switch (_a) {\r\n                            case 'nsevent': return [3 /*break*/, 1];\r\n                            case 'result': return [3 /*break*/, 3];\r\n                            case 'error': return [3 /*break*/, 4];\r\n                            case 'progress': return [3 /*break*/, 5];\r\n                        }\r\n                        return [3 /*break*/, 6];\r\n                    case 1: return [4 /*yield*/, this.recieve_nodespace_event(data)];\r\n                    case 2: return [2 /*return*/, _b.sent()];\r\n                    case 3:\r\n                        promise = data.id && this.messagePromises.get(data.id);\r\n                        if (promise) {\r\n                            return [2 /*return*/, promise.resolve(data.result)];\r\n                        }\r\n                        return [3 /*break*/, 7];\r\n                    case 4:\r\n                        this.on_error(data.tb + '\\n' + data.error);\r\n                        promise = data.id && this.messagePromises.get(data.id);\r\n                        if (promise) {\r\n                            return [2 /*return*/, promise.reject(data.error)];\r\n                        }\r\n                        return [3 /*break*/, 7];\r\n                    case 5:\r\n                        this._zustand.set_progress(data);\r\n                        return [3 /*break*/, 7];\r\n                    case 6:\r\n                        console.warn('Unhandled message', data);\r\n                        return [3 /*break*/, 7];\r\n                    case 7: return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.disconnect = function () { };\r\n    FuncNodesWorker.prototype.onclose = function () {\r\n        this.is_open = false;\r\n        this._zustand.auto_progress();\r\n    };\r\n    FuncNodesWorker.prototype.reconnect = function () {\r\n        return __awaiter(this, void 0, void 0, function () { return __generator(this, function (_a) {\r\n            return [2 /*return*/];\r\n        }); });\r\n    };\r\n    FuncNodesWorker.prototype.stop = function () {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var oldonclose;\r\n            var _this = this;\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({ cmd: 'stop_worker', wait_for_response: false })];\r\n                    case 1:\r\n                        _a.sent();\r\n                        oldonclose = this.onclose.bind(this);\r\n                        this.onclose = function () {\r\n                            oldonclose();\r\n                            if (_this._zustand.worker === _this) {\r\n                                _this._zustand.clear_all();\r\n                            }\r\n                            _this.onclose = oldonclose;\r\n                        };\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.get_io_full_value = function (_a) {\r\n        var nid = _a.nid, ioid = _a.ioid;\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var res;\r\n            var _b;\r\n            return __generator(this, function (_c) {\r\n                switch (_c.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: 'get_io_full_value',\r\n                            kwargs: { nid: nid, ioid: ioid },\r\n                            wait_for_response: true\r\n                        })\r\n                        //console.log(\"Full value\", res);\r\n                    ];\r\n                    case 1:\r\n                        res = _c.sent();\r\n                        //console.log(\"Full value\", res);\r\n                        this._zustand.on_node_action({\r\n                            type: 'update',\r\n                            node: {\r\n                                io: (_b = {},\r\n                                    _b[ioid] = {\r\n                                        fullvalue: res\r\n                                    },\r\n                                    _b)\r\n                            },\r\n                            id: nid,\r\n                            from_remote: true\r\n                        });\r\n                        return [2 /*return*/, res];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    return FuncNodesWorker;\r\n}());\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FuncNodesWorker);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/funcnodes/funcnodesworker.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var uuid__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! uuid */ \"uuid\");\n/* harmony import */ var uuid__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(uuid__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\nvar __assign = (undefined && undefined.__assign) || function () {\r\n    __assign = Object.assign || function(t) {\r\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n            s = arguments[i];\r\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\r\n                t[p] = s[p];\r\n        }\r\n        return t;\r\n    };\r\n    return __assign.apply(this, arguments);\r\n};\r\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\r\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n    return new (P || (P = Promise))(function (resolve, reject) {\r\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n    });\r\n};\r\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\r\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n    function verb(n) { return function (v) { return step([n, v]); }; }\r\n    function step(op) {\r\n        if (f) throw new TypeError(\"Generator is already executing.\");\r\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\r\n            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;\r\n            if (y = 0, t) op = [op[0] & 2, t.value];\r\n            switch (op[0]) {\r\n                case 0: case 1: t = op; break;\r\n                case 4: _.label++; return { value: op[1], done: false };\r\n                case 5: _.label++; y = op[1]; op = [0]; continue;\r\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n                default:\r\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n                    if (t[2]) _.ops.pop();\r\n                    _.trys.pop(); continue;\r\n            }\r\n            op = body.call(thisArg, _);\r\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n    }\r\n};\r\n\r\n\r\nvar FuncNodesWorker = /** @class */ (function () {\r\n    function FuncNodesWorker(data) {\r\n        var _this = this;\r\n        this.uuid = data.uuid;\r\n        this.on_error = data.on_error || console.error;\r\n        this.messagePromises = new Map();\r\n        this._local_nodeupdates = new Map();\r\n        this._nodeupdatetimer = setTimeout(function () {\r\n            _this.sync_local_node_updates();\r\n        }, 1000);\r\n        this.is_open = true;\r\n        if (data.zustand)\r\n            this.set_zustand(data.zustand);\r\n    }\r\n    FuncNodesWorker.prototype.set_zustand = function (zustand) {\r\n        this._zustand = zustand;\r\n        this._zustand.auto_progress();\r\n        this.fullsync();\r\n    };\r\n    FuncNodesWorker.prototype.fullsync = function () {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var resp, e_1, nodeview, _i, _a, node, _b, _c, edge;\r\n            return __generator(this, function (_d) {\r\n                switch (_d.label) {\r\n                    case 0:\r\n                        if (!this._zustand)\r\n                            return [2 /*return*/];\r\n                        if (!this.is_open)\r\n                            return [2 /*return*/];\r\n                        _d.label = 1;\r\n                    case 1:\r\n                        if (false) {}\r\n                        _d.label = 2;\r\n                    case 2:\r\n                        _d.trys.push([2, 4, , 5]);\r\n                        return [4 /*yield*/, this._send_cmd({ cmd: \"full_state\" })];\r\n                    case 3:\r\n                        resp = (_d.sent());\r\n                        return [3 /*break*/, 6];\r\n                    case 4:\r\n                        e_1 = _d.sent();\r\n                        console.error(\"Error in fullsync\", e_1);\r\n                        return [3 /*break*/, 5];\r\n                    case 5: return [3 /*break*/, 1];\r\n                    case 6:\r\n                        console.log(\"Full state\", resp);\r\n                        this._zustand.lib.libstate.getState().set({\r\n                            lib: resp.backend.lib,\r\n                            external_worker: resp.worker_dependencies\r\n                        });\r\n                        if (resp.view.renderoptions)\r\n                            this._zustand.update_render_options(resp.view.renderoptions);\r\n                        nodeview = resp.view.nodes;\r\n                        for (_i = 0, _a = resp.backend.nodes; _i < _a.length; _i++) {\r\n                            node = _a[_i];\r\n                            if (nodeview[node.id] !== undefined) {\r\n                                node.frontend = nodeview[node.id];\r\n                            }\r\n                            this._recieve_node_added(node);\r\n                        }\r\n                        for (_b = 0, _c = resp.backend.edges; _b < _c.length; _b++) {\r\n                            edge = _c[_b];\r\n                            this._recieve_edge_added.apply(this, edge);\r\n                        }\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype._recieve_edge_added = function (src_nid, src_ioid, trg_nid, trg_ioid) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                if (!this._zustand)\r\n                    return [2 /*return*/];\r\n                this._zustand.on_edge_action(__assign({ type: \"add\", from_remote: true }, { src_nid: src_nid, src_ioid: src_ioid, trg_nid: trg_nid, trg_ioid: trg_ioid }));\r\n                return [2 /*return*/];\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.trigger_node = function (node_id) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: \"trigger_node\",\r\n                            kwargs: { nid: node_id },\r\n                            wait_for_response: false\r\n                        })];\r\n                    case 1:\r\n                        _a.sent();\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.add_node = function (node_id) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var resp;\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: \"add_node\",\r\n                            kwargs: { id: node_id }\r\n                        })];\r\n                    case 1:\r\n                        resp = _a.sent();\r\n                        this._recieve_node_added(resp);\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.remove_node = function (node_id) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: \"remove_node\",\r\n                            kwargs: { id: node_id }\r\n                        })];\r\n                    case 1:\r\n                        _a.sent();\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype._recieve_node_added = function (data) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                if (!this._zustand)\r\n                    return [2 /*return*/];\r\n                this._zustand.on_node_action({\r\n                    type: \"add\",\r\n                    node: data,\r\n                    id: data.id,\r\n                    from_remote: true\r\n                });\r\n                return [2 /*return*/];\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.add_edge = function (_a) {\r\n        var src_nid = _a.src_nid, src_ioid = _a.src_ioid, trg_nid = _a.trg_nid, trg_ioid = _a.trg_ioid, _b = _a.replace, replace = _b === void 0 ? false : _b;\r\n        return this._send_cmd({\r\n            cmd: \"add_edge\",\r\n            kwargs: { src_nid: src_nid, src_ioid: src_ioid, trg_nid: trg_nid, trg_ioid: trg_ioid, replace: replace }\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.remove_edge = function (_a) {\r\n        var src_nid = _a.src_nid, src_ioid = _a.src_ioid, trg_nid = _a.trg_nid, trg_ioid = _a.trg_ioid;\r\n        return this._send_cmd({\r\n            cmd: \"remove_edge\",\r\n            kwargs: { src_nid: src_nid, src_ioid: src_ioid, trg_nid: trg_nid, trg_ioid: trg_ioid }\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.add_external_worker = function (_a) {\r\n        var module = _a.module, cls_module = _a.cls_module, cls_name = _a.cls_name;\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_b) {\r\n                switch (_b.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: \"add_external_worker\",\r\n                            kwargs: { module: module, cls_module: cls_module, cls_name: cls_name }\r\n                        })];\r\n                    case 1: return [2 /*return*/, _b.sent()];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.sync_local_node_updates = function () {\r\n        var _this = this;\r\n        clearTimeout(this._nodeupdatetimer);\r\n        this._local_nodeupdates.forEach(function (node, id) { return __awaiter(_this, void 0, void 0, function () {\r\n            var ans;\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: \"update_node\",\r\n                            kwargs: { nid: id, data: node },\r\n                            wait_for_response: true\r\n                        })];\r\n                    case 1:\r\n                        ans = _a.sent();\r\n                        if (!this._zustand)\r\n                            return [2 /*return*/];\r\n                        this._zustand.on_node_action({\r\n                            type: \"update\",\r\n                            node: ans,\r\n                            id: id,\r\n                            from_remote: true\r\n                        });\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        }); });\r\n        this._local_nodeupdates.clear();\r\n        this._nodeupdatetimer = setTimeout(function () {\r\n            _this.sync_local_node_updates();\r\n        }, 200);\r\n    };\r\n    FuncNodesWorker.prototype.locally_update_node = function (action) {\r\n        // Add the type to the parameter\r\n        var currentstate = this._local_nodeupdates.get(action.id);\r\n        if (currentstate) {\r\n            var _a = (0,_utils__WEBPACK_IMPORTED_MODULE_1__.deep_merge)(currentstate, action.node), new_obj = _a.new_obj, change = _a.change;\r\n            if (change) {\r\n                this._local_nodeupdates.set(action.id, new_obj);\r\n            }\r\n        }\r\n        else {\r\n            this._local_nodeupdates.set(action.id, action.node);\r\n        }\r\n        if (action.immediate) {\r\n            this.sync_local_node_updates();\r\n        }\r\n    };\r\n    FuncNodesWorker.prototype.get_remote_node_state = function (nid) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var ans;\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: \"get_node_state\",\r\n                            kwargs: { nid: nid },\r\n                            wait_for_response: true\r\n                        })];\r\n                    case 1:\r\n                        ans = _a.sent();\r\n                        if (!this._zustand)\r\n                            return [2 /*return*/];\r\n                        this._zustand.on_node_action({\r\n                            type: \"update\",\r\n                            node: ans,\r\n                            id: ans.id,\r\n                            from_remote: true\r\n                        });\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.set_io_value = function (_a) {\r\n        var nid = _a.nid, ioid = _a.ioid, value = _a.value, _b = _a.set_default, set_default = _b === void 0 ? false : _b;\r\n        if (set_default && value == \"<NoValue>\")\r\n            set_default = false;\r\n        return this._send_cmd({\r\n            cmd: \"set_io_value\",\r\n            kwargs: { nid: nid, ioid: ioid, value: value, set_default: set_default },\r\n            wait_for_response: true\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.clear = function () {\r\n        return this._send_cmd({ cmd: \"clear\" });\r\n    };\r\n    FuncNodesWorker.prototype.save = function () {\r\n        return this._send_cmd({ cmd: \"save\", wait_for_response: true });\r\n    };\r\n    FuncNodesWorker.prototype.load = function (data) {\r\n        var _this = this;\r\n        return this._send_cmd({\r\n            cmd: \"load_data\",\r\n            kwargs: { data: data },\r\n            wait_for_response: true\r\n        }).then(function () {\r\n            _this.fullsync();\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.get_io_value = function (_a) {\r\n        var nid = _a.nid, ioid = _a.ioid;\r\n        return this._send_cmd({\r\n            cmd: \"get_io_value\",\r\n            kwargs: { nid: nid, ioid: ioid },\r\n            wait_for_response: true\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype._send_cmd = function (_a) {\r\n        var cmd = _a.cmd, kwargs = _a.kwargs, _b = _a.wait_for_response, wait_for_response = _b === void 0 ? true : _b, _c = _a.response_timeout, response_timeout = _c === void 0 ? 5000 : _c;\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var msg, msid_1, promise;\r\n            var _this = this;\r\n            return __generator(this, function (_d) {\r\n                switch (_d.label) {\r\n                    case 0:\r\n                        msg = {\r\n                            type: \"cmd\",\r\n                            cmd: cmd,\r\n                            kwargs: kwargs || {}\r\n                        };\r\n                        if (!wait_for_response) return [3 /*break*/, 2];\r\n                        msid_1 = msg.id || (0,uuid__WEBPACK_IMPORTED_MODULE_0__.v4)();\r\n                        msg.id = msid_1;\r\n                        promise = new Promise(function (resolve, reject) {\r\n                            var timeout = setTimeout(function () {\r\n                                reject(\"Timeout@wait_for_response\");\r\n                            }, response_timeout);\r\n                            _this.messagePromises.set(msid_1, {\r\n                                resolve: function (data) {\r\n                                    clearTimeout(timeout);\r\n                                    resolve(data);\r\n                                    _this.messagePromises[\"delete\"](msid_1);\r\n                                },\r\n                                reject: function (err) {\r\n                                    clearTimeout(timeout);\r\n                                    reject(err);\r\n                                    _this.messagePromises[\"delete\"](msid_1);\r\n                                }\r\n                            });\r\n                        });\r\n                        return [4 /*yield*/, this.send(msg)];\r\n                    case 1:\r\n                        _d.sent();\r\n                        return [2 /*return*/, promise];\r\n                    case 2: return [2 /*return*/, this.send(msg)];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.send = function (_data) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                // this is the abstract method that should be implemented by subclasses\r\n                throw new Error(\"Not implemented\");\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.recieve_nodespace_event = function (_a) {\r\n        var event = _a.event, data = _a.data;\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var _b, _c;\r\n            return __generator(this, function (_d) {\r\n                switch (event) {\r\n                    case \"after_set_value\":\r\n                        if (!this._zustand)\r\n                            return [2 /*return*/];\r\n                        return [2 /*return*/, this._zustand.on_node_action({\r\n                                type: \"update\",\r\n                                node: {\r\n                                    id: data.node,\r\n                                    io: (_b = {},\r\n                                        _b[data.io] = {\r\n                                            value: data.result\r\n                                        },\r\n                                        _b)\r\n                                },\r\n                                id: data.node,\r\n                                from_remote: true\r\n                            })];\r\n                    case \"after_update_value_options\":\r\n                        if (!this._zustand)\r\n                            return [2 /*return*/];\r\n                        return [2 /*return*/, this._zustand.on_node_action({\r\n                                type: \"update\",\r\n                                node: {\r\n                                    id: data.node,\r\n                                    io: (_c = {},\r\n                                        _c[data.io] = {\r\n                                            value_options: data.result\r\n                                        },\r\n                                        _c)\r\n                                },\r\n                                id: data.node,\r\n                                from_remote: true\r\n                            })];\r\n                    case \"triggerstart\":\r\n                        if (!this._zustand)\r\n                            return [2 /*return*/];\r\n                        return [2 /*return*/, this._zustand.on_node_action({\r\n                                type: \"update\",\r\n                                node: {\r\n                                    id: data.node,\r\n                                    in_trigger: true\r\n                                },\r\n                                id: data.node,\r\n                                from_remote: true\r\n                            })];\r\n                    case \"triggerdone\":\r\n                        if (!this._zustand)\r\n                            return [2 /*return*/];\r\n                        return [2 /*return*/, this._zustand.on_node_action({\r\n                                type: \"update\",\r\n                                node: {\r\n                                    id: data.node,\r\n                                    in_trigger: false\r\n                                },\r\n                                id: data.node,\r\n                                from_remote: true\r\n                            })];\r\n                    case \"node_trigger_error\":\r\n                        if (!this._zustand)\r\n                            return [2 /*return*/];\r\n                        return [2 /*return*/, this._zustand.on_node_action({\r\n                                type: \"error\",\r\n                                errortype: \"trigger\",\r\n                                error: data.error,\r\n                                id: data.node,\r\n                                from_remote: true\r\n                            })];\r\n                    case \"node_removed\":\r\n                        if (!this._zustand)\r\n                            return [2 /*return*/];\r\n                        return [2 /*return*/, this._zustand.on_node_action({\r\n                                type: \"delete\",\r\n                                id: data.node,\r\n                                from_remote: true\r\n                            })];\r\n                    case \"node_added\":\r\n                        return [2 /*return*/, this._recieve_node_added(data.node)];\r\n                    case \"after_disconnect\":\r\n                        if (!data.result)\r\n                            return [2 /*return*/];\r\n                        if (!Array.isArray(data.result))\r\n                            return [2 /*return*/];\r\n                        if (data.result.length !== 4)\r\n                            return [2 /*return*/];\r\n                        if (!this._zustand)\r\n                            return [2 /*return*/];\r\n                        return [2 /*return*/, this._zustand.on_edge_action({\r\n                                type: \"delete\",\r\n                                from_remote: true,\r\n                                src_nid: data.result[0],\r\n                                src_ioid: data.result[1],\r\n                                trg_nid: data.result[2],\r\n                                trg_ioid: data.result[3]\r\n                            })];\r\n                    case \"after_connect\":\r\n                        if (!data.result)\r\n                            return [2 /*return*/];\r\n                        if (!Array.isArray(data.result))\r\n                            return [2 /*return*/];\r\n                        if (data.result.length !== 4)\r\n                            return [2 /*return*/];\r\n                        return [2 /*return*/, this._recieve_edge_added.apply(this, data.result)];\r\n                    case \"after_add_shelf\":\r\n                        if (!data.result)\r\n                            return [2 /*return*/];\r\n                        if (!this._zustand)\r\n                            return [2 /*return*/];\r\n                        return [2 /*return*/, this._zustand.lib.libstate.getState().set({\r\n                                lib: data.result\r\n                            })];\r\n                    default:\r\n                        console.warn(\"Unhandled nodepsace event\", event, data);\r\n                        break;\r\n                }\r\n                return [2 /*return*/];\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.add_lib = function (lib) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var ans;\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: \"add_shelf\",\r\n                            kwargs: { src: lib },\r\n                            wait_for_response: false\r\n                        })];\r\n                    case 1:\r\n                        ans = _a.sent();\r\n                        return [2 /*return*/, ans];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.add_worker_package = function (pkg) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var ans;\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: \"add_worker_package\",\r\n                            kwargs: { src: pkg },\r\n                            wait_for_response: false\r\n                        })];\r\n                    case 1:\r\n                        ans = _a.sent();\r\n                        return [2 /*return*/, ans];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.recieve = function (data) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var promise, _a;\r\n            return __generator(this, function (_b) {\r\n                switch (_b.label) {\r\n                    case 0:\r\n                        _a = data.type;\r\n                        switch (_a) {\r\n                            case \"nsevent\": return [3 /*break*/, 1];\r\n                            case \"result\": return [3 /*break*/, 3];\r\n                            case \"error\": return [3 /*break*/, 4];\r\n                            case \"progress\": return [3 /*break*/, 5];\r\n                        }\r\n                        return [3 /*break*/, 6];\r\n                    case 1: return [4 /*yield*/, this.recieve_nodespace_event(data)];\r\n                    case 2: return [2 /*return*/, _b.sent()];\r\n                    case 3:\r\n                        promise = data.id && this.messagePromises.get(data.id);\r\n                        if (promise) {\r\n                            return [2 /*return*/, promise.resolve(data.result)];\r\n                        }\r\n                        return [3 /*break*/, 7];\r\n                    case 4:\r\n                        this.on_error(data.tb + \"\\n\" + data.error);\r\n                        promise = data.id && this.messagePromises.get(data.id);\r\n                        if (promise) {\r\n                            return [2 /*return*/, promise.reject(data.error)];\r\n                        }\r\n                        return [3 /*break*/, 7];\r\n                    case 5:\r\n                        if (!this._zustand)\r\n                            return [2 /*return*/];\r\n                        this._zustand.set_progress(data);\r\n                        return [3 /*break*/, 7];\r\n                    case 6:\r\n                        console.warn(\"Unhandled message\", data);\r\n                        return [3 /*break*/, 7];\r\n                    case 7: return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.disconnect = function () { };\r\n    FuncNodesWorker.prototype.onclose = function () {\r\n        this.is_open = false;\r\n        if (!this._zustand)\r\n            return;\r\n        this._zustand.auto_progress();\r\n    };\r\n    FuncNodesWorker.prototype.reconnect = function () {\r\n        return __awaiter(this, void 0, void 0, function () { return __generator(this, function (_a) {\r\n            return [2 /*return*/];\r\n        }); });\r\n    };\r\n    FuncNodesWorker.prototype.stop = function () {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var oldonclose;\r\n            var _this = this;\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({ cmd: \"stop_worker\", wait_for_response: false })];\r\n                    case 1:\r\n                        _a.sent();\r\n                        oldonclose = this.onclose.bind(this);\r\n                        this.onclose = function () {\r\n                            oldonclose();\r\n                            if (!_this._zustand)\r\n                                return;\r\n                            if (_this._zustand.worker === _this) {\r\n                                _this._zustand.clear_all();\r\n                            }\r\n                            _this.onclose = oldonclose;\r\n                        };\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.get_io_full_value = function (_a) {\r\n        var nid = _a.nid, ioid = _a.ioid;\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var res;\r\n            var _b;\r\n            return __generator(this, function (_c) {\r\n                switch (_c.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: \"get_io_full_value\",\r\n                            kwargs: { nid: nid, ioid: ioid },\r\n                            wait_for_response: true\r\n                        })];\r\n                    case 1:\r\n                        res = _c.sent();\r\n                        //console.log(\"Full value\", res);\r\n                        if (!this._zustand)\r\n                            return [2 /*return*/];\r\n                        this._zustand.on_node_action({\r\n                            type: \"update\",\r\n                            node: {\r\n                                io: (_b = {},\r\n                                    _b[ioid] = {\r\n                                        fullvalue: res\r\n                                    },\r\n                                    _b)\r\n                            },\r\n                            id: nid,\r\n                            from_remote: true\r\n                        });\r\n                        return [2 /*return*/, res];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    FuncNodesWorker.prototype.get_node_status = function (nid) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var res;\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this._send_cmd({\r\n                            cmd: \"get_node_state\",\r\n                            kwargs: { nid: nid },\r\n                            wait_for_response: true\r\n                        })];\r\n                    case 1:\r\n                        res = _a.sent();\r\n                        return [2 /*return*/, res];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    return FuncNodesWorker;\r\n}());\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FuncNodesWorker);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/funcnodes/funcnodesworker.ts?");
 
 /***/ }),
 
@@ -336,7 +396,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \******************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _funcnodesworker__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./funcnodesworker */ \"./src/funcnodes/funcnodesworker.ts\");\nvar __extends = (undefined && undefined.__extends) || (function () {\r\n    var extendStatics = function (d, b) {\r\n        extendStatics = Object.setPrototypeOf ||\r\n            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\r\n        return extendStatics(d, b);\r\n    };\r\n    return function (d, b) {\r\n        if (typeof b !== \"function\" && b !== null)\r\n            throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\r\n        extendStatics(d, b);\r\n        function __() { this.constructor = d; }\r\n        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n    };\r\n})();\r\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\r\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n    return new (P || (P = Promise))(function (resolve, reject) {\r\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n    });\r\n};\r\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\r\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n    function verb(n) { return function (v) { return step([n, v]); }; }\r\n    function step(op) {\r\n        if (f) throw new TypeError(\"Generator is already executing.\");\r\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\r\n            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;\r\n            if (y = 0, t) op = [op[0] & 2, t.value];\r\n            switch (op[0]) {\r\n                case 0: case 1: t = op; break;\r\n                case 4: _.label++; return { value: op[1], done: false };\r\n                case 5: _.label++; y = op[1]; op = [0]; continue;\r\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n                default:\r\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n                    if (t[2]) _.ops.pop();\r\n                    _.trys.pop(); continue;\r\n            }\r\n            op = body.call(thisArg, _);\r\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n    }\r\n};\r\n\r\nvar WebSocketWorker = /** @class */ (function (_super) {\r\n    __extends(WebSocketWorker, _super);\r\n    function WebSocketWorker(data) {\r\n        var _this = _super.call(this, data) || this;\r\n        _this._websocket = null;\r\n        _this.reconnectAttempts = 0;\r\n        _this.maxReconnectAttempts = 999;\r\n        _this.initialTimeout = 200; // Initial reconnect delay in ms\r\n        _this.maxTimeout = 5000; // Maximum reconnect delay\r\n        _this._reconnect = true;\r\n        _this._url = data.url;\r\n        _this.connect();\r\n        _this._zustand.auto_progress();\r\n        return _this;\r\n    }\r\n    WebSocketWorker.prototype.connect = function () {\r\n        var _this = this;\r\n        console.log(\"Connecting to websocket\");\r\n        this.is_open = false;\r\n        this._websocket = new WebSocket(this._url);\r\n        this._websocket.onopen = function () {\r\n            _this.onopen();\r\n        };\r\n        this._websocket.onclose = function () {\r\n            _this.onclose();\r\n        };\r\n        this._websocket.onerror = function () {\r\n            _this.on_ws_error();\r\n        };\r\n        this._websocket.onmessage = function (event) {\r\n            _this.onmessage(event.data);\r\n        };\r\n    };\r\n    WebSocketWorker.prototype.calculateReconnectTimeout = function () {\r\n        // Increase timeout exponentially, capped at maxTimeout\r\n        var timeout = Math.min(this.initialTimeout * Math.pow(2, this.reconnectAttempts), this.maxTimeout);\r\n        return timeout;\r\n    };\r\n    WebSocketWorker.prototype.auto_reconnect = function () {\r\n        var _this = this;\r\n        if (this.reconnectAttempts < this.maxReconnectAttempts) {\r\n            var timeout = this.calculateReconnectTimeout();\r\n            console.log(\"Attempting to reconnect in \".concat(timeout, \" ms\"));\r\n            setTimeout(function () {\r\n                if (_this._websocket) {\r\n                    if (_this._websocket.readyState === WebSocket.OPEN) {\r\n                        return;\r\n                    }\r\n                }\r\n                _this.reconnectAttempts++;\r\n                _this.connect();\r\n            }, timeout);\r\n        }\r\n        else {\r\n            console.warn(\"Maximum reconnect attempts reached. Giving up.\");\r\n        }\r\n    };\r\n    WebSocketWorker.prototype.onmessage = function (data) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this.recieve(JSON.parse(data))];\r\n                    case 1:\r\n                        _a.sent();\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    WebSocketWorker.prototype.onopen = function () {\r\n        console.log(\"Websocket opened\");\r\n        this.is_open = true;\r\n        this._zustand.auto_progress();\r\n        this.reconnectAttempts = 0;\r\n        this.fullsync();\r\n    };\r\n    WebSocketWorker.prototype.onclose = function () {\r\n        console.log(\"Websocket closed\", this);\r\n        _super.prototype.onclose.call(this);\r\n        if (this._reconnect) {\r\n            console.log(\"Websocket closed,reconnecting\");\r\n            this.auto_reconnect(); // Attempt to reconnect\r\n        }\r\n    };\r\n    WebSocketWorker.prototype.on_ws_error = function () {\r\n        console.warn(\"Websocket error\");\r\n        if (this._websocket) {\r\n            this._websocket.close(); // Ensure the connection is closed before attempting to reconnect\r\n        }\r\n        else {\r\n            this.auto_reconnect();\r\n        }\r\n    };\r\n    WebSocketWorker.prototype.send = function (data) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                if (!this._websocket || this._websocket.readyState !== WebSocket.OPEN) {\r\n                    throw new Error(\"Websocket not connected\");\r\n                }\r\n                this._websocket.send(JSON.stringify(data));\r\n                return [2 /*return*/];\r\n            });\r\n        });\r\n    };\r\n    WebSocketWorker.prototype.stop = function () {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, _super.prototype.stop.call(this)];\r\n                    case 1:\r\n                        _a.sent();\r\n                        this._reconnect = false;\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    WebSocketWorker.prototype.close = function () {\r\n        if (this._websocket)\r\n            this._websocket.close();\r\n    };\r\n    WebSocketWorker.prototype.disconnect = function () {\r\n        _super.prototype.disconnect.call(this);\r\n        this._reconnect = false;\r\n        this.close();\r\n    };\r\n    WebSocketWorker.prototype.reconnect = function () {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var _this = this;\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, _super.prototype.reconnect.call(this)];\r\n                    case 1:\r\n                        _a.sent();\r\n                        this._reconnect = true;\r\n                        if (!this._websocket) return [3 /*break*/, 4];\r\n                        console.log(\"Reconnecting\", this._websocket.readyState);\r\n                        if (!(this._websocket.readyState === WebSocket.OPEN ||\r\n                            this._websocket.readyState === WebSocket.CONNECTING)) return [3 /*break*/, 4];\r\n                        if (!(this._websocket.readyState === WebSocket.CONNECTING)) return [3 /*break*/, 3];\r\n                        //await to ensure the websocket is connected, with a timeout of 2 seconds\r\n                        return [4 /*yield*/, new Promise(function (resolve, reject) {\r\n                                var _a;\r\n                                var timeout = setTimeout(function () {\r\n                                    reject(\"Timeout\");\r\n                                }, 2000);\r\n                                (_a = _this._websocket) === null || _a === void 0 ? void 0 : _a.addEventListener(\"open\", function () {\r\n                                    clearTimeout(timeout);\r\n                                    resolve(null);\r\n                                });\r\n                            })];\r\n                    case 2:\r\n                        //await to ensure the websocket is connected, with a timeout of 2 seconds\r\n                        _a.sent();\r\n                        _a.label = 3;\r\n                    case 3:\r\n                        if (this._websocket.readyState === WebSocket.OPEN) {\r\n                            this.fullsync();\r\n                            return [2 /*return*/];\r\n                        }\r\n                        _a.label = 4;\r\n                    case 4:\r\n                        this.connect();\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    return WebSocketWorker;\r\n}(_funcnodesworker__WEBPACK_IMPORTED_MODULE_0__[\"default\"]));\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (WebSocketWorker);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/funcnodes/websocketworker.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _funcnodesworker__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./funcnodesworker */ \"./src/funcnodes/funcnodesworker.ts\");\nvar __extends = (undefined && undefined.__extends) || (function () {\r\n    var extendStatics = function (d, b) {\r\n        extendStatics = Object.setPrototypeOf ||\r\n            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\r\n        return extendStatics(d, b);\r\n    };\r\n    return function (d, b) {\r\n        if (typeof b !== \"function\" && b !== null)\r\n            throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\r\n        extendStatics(d, b);\r\n        function __() { this.constructor = d; }\r\n        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n    };\r\n})();\r\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\r\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n    return new (P || (P = Promise))(function (resolve, reject) {\r\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n    });\r\n};\r\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\r\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n    function verb(n) { return function (v) { return step([n, v]); }; }\r\n    function step(op) {\r\n        if (f) throw new TypeError(\"Generator is already executing.\");\r\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\r\n            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;\r\n            if (y = 0, t) op = [op[0] & 2, t.value];\r\n            switch (op[0]) {\r\n                case 0: case 1: t = op; break;\r\n                case 4: _.label++; return { value: op[1], done: false };\r\n                case 5: _.label++; y = op[1]; op = [0]; continue;\r\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n                default:\r\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n                    if (t[2]) _.ops.pop();\r\n                    _.trys.pop(); continue;\r\n            }\r\n            op = body.call(thisArg, _);\r\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n    }\r\n};\r\n\r\nvar WebSocketWorker = /** @class */ (function (_super) {\r\n    __extends(WebSocketWorker, _super);\r\n    function WebSocketWorker(data) {\r\n        var _this = _super.call(this, data) || this;\r\n        _this._websocket = null;\r\n        _this.reconnectAttempts = 0;\r\n        _this.maxReconnectAttempts = 999;\r\n        _this.initialTimeout = 200; // Initial reconnect delay in ms\r\n        _this.maxTimeout = 5000; // Maximum reconnect delay\r\n        _this._reconnect = true;\r\n        _this._url = data.url;\r\n        _this.connect();\r\n        if (_this._zustand)\r\n            _this._zustand.auto_progress();\r\n        return _this;\r\n    }\r\n    WebSocketWorker.prototype.connect = function () {\r\n        var _this = this;\r\n        console.log(\"Connecting to websocket\");\r\n        this.is_open = false;\r\n        this._websocket = new WebSocket(this._url);\r\n        this._websocket.onopen = function () {\r\n            _this.onopen();\r\n        };\r\n        this._websocket.onclose = function () {\r\n            _this.onclose();\r\n        };\r\n        this._websocket.onerror = function () {\r\n            _this.on_ws_error();\r\n        };\r\n        this._websocket.onmessage = function (event) {\r\n            _this.onmessage(event.data);\r\n        };\r\n    };\r\n    WebSocketWorker.prototype.calculateReconnectTimeout = function () {\r\n        // Increase timeout exponentially, capped at maxTimeout\r\n        var timeout = Math.min(this.initialTimeout * Math.pow(2, this.reconnectAttempts), this.maxTimeout);\r\n        return timeout;\r\n    };\r\n    WebSocketWorker.prototype.auto_reconnect = function () {\r\n        var _this = this;\r\n        if (this.reconnectAttempts < this.maxReconnectAttempts) {\r\n            var timeout = this.calculateReconnectTimeout();\r\n            console.log(\"Attempting to reconnect in \".concat(timeout, \" ms\"));\r\n            setTimeout(function () {\r\n                if (_this._websocket) {\r\n                    if (_this._websocket.readyState === WebSocket.OPEN) {\r\n                        return;\r\n                    }\r\n                }\r\n                _this.reconnectAttempts++;\r\n                _this.connect();\r\n            }, timeout);\r\n        }\r\n        else {\r\n            console.warn(\"Maximum reconnect attempts reached. Giving up.\");\r\n        }\r\n    };\r\n    WebSocketWorker.prototype.onmessage = function (data) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, this.recieve(JSON.parse(data))];\r\n                    case 1:\r\n                        _a.sent();\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    WebSocketWorker.prototype.onopen = function () {\r\n        console.log(\"Websocket opened\");\r\n        this.is_open = true;\r\n        if (this._zustand)\r\n            this._zustand.auto_progress();\r\n        this.reconnectAttempts = 0;\r\n        this.fullsync();\r\n    };\r\n    WebSocketWorker.prototype.onclose = function () {\r\n        console.log(\"Websocket closed\", this);\r\n        _super.prototype.onclose.call(this);\r\n        if (this._reconnect) {\r\n            console.log(\"Websocket closed,reconnecting\");\r\n            this.auto_reconnect(); // Attempt to reconnect\r\n        }\r\n    };\r\n    WebSocketWorker.prototype.on_ws_error = function () {\r\n        console.warn(\"Websocket error\");\r\n        if (this._websocket) {\r\n            this._websocket.close(); // Ensure the connection is closed before attempting to reconnect\r\n        }\r\n        else {\r\n            this.auto_reconnect();\r\n        }\r\n    };\r\n    WebSocketWorker.prototype.send = function (data) {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                if (!this._websocket || this._websocket.readyState !== WebSocket.OPEN) {\r\n                    console.warn(\"Websocket not connected\");\r\n                    return [2 /*return*/];\r\n                }\r\n                this._websocket.send(JSON.stringify(data));\r\n                return [2 /*return*/];\r\n            });\r\n        });\r\n    };\r\n    WebSocketWorker.prototype.stop = function () {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, _super.prototype.stop.call(this)];\r\n                    case 1:\r\n                        _a.sent();\r\n                        this._reconnect = false;\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    WebSocketWorker.prototype.close = function () {\r\n        if (this._websocket)\r\n            this._websocket.close();\r\n    };\r\n    WebSocketWorker.prototype.disconnect = function () {\r\n        _super.prototype.disconnect.call(this);\r\n        this._reconnect = false;\r\n        this.close();\r\n    };\r\n    WebSocketWorker.prototype.reconnect = function () {\r\n        return __awaiter(this, void 0, void 0, function () {\r\n            var _this = this;\r\n            return __generator(this, function (_a) {\r\n                switch (_a.label) {\r\n                    case 0: return [4 /*yield*/, _super.prototype.reconnect.call(this)];\r\n                    case 1:\r\n                        _a.sent();\r\n                        this._reconnect = true;\r\n                        if (!this._websocket) return [3 /*break*/, 4];\r\n                        console.log(\"Reconnecting\", this._websocket.readyState);\r\n                        if (!(this._websocket.readyState === WebSocket.OPEN ||\r\n                            this._websocket.readyState === WebSocket.CONNECTING)) return [3 /*break*/, 4];\r\n                        if (!(this._websocket.readyState === WebSocket.CONNECTING)) return [3 /*break*/, 3];\r\n                        //await to ensure the websocket is connected, with a timeout of 2 seconds\r\n                        return [4 /*yield*/, new Promise(function (resolve, reject) {\r\n                                if (_this._websocket === null)\r\n                                    return;\r\n                                var timeout = setTimeout(function () {\r\n                                    reject(\"Timeout@reconnect\");\r\n                                }, 2000);\r\n                                _this._websocket.addEventListener(\"open\", function () {\r\n                                    clearTimeout(timeout);\r\n                                    resolve(null);\r\n                                }, { once: true });\r\n                                if (_this._websocket.readyState === WebSocket.OPEN) {\r\n                                    clearTimeout(timeout);\r\n                                    resolve(null);\r\n                                }\r\n                            })];\r\n                    case 2:\r\n                        //await to ensure the websocket is connected, with a timeout of 2 seconds\r\n                        _a.sent();\r\n                        _a.label = 3;\r\n                    case 3:\r\n                        if (this._websocket.readyState === WebSocket.OPEN) {\r\n                            this.fullsync();\r\n                            return [2 /*return*/];\r\n                        }\r\n                        _a.label = 4;\r\n                    case 4:\r\n                        this.connect();\r\n                        return [2 /*return*/];\r\n                }\r\n            });\r\n        });\r\n    };\r\n    return WebSocketWorker;\r\n}(_funcnodesworker__WEBPACK_IMPORTED_MODULE_0__[\"default\"]));\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (WebSocketWorker);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/funcnodes/websocketworker.ts?");
 
 /***/ }),
 
@@ -356,7 +416,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \***********************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _frontend__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./frontend */ \"./src/frontend/index.tsx\");\n\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_frontend__WEBPACK_IMPORTED_MODULE_0__[\"default\"]);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/index.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   WebSocketWorker: () => (/* reexport safe */ _funcnodes_websocketworker__WEBPACK_IMPORTED_MODULE_1__[\"default\"]),\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _frontend__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./frontend */ \"./src/frontend/index.tsx\");\n/* harmony import */ var _funcnodes_websocketworker__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./funcnodes/websocketworker */ \"./src/funcnodes/websocketworker.ts\");\n\r\n\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_frontend__WEBPACK_IMPORTED_MODULE_0__[\"default\"]);\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/index.tsx?");
 
 /***/ }),
 
@@ -376,7 +436,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \*******************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   LibZustand: () => (/* reexport safe */ _lib__WEBPACK_IMPORTED_MODULE_0__[\"default\"]),\n/* harmony export */   NodeSpaceZustand: () => (/* reexport safe */ _nodespace__WEBPACK_IMPORTED_MODULE_1__[\"default\"]),\n/* harmony export */   assert_reactflow_node: () => (/* binding */ assert_reactflow_node),\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _lib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./lib */ \"./src/states/lib.ts\");\n/* harmony import */ var _nodespace__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./nodespace */ \"./src/states/nodespace.ts\");\n/* harmony import */ var _node__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./node */ \"./src/states/node.ts\");\n/* harmony import */ var _reactflow__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./reactflow */ \"./src/states/reactflow.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n/* harmony import */ var _edge__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./edge */ \"./src/states/edge.ts\");\n/* harmony import */ var zustand__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! zustand */ \"zustand\");\n/* harmony import */ var zustand__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(zustand__WEBPACK_IMPORTED_MODULE_6__);\nvar __assign = (undefined && undefined.__assign) || function () {\r\n    __assign = Object.assign || function(t) {\r\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n            s = arguments[i];\r\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\r\n                t[p] = s[p];\r\n        }\r\n        return t;\r\n    };\r\n    return __assign.apply(this, arguments);\r\n};\r\nvar __spreadArray = (undefined && undefined.__spreadArray) || function (to, from, pack) {\r\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\r\n        if (ar || !(i in from)) {\r\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\r\n            ar[i] = from[i];\r\n        }\r\n    }\r\n    return to.concat(ar || Array.prototype.slice.call(from));\r\n};\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar _fill_node_frontend = function (node, fnrf_instance) {\r\n    var frontend = node.frontend || {};\r\n    if (!frontend.pos) {\r\n        if (!fnrf_instance ||\r\n            !fnrf_instance.rf_instance ||\r\n            fnrf_instance.reactflowRef === null) {\r\n            frontend.pos = [0, 0];\r\n        }\r\n        else {\r\n            var ref = fnrf_instance.reactflowRef;\r\n            var rect = ref.getBoundingClientRect(); // Step 2: Get bounding rectangle\r\n            var centerX = rect.left + rect.width / 2; // Calculate center X\r\n            var centerY = rect.top + rect.height / 2; // Calculate center Y\r\n            var calcpos = fnrf_instance.rf_instance.screenToFlowPosition({\r\n                x: centerX,\r\n                y: centerY\r\n            });\r\n            frontend.pos = [calcpos.x, calcpos.y];\r\n        }\r\n    }\r\n    if (!frontend.size) {\r\n        frontend.size = [200, 100];\r\n    }\r\n    if (!frontend.collapsed) {\r\n        frontend.collapsed = false;\r\n    }\r\n    node.frontend = frontend;\r\n};\r\nvar assert_react_flow_io = function (io, fnrf_instance) {\r\n    if (io.value === '<NoValue>') {\r\n        io.value = undefined;\r\n    }\r\n    if (io.fullvalue === '<NoValue>') {\r\n        io.fullvalue = undefined;\r\n    }\r\n    if (io.try_get_full_value === undefined) {\r\n        io.try_get_full_value = function () {\r\n            var _a;\r\n            if (!fnrf_instance) {\r\n                return;\r\n            }\r\n            if (io.node === undefined || io.id === undefined) {\r\n                return;\r\n            }\r\n            (_a = fnrf_instance.worker) === null || _a === void 0 ? void 0 : _a.get_io_full_value({ nid: io.node, ioid: io.id });\r\n        };\r\n    }\r\n    return io;\r\n};\r\nvar assert_reactflow_node = function (node, store, fnrf_instance) {\r\n    _fill_node_frontend(node, fnrf_instance);\r\n    if (node.id === undefined) {\r\n        throw new Error('Node must have an id');\r\n    }\r\n    for (var io in node.io) {\r\n        node.io[io].node = node.id;\r\n        assert_react_flow_io(node.io[io], fnrf_instance);\r\n    }\r\n    var extendedNode = __assign({ position: {\r\n            x: node.frontend.pos[0],\r\n            y: node.frontend.pos[1]\r\n        }, data: {\r\n            UseNodeStore: store\r\n        }, type: 'default' }, node);\r\n    return extendedNode;\r\n};\r\nvar FuncNodesReactFlowZustand = function () {\r\n    /*\r\n    function that should be called when the remote node, e.g. in the python worker is performing an action\r\n    */\r\n    var on_node_action = function (action) {\r\n        var _a, _b, _c;\r\n        var rfstate = rfstore.getState();\r\n        switch (action.type) {\r\n            case 'add':\r\n                if (action.from_remote) {\r\n                    var store = ns.get_node(action.node.id, false);\r\n                    if (!store) {\r\n                        try {\r\n                            store = (0,_node__WEBPACK_IMPORTED_MODULE_2__.createNodeStore)(action.node);\r\n                            ns.nodesstates.set(action.node.id, store);\r\n                        }\r\n                        catch (e) {\r\n                            return;\r\n                        }\r\n                    }\r\n                    var new_ndoes = __spreadArray(__spreadArray([], rfstate.nodes, true), [\r\n                        assert_reactflow_node(action.node, store, iterf)\r\n                    ], false);\r\n                    rfstore.setState({ nodes: new_ndoes });\r\n                }\r\n                break;\r\n            case 'update':\r\n                // some action reset the error, so far trigger does, so errors should remove the in_trigger flag\r\n                if (action.node.in_trigger) {\r\n                    action.node.error = undefined;\r\n                }\r\n                if (action.from_remote) {\r\n                    var store = ns.get_node(action.id);\r\n                    if (action.node.io) {\r\n                        for (var io in action.node.io) {\r\n                            var ioobj = action.node.io[io];\r\n                            // check if value in io, undefined is a valid value\r\n                            if (ioobj.hasOwnProperty('value')) {\r\n                                if (ioobj.value === undefined) {\r\n                                    ioobj.value = null;\r\n                                }\r\n                                else if (ioobj.value === '<NoValue>') {\r\n                                    ioobj.value = undefined;\r\n                                }\r\n                            }\r\n                        }\r\n                    }\r\n                    var state = store.getState();\r\n                    var _d = (0,_utils__WEBPACK_IMPORTED_MODULE_4__.deep_merge)(state, action.node), new_obj = _d.new_obj, change = _d.change;\r\n                    if (change) {\r\n                        if (action.node.io) {\r\n                            for (var io in action.node.io) {\r\n                                // if fullvalue is in the update data, set to fullvalue otherwise set to undefined\r\n                                new_obj.io[io].fullvalue = (_a = action.node.io[io]) === null || _a === void 0 ? void 0 : _a.fullvalue;\r\n                            }\r\n                        }\r\n                        assert_reactflow_node(new_obj, store, iterf);\r\n                        store.setState(new_obj);\r\n                    }\r\n                }\r\n                else {\r\n                    if (iterf.worker) {\r\n                        iterf.worker.update_node(action);\r\n                    }\r\n                }\r\n                break;\r\n            case 'delete':\r\n                if (action.from_remote) {\r\n                    rfstore.getState().onNodesChange([\r\n                        {\r\n                            type: 'remove',\r\n                            id: action.id\r\n                        }\r\n                    ]);\r\n                }\r\n                else {\r\n                    (_b = iterf.worker) === null || _b === void 0 ? void 0 : _b.remove_node(action.id);\r\n                }\r\n                break;\r\n            case 'error':\r\n                console.error('Error', action);\r\n                on_node_action({\r\n                    type: 'update',\r\n                    id: action.id,\r\n                    node: {\r\n                        in_trigger: false,\r\n                        error: action.error\r\n                    },\r\n                    from_remote: true\r\n                });\r\n                break;\r\n            case 'trigger':\r\n                if (action.from_remote) {\r\n                    on_node_action({\r\n                        type: 'update',\r\n                        id: action.id,\r\n                        node: {\r\n                            in_trigger: true,\r\n                            error: undefined\r\n                        },\r\n                        from_remote: true\r\n                    });\r\n                }\r\n                else {\r\n                    (_c = iterf.worker) === null || _c === void 0 ? void 0 : _c.trigger_node(action.id);\r\n                }\r\n                break;\r\n            default:\r\n                console.error('Unknown node action', action);\r\n        }\r\n    };\r\n    var on_edge_action = function (action) {\r\n        var rfstate = rfstore.getState();\r\n        switch (action.type) {\r\n            case 'add':\r\n                if (action.from_remote) {\r\n                    var edges = rfstate.edges;\r\n                    var new_edge_id_1 = (0,_edge__WEBPACK_IMPORTED_MODULE_5__.generate_edge_id)(action);\r\n                    //cehck if edge already exists including reversed\r\n                    if (edges.some(function (e) { return e.id === new_edge_id_1; })) {\r\n                        return;\r\n                    }\r\n                    var new_edge = {\r\n                        id: new_edge_id_1,\r\n                        source: action.src_nid,\r\n                        target: action.trg_nid,\r\n                        sourceHandle: action.src_ioid,\r\n                        targetHandle: action.trg_ioid,\r\n                        className: 'funcnodes-edge animated'\r\n                    };\r\n                    rfstore.setState({ edges: __spreadArray(__spreadArray([], edges, true), [new_edge], false) });\r\n                }\r\n                else {\r\n                }\r\n                break;\r\n            case 'delete':\r\n                if (action.from_remote) {\r\n                    var edges = rfstate.edges;\r\n                    var del_edge_id_1 = (0,_edge__WEBPACK_IMPORTED_MODULE_5__.generate_edge_id)(action);\r\n                    var new_edges = edges.filter(function (edge) { return edge.id !== del_edge_id_1; });\r\n                    rfstore.setState({ edges: new_edges });\r\n                }\r\n                else {\r\n                }\r\n                break;\r\n            default:\r\n                console.error('Unknown edge action', action);\r\n        }\r\n    };\r\n    /*\r\n    on_node_cahnge is called by react flow when a note change event is fired\r\n    should update the local state if something changed\r\n    */\r\n    var on_node_change = function (nodechange) {\r\n        for (var _i = 0, nodechange_1 = nodechange; _i < nodechange_1.length; _i++) {\r\n            var change = nodechange_1[_i];\r\n            switch (change.type) {\r\n                case 'position':\r\n                    if (change.position) {\r\n                        on_node_action({\r\n                            type: 'update',\r\n                            id: change.id,\r\n                            node: {\r\n                                frontend: { pos: [change.position.x, change.position.y] }\r\n                            },\r\n                            from_remote: false\r\n                        });\r\n                    }\r\n                    break;\r\n                case 'dimensions':\r\n                    if (change.dimensions) {\r\n                        on_node_action({\r\n                            type: 'update',\r\n                            id: change.id,\r\n                            node: {\r\n                                frontend: {\r\n                                    size: [change.dimensions.width, change.dimensions.height]\r\n                                }\r\n                            },\r\n                            from_remote: false\r\n                        });\r\n                    }\r\n                    break;\r\n            }\r\n        }\r\n    };\r\n    var on_edge_change = function (_edgechange) { };\r\n    var on_connect = function (connection) {\r\n        if (connection.source === null ||\r\n            connection.target === null ||\r\n            connection.sourceHandle === null ||\r\n            connection.targetHandle === null ||\r\n            !iterf.worker) {\r\n            return;\r\n        }\r\n        iterf.worker.add_edge({\r\n            src_nid: connection.source,\r\n            src_ioid: connection.sourceHandle,\r\n            trg_nid: connection.target,\r\n            trg_ioid: connection.targetHandle,\r\n            replace: true\r\n        });\r\n    };\r\n    var rfstore = (0,_reactflow__WEBPACK_IMPORTED_MODULE_3__[\"default\"])({\r\n        on_node_change: on_node_change,\r\n        on_edge_change: on_edge_change,\r\n        on_connect: on_connect\r\n    });\r\n    var ns = (0,_nodespace__WEBPACK_IMPORTED_MODULE_1__[\"default\"])({});\r\n    var lib = (0,_lib__WEBPACK_IMPORTED_MODULE_0__[\"default\"])();\r\n    var clear_all = function () {\r\n        var _a, _b;\r\n        (_a = iterf.worker) === null || _a === void 0 ? void 0 : _a.disconnect();\r\n        iterf.worker = undefined;\r\n        (_b = iterf.workermanager) === null || _b === void 0 ? void 0 : _b.setWorker(undefined);\r\n        iterf.lib.libstate.getState().set({ shelves: [] });\r\n        iterf.nodespace.nodesstates.clear();\r\n        iterf.useReactFlowStore.setState({ nodes: [], edges: [] });\r\n        iterf.auto_progress();\r\n    };\r\n    var iterf = {\r\n        lib: lib,\r\n        workermanager: undefined,\r\n        workers: (0,zustand__WEBPACK_IMPORTED_MODULE_6__.create)(function (_set, _get) { return ({}); }),\r\n        render_options: (0,zustand__WEBPACK_IMPORTED_MODULE_6__.create)(function (_set, _get) { return ({}); }),\r\n        progress_state: (0,zustand__WEBPACK_IMPORTED_MODULE_6__.create)(function (_set, _get) { return ({\r\n            message: 'please select worker',\r\n            status: 'info',\r\n            progress: 0,\r\n            blocking: false\r\n        }); }),\r\n        update_render_options: function (options) {\r\n            var current = iterf.render_options.getState();\r\n            var _a = (0,_utils__WEBPACK_IMPORTED_MODULE_4__.deep_merge)(current, options), new_obj = _a.new_obj, change = _a.change;\r\n            if (change) {\r\n                iterf.render_options.setState(new_obj);\r\n            }\r\n        },\r\n        worker: undefined,\r\n        nodespace: ns,\r\n        useReactFlowStore: rfstore,\r\n        on_node_action: on_node_action,\r\n        on_edge_action: on_edge_action,\r\n        reactflowRef: null,\r\n        clear_all: clear_all,\r\n        set_progress: function (progress) {\r\n            if (progress.message === '') {\r\n                return iterf.auto_progress();\r\n            }\r\n            var prev_state = iterf.progress_state.getState();\r\n            var _a = (0,_utils__WEBPACK_IMPORTED_MODULE_4__.deep_merge)(prev_state, progress), new_obj = _a.new_obj, change = _a.change;\r\n            if (change) {\r\n                iterf.progress_state.setState(new_obj);\r\n            }\r\n        },\r\n        auto_progress: function () {\r\n            if (iterf.worker === undefined) {\r\n                return iterf.set_progress({\r\n                    progress: 0,\r\n                    message: 'please select worker',\r\n                    status: 'error',\r\n                    blocking: false\r\n                });\r\n            }\r\n            if (!iterf.worker.is_open) {\r\n                return iterf.set_progress({\r\n                    progress: 0,\r\n                    message: 'connecting to worker',\r\n                    status: 'info',\r\n                    blocking: true\r\n                });\r\n            }\r\n            iterf.set_progress({\r\n                progress: 1,\r\n                message: 'running',\r\n                status: 'info',\r\n                blocking: false\r\n            });\r\n        }\r\n    };\r\n    return iterf;\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FuncNodesReactFlowZustand);\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/states/fnrfzst.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   LibZustand: () => (/* reexport safe */ _lib__WEBPACK_IMPORTED_MODULE_0__[\"default\"]),\n/* harmony export */   NodeSpaceZustand: () => (/* reexport safe */ _nodespace__WEBPACK_IMPORTED_MODULE_1__[\"default\"]),\n/* harmony export */   assert_reactflow_node: () => (/* binding */ assert_reactflow_node),\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _lib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./lib */ \"./src/states/lib.ts\");\n/* harmony import */ var _nodespace__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./nodespace */ \"./src/states/nodespace.ts\");\n/* harmony import */ var _node__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./node */ \"./src/states/node.ts\");\n/* harmony import */ var _reactflow__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./reactflow */ \"./src/states/reactflow.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n/* harmony import */ var _edge__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./edge */ \"./src/states/edge.ts\");\n/* harmony import */ var zustand__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! zustand */ \"zustand\");\n/* harmony import */ var zustand__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(zustand__WEBPACK_IMPORTED_MODULE_6__);\nvar __assign = (undefined && undefined.__assign) || function () {\r\n    __assign = Object.assign || function(t) {\r\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n            s = arguments[i];\r\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\r\n                t[p] = s[p];\r\n        }\r\n        return t;\r\n    };\r\n    return __assign.apply(this, arguments);\r\n};\r\nvar __spreadArray = (undefined && undefined.__spreadArray) || function (to, from, pack) {\r\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\r\n        if (ar || !(i in from)) {\r\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\r\n            ar[i] = from[i];\r\n        }\r\n    }\r\n    return to.concat(ar || Array.prototype.slice.call(from));\r\n};\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nvar _fill_node_frontend = function (node, fnrf_instance) {\r\n    var frontend = node.frontend || {};\r\n    if (!frontend.pos) {\r\n        if (!fnrf_instance ||\r\n            !fnrf_instance.rf_instance ||\r\n            fnrf_instance.reactflowRef === null) {\r\n            frontend.pos = [0, 0];\r\n        }\r\n        else {\r\n            var ref = fnrf_instance.reactflowRef;\r\n            var rect = ref.getBoundingClientRect(); // Step 2: Get bounding rectangle\r\n            var centerX = rect.left + rect.width / 2; // Calculate center X\r\n            var centerY = rect.top + rect.height / 2; // Calculate center Y\r\n            var calcpos = fnrf_instance.rf_instance.screenToFlowPosition({\r\n                x: centerX,\r\n                y: centerY\r\n            });\r\n            frontend.pos = [calcpos.x, calcpos.y];\r\n        }\r\n    }\r\n    if (!frontend.size) {\r\n        frontend.size = [200, 100];\r\n    }\r\n    if (!frontend.collapsed) {\r\n        frontend.collapsed = false;\r\n    }\r\n    node.frontend = frontend;\r\n};\r\nvar assert_react_flow_io = function (io, fnrf_instance) {\r\n    if (io.value === \"<NoValue>\") {\r\n        io.value = undefined;\r\n    }\r\n    if (io.fullvalue === \"<NoValue>\") {\r\n        io.fullvalue = undefined;\r\n    }\r\n    if (io.try_get_full_value === undefined) {\r\n        io.try_get_full_value = function () {\r\n            var _a;\r\n            if (!fnrf_instance) {\r\n                return;\r\n            }\r\n            if (io.node === undefined || io.id === undefined) {\r\n                return;\r\n            }\r\n            (_a = fnrf_instance.worker) === null || _a === void 0 ? void 0 : _a.get_io_full_value({ nid: io.node, ioid: io.id });\r\n        };\r\n    }\r\n    return io;\r\n};\r\nvar assert_reactflow_node = function (node, store, fnrf_instance) {\r\n    _fill_node_frontend(node, fnrf_instance);\r\n    if (node.id === undefined) {\r\n        throw new Error(\"Node must have an id\");\r\n    }\r\n    for (var io in node.io) {\r\n        node.io[io].node = node.id;\r\n        assert_react_flow_io(node.io[io], fnrf_instance);\r\n    }\r\n    var extendedNode = __assign({ position: {\r\n            x: node.frontend.pos[0],\r\n            y: node.frontend.pos[1]\r\n        }, data: {\r\n            UseNodeStore: store\r\n        }, type: \"default\" }, node);\r\n    return extendedNode;\r\n};\r\nvar FuncNodesReactFlowZustand = function (_a) {\r\n    /*\r\n    function that should be called when the remote node, e.g. in the python worker is performing an action\r\n    */\r\n    var _b = _a.useWorkerManager, useWorkerManager = _b === void 0 ? true : _b, _c = _a.default_worker, default_worker = _c === void 0 ? undefined : _c;\r\n    var options = {\r\n        useWorkerManager: useWorkerManager,\r\n        default_worker: default_worker\r\n    };\r\n    var on_node_action = function (action) {\r\n        var _a, _b, _c;\r\n        var rfstate = rfstore.getState();\r\n        switch (action.type) {\r\n            case \"add\":\r\n                if (action.from_remote) {\r\n                    var store = ns.get_node(action.node.id, false);\r\n                    if (!store) {\r\n                        try {\r\n                            store = (0,_node__WEBPACK_IMPORTED_MODULE_2__.createNodeStore)(action.node);\r\n                            ns.nodesstates.set(action.node.id, store);\r\n                        }\r\n                        catch (e) {\r\n                            return;\r\n                        }\r\n                    }\r\n                    var new_ndoes = __spreadArray(__spreadArray([], rfstate.nodes, true), [\r\n                        assert_reactflow_node(action.node, store, iterf),\r\n                    ], false);\r\n                    rfstore.setState({ nodes: new_ndoes });\r\n                }\r\n                break;\r\n            case \"update\":\r\n                // some action reset the error, so far trigger does, so errors should remove the in_trigger flag\r\n                if (action.node.in_trigger) {\r\n                    action.node.error = undefined;\r\n                }\r\n                if (action.from_remote) {\r\n                    var store = ns.get_node(action.id);\r\n                    (0,_node__WEBPACK_IMPORTED_MODULE_2__.normalize_node)(action.node);\r\n                    if (action.node.io) {\r\n                        for (var io in action.node.io) {\r\n                            var ioobj = action.node.io[io];\r\n                            // check if value in io, undefined is a valid value\r\n                            if (ioobj.hasOwnProperty(\"value\")) {\r\n                                if (ioobj.value === undefined) {\r\n                                    ioobj.value = null;\r\n                                }\r\n                                else if (ioobj.value === \"<NoValue>\") {\r\n                                    ioobj.value = undefined;\r\n                                }\r\n                            }\r\n                        }\r\n                    }\r\n                    var state = store.getState();\r\n                    var _d = (0,_utils__WEBPACK_IMPORTED_MODULE_4__.deep_merge)(state, action.node), new_obj = _d.new_obj, change = _d.change;\r\n                    if (change) {\r\n                        if (action.node.io) {\r\n                            for (var io in action.node.io) {\r\n                                // if fullvalue is in the update data, set to fullvalue otherwise set to undefined\r\n                                new_obj.io[io].fullvalue = (_a = action.node.io[io]) === null || _a === void 0 ? void 0 : _a.fullvalue;\r\n                            }\r\n                        }\r\n                        assert_reactflow_node(new_obj, store, iterf);\r\n                        store.setState(new_obj);\r\n                    }\r\n                }\r\n                else {\r\n                    if (iterf.worker) {\r\n                        iterf.worker.locally_update_node(action);\r\n                    }\r\n                }\r\n                break;\r\n            case \"delete\":\r\n                if (action.from_remote) {\r\n                    rfstore.getState().onNodesChange([\r\n                        {\r\n                            type: \"remove\",\r\n                            id: action.id\r\n                        },\r\n                    ]);\r\n                }\r\n                else {\r\n                    (_b = iterf.worker) === null || _b === void 0 ? void 0 : _b.remove_node(action.id);\r\n                }\r\n                break;\r\n            case \"error\":\r\n                console.error(\"Error\", action);\r\n                on_node_action({\r\n                    type: \"update\",\r\n                    id: action.id,\r\n                    node: {\r\n                        in_trigger: false,\r\n                        error: action.error\r\n                    },\r\n                    from_remote: true\r\n                });\r\n                break;\r\n            case \"trigger\":\r\n                if (action.from_remote) {\r\n                    on_node_action({\r\n                        type: \"update\",\r\n                        id: action.id,\r\n                        node: {\r\n                            in_trigger: true,\r\n                            error: undefined\r\n                        },\r\n                        from_remote: true\r\n                    });\r\n                }\r\n                else {\r\n                    (_c = iterf.worker) === null || _c === void 0 ? void 0 : _c.trigger_node(action.id);\r\n                }\r\n                break;\r\n            default:\r\n                console.error(\"Unknown node action\", action);\r\n        }\r\n    };\r\n    var on_edge_action = function (action) {\r\n        var _a, _b, _c, _d;\r\n        var rfstate = rfstore.getState();\r\n        switch (action.type) {\r\n            case \"add\":\r\n                if (action.from_remote) {\r\n                    var edges = rfstate.edges;\r\n                    var new_edge_id_1 = (0,_edge__WEBPACK_IMPORTED_MODULE_5__.generate_edge_id)(action);\r\n                    //cehck if edge already exists including reversed\r\n                    if (edges.some(function (e) { return e.id === new_edge_id_1; })) {\r\n                        return;\r\n                    }\r\n                    var new_edge = {\r\n                        id: new_edge_id_1,\r\n                        source: action.src_nid,\r\n                        target: action.trg_nid,\r\n                        sourceHandle: action.src_ioid,\r\n                        targetHandle: action.trg_ioid,\r\n                        className: \"funcnodes-edge animated\"\r\n                    };\r\n                    rfstore.setState({ edges: __spreadArray(__spreadArray([], edges, true), [new_edge], false) });\r\n                    (_a = iterf.worker) === null || _a === void 0 ? void 0 : _a.get_remote_node_state(action.src_nid);\r\n                    (_b = iterf.worker) === null || _b === void 0 ? void 0 : _b.get_remote_node_state(action.trg_nid);\r\n                }\r\n                else {\r\n                }\r\n                break;\r\n            case \"delete\":\r\n                if (action.from_remote) {\r\n                    var edges = rfstate.edges;\r\n                    var del_edge_id_1 = (0,_edge__WEBPACK_IMPORTED_MODULE_5__.generate_edge_id)(action);\r\n                    var new_edges = edges.filter(function (edge) { return edge.id !== del_edge_id_1; });\r\n                    rfstore.setState({ edges: new_edges });\r\n                    (_c = iterf.worker) === null || _c === void 0 ? void 0 : _c.get_remote_node_state(action.src_nid);\r\n                    (_d = iterf.worker) === null || _d === void 0 ? void 0 : _d.get_remote_node_state(action.trg_nid);\r\n                }\r\n                else {\r\n                }\r\n                break;\r\n            default:\r\n                console.error(\"Unknown edge action\", action);\r\n        }\r\n    };\r\n    /*\r\n    on_node_cahnge is called by react flow when a note change event is fired\r\n    should update the local state if something changed\r\n    */\r\n    var on_node_change = function (nodechange) {\r\n        for (var _i = 0, nodechange_1 = nodechange; _i < nodechange_1.length; _i++) {\r\n            var change = nodechange_1[_i];\r\n            switch (change.type) {\r\n                case \"position\":\r\n                    if (change.position) {\r\n                        on_node_action({\r\n                            type: \"update\",\r\n                            id: change.id,\r\n                            node: {\r\n                                frontend: { pos: [change.position.x, change.position.y] }\r\n                            },\r\n                            from_remote: false\r\n                        });\r\n                    }\r\n                    break;\r\n                case \"dimensions\":\r\n                    if (change.dimensions) {\r\n                        on_node_action({\r\n                            type: \"update\",\r\n                            id: change.id,\r\n                            node: {\r\n                                frontend: {\r\n                                    size: [change.dimensions.width, change.dimensions.height]\r\n                                }\r\n                            },\r\n                            from_remote: false\r\n                        });\r\n                    }\r\n                    break;\r\n            }\r\n        }\r\n    };\r\n    var on_edge_change = function (_edgechange) { };\r\n    var on_connect = function (connection) {\r\n        if (connection.source === null ||\r\n            connection.target === null ||\r\n            connection.sourceHandle === null ||\r\n            connection.targetHandle === null ||\r\n            !iterf.worker) {\r\n            return;\r\n        }\r\n        iterf.worker.add_edge({\r\n            src_nid: connection.source,\r\n            src_ioid: connection.sourceHandle,\r\n            trg_nid: connection.target,\r\n            trg_ioid: connection.targetHandle,\r\n            replace: true\r\n        });\r\n    };\r\n    var rfstore = (0,_reactflow__WEBPACK_IMPORTED_MODULE_3__[\"default\"])({\r\n        on_node_change: on_node_change,\r\n        on_edge_change: on_edge_change,\r\n        on_connect: on_connect\r\n    });\r\n    var ns = (0,_nodespace__WEBPACK_IMPORTED_MODULE_1__[\"default\"])({});\r\n    var lib = (0,_lib__WEBPACK_IMPORTED_MODULE_0__[\"default\"])();\r\n    var clear_all = function () {\r\n        var _a, _b;\r\n        (_a = iterf.worker) === null || _a === void 0 ? void 0 : _a.disconnect();\r\n        iterf.worker = undefined;\r\n        (_b = iterf.workermanager) === null || _b === void 0 ? void 0 : _b.setWorker(undefined);\r\n        iterf.lib.libstate\r\n            .getState()\r\n            .set({ lib: { shelves: [] }, external_worker: [] });\r\n        iterf.nodespace.nodesstates.clear();\r\n        iterf.useReactFlowStore.setState({ nodes: [], edges: [] });\r\n        iterf.auto_progress();\r\n    };\r\n    var iterf = {\r\n        options: options,\r\n        lib: lib,\r\n        workermanager: undefined,\r\n        workers: (0,zustand__WEBPACK_IMPORTED_MODULE_6__.create)(function (_set, _get) { return ({}); }),\r\n        render_options: (0,zustand__WEBPACK_IMPORTED_MODULE_6__.create)(function (_set, _get) { return ({}); }),\r\n        progress_state: (0,zustand__WEBPACK_IMPORTED_MODULE_6__.create)(function (_set, _get) { return ({\r\n            message: \"please select worker\",\r\n            status: \"info\",\r\n            progress: 0,\r\n            blocking: false\r\n        }); }),\r\n        update_render_options: function (options) {\r\n            var current = iterf.render_options.getState();\r\n            var _a = (0,_utils__WEBPACK_IMPORTED_MODULE_4__.deep_merge)(current, options), new_obj = _a.new_obj, change = _a.change;\r\n            if (change) {\r\n                iterf.render_options.setState(new_obj);\r\n            }\r\n        },\r\n        worker: undefined,\r\n        nodespace: ns,\r\n        useReactFlowStore: rfstore,\r\n        on_node_action: on_node_action,\r\n        on_edge_action: on_edge_action,\r\n        reactflowRef: null,\r\n        clear_all: clear_all,\r\n        set_progress: function (progress) {\r\n            if (progress.message === \"\") {\r\n                return iterf.auto_progress();\r\n            }\r\n            var prev_state = iterf.progress_state.getState();\r\n            var _a = (0,_utils__WEBPACK_IMPORTED_MODULE_4__.deep_merge)(prev_state, progress), new_obj = _a.new_obj, change = _a.change;\r\n            if (change) {\r\n                iterf.progress_state.setState(new_obj);\r\n            }\r\n        },\r\n        auto_progress: function () {\r\n            if (iterf.worker === undefined) {\r\n                return iterf.set_progress({\r\n                    progress: 0,\r\n                    message: \"please select worker\",\r\n                    status: \"error\",\r\n                    blocking: false\r\n                });\r\n            }\r\n            if (!iterf.worker.is_open) {\r\n                return iterf.set_progress({\r\n                    progress: 0,\r\n                    message: \"connecting to worker\",\r\n                    status: \"info\",\r\n                    blocking: true\r\n                });\r\n            }\r\n            iterf.set_progress({\r\n                progress: 1,\r\n                message: \"running\",\r\n                status: \"info\",\r\n                blocking: false\r\n            });\r\n        }\r\n    };\r\n    return iterf;\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FuncNodesReactFlowZustand);\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/states/fnrfzst.ts?");
 
 /***/ }),
 
@@ -386,7 +446,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \***************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var zustand__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! zustand */ \"zustand\");\n/* harmony import */ var zustand__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(zustand__WEBPACK_IMPORTED_MODULE_0__);\n\r\nvar LibZustand = function () {\r\n    return {\r\n        libstate: (0,zustand__WEBPACK_IMPORTED_MODULE_0__.create)(function (set, get) { return ({\r\n            state: {\r\n                shelves: []\r\n            },\r\n            set: function (state) { return set({ state: state }); },\r\n            get: function () { return get().state; }\r\n        }); })\r\n    };\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (LibZustand);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/states/lib.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var zustand__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! zustand */ \"zustand\");\n/* harmony import */ var zustand__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(zustand__WEBPACK_IMPORTED_MODULE_0__);\nvar __assign = (undefined && undefined.__assign) || function () {\r\n    __assign = Object.assign || function(t) {\r\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n            s = arguments[i];\r\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\r\n                t[p] = s[p];\r\n        }\r\n        return t;\r\n    };\r\n    return __assign.apply(this, arguments);\r\n};\r\n\r\nvar LibZustand = function () {\r\n    return {\r\n        libstate: (0,zustand__WEBPACK_IMPORTED_MODULE_0__.create)(function (set, get) { return ({\r\n            lib: {\r\n                shelves: []\r\n            },\r\n            external_worker: [],\r\n            set: function (state) { return set(function (prev) { return (__assign(__assign({}, prev), state)); }); },\r\n            get_lib: function () { return get().lib; },\r\n            get_external_worker: function () { return get().external_worker; }\r\n        }); })\r\n    };\r\n};\r\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (LibZustand);\r\n\n\n//# sourceURL=webpack://ModuleName/./src/states/lib.ts?");
 
 /***/ }),
 
@@ -396,7 +456,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \****************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   assert_full_node: () => (/* binding */ assert_full_node),\n/* harmony export */   createNodeStore: () => (/* binding */ createNodeStore)\n/* harmony export */ });\n/* harmony import */ var zustand__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! zustand */ \"zustand\");\n/* harmony import */ var zustand__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(zustand__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\r\n\r\nvar dummy_node = {\r\n    id: \"dummy\",\r\n    node_name: \"dummy\",\r\n    frontend: {\r\n        pos: [0, 0],\r\n        size: [200, 100],\r\n        collapsed: false\r\n    },\r\n    io: {},\r\n    name: \"dummy\",\r\n    in_trigger: false,\r\n    io_order: []\r\n};\r\nvar assert_full_node = function (node) {\r\n    if (!node.id) {\r\n        throw new Error(\"Node must have an id\");\r\n    }\r\n    var new_obj = (0,_utils__WEBPACK_IMPORTED_MODULE_1__.deep_merge)(dummy_node, node).new_obj;\r\n    return new_obj;\r\n};\r\nvar createNodeStore = function (node) {\r\n    // check if node is Object\r\n    if (node.io === undefined) {\r\n        node.io = {};\r\n    }\r\n    if (Array.isArray(node.io)) {\r\n        node.io_order = node.io.map(function (io) { return io.id; });\r\n        var new_io = {};\r\n        for (var _i = 0, _a = node.io; _i < _a.length; _i++) {\r\n            var io = _a[_i];\r\n            new_io[io.id] = io;\r\n        }\r\n        node.io = new_io;\r\n    }\r\n    else {\r\n        node.io_order = Object.keys(node.io);\r\n    }\r\n    return (0,zustand__WEBPACK_IMPORTED_MODULE_0__.create)(function (_set, _get) { return node; });\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/states/node.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   assert_full_node: () => (/* binding */ assert_full_node),\n/* harmony export */   createNodeStore: () => (/* binding */ createNodeStore),\n/* harmony export */   normalize_node: () => (/* binding */ normalize_node)\n/* harmony export */ });\n/* harmony import */ var zustand__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! zustand */ \"zustand\");\n/* harmony import */ var zustand__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(zustand__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../utils */ \"./src/utils/index.ts\");\n\r\n\r\nvar dummy_node = {\r\n    id: \"dummy\",\r\n    node_name: \"dummy\",\r\n    frontend: {\r\n        pos: [0, 0],\r\n        size: [200, 100],\r\n        collapsed: false\r\n    },\r\n    io: {},\r\n    name: \"dummy\",\r\n    in_trigger: false,\r\n    io_order: []\r\n};\r\nvar assert_full_node = function (node) {\r\n    if (!node.id) {\r\n        throw new Error(\"Node must have an id\");\r\n    }\r\n    var new_obj = (0,_utils__WEBPACK_IMPORTED_MODULE_1__.deep_merge)(dummy_node, node).new_obj;\r\n    for (var ioid in new_obj.io) {\r\n        var io = new_obj.io[ioid];\r\n        if (io === undefined)\r\n            continue;\r\n        if (io.render_options === undefined) {\r\n            io.render_options = {\r\n                set_default: false,\r\n                type: io.type\r\n            };\r\n        }\r\n        if (io.render_options.set_default === undefined) {\r\n            io.render_options.set_default = false;\r\n        }\r\n        if (io.render_options.type === undefined) {\r\n            io.render_options.type = io.type;\r\n        }\r\n    }\r\n    return new_obj;\r\n};\r\nvar normalize_node = function (node) {\r\n    if (node.io === undefined) {\r\n        node.io = {};\r\n    }\r\n    if (node.io_order === undefined) {\r\n        if (Array.isArray(node.io)) {\r\n            node.io_order = node.io.map(function (io) { return io.id; });\r\n            var new_io = {};\r\n            for (var _i = 0, _a = node.io; _i < _a.length; _i++) {\r\n                var io = _a[_i];\r\n                new_io[io.id] = io;\r\n            }\r\n            node.io = new_io;\r\n        }\r\n        else {\r\n            node.io_order = Object.keys(node.io);\r\n        }\r\n    }\r\n    else {\r\n        if (Array.isArray(node.io)) {\r\n            var new_io = {};\r\n            for (var _b = 0, _c = node.io; _b < _c.length; _b++) {\r\n                var io = _c[_b];\r\n                new_io[io.id] = io;\r\n                if (!node.io_order.includes(io.id)) {\r\n                    node.io_order.push(io.id);\r\n                }\r\n            }\r\n            node.io = new_io;\r\n        }\r\n        else {\r\n            for (var io in node.io) {\r\n                if (!node.io_order.includes(io)) {\r\n                    node.io_order.push(io);\r\n                }\r\n            }\r\n        }\r\n    }\r\n    return node;\r\n};\r\nvar createNodeStore = function (node) {\r\n    // check if node is Object\r\n    return (0,zustand__WEBPACK_IMPORTED_MODULE_0__.create)(function (_set, _get) {\r\n        return assert_full_node(normalize_node(node));\r\n    });\r\n};\r\n\r\n\n\n//# sourceURL=webpack://ModuleName/./src/states/node.ts?");
 
 /***/ }),
 
@@ -610,6 +670,16 @@ module.exports = require("@radix-ui/react-popover");
 
 /***/ }),
 
+/***/ "@radix-ui/react-slider":
+/*!*****************************************!*\
+  !*** external "@radix-ui/react-slider" ***!
+  \*****************************************/
+/***/ ((module) => {
+
+module.exports = require("@radix-ui/react-slider");
+
+/***/ }),
+
 /***/ "@radix-ui/react-tooltip":
 /*!******************************************!*\
   !*** external "@radix-ui/react-tooltip" ***!
@@ -660,6 +730,16 @@ module.exports = require("react-json-view-lite/dist/index.css");
 
 /***/ }),
 
+/***/ "react-select":
+/*!*******************************!*\
+  !*** external "react-select" ***!
+  \*******************************/
+/***/ ((module) => {
+
+module.exports = require("react-select");
+
+/***/ }),
+
 /***/ "reactflow":
 /*!****************************!*\
   !*** external "reactflow" ***!