@linkdlab/funcnodes_react_flow 0.1.4 → 0.1.6

package/dist/css/style.css

@@ -13,25 +13,28 @@
 /*!************************************************************************************************************************************************************************************************************************!*\
   !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js!./src/frontend/node/node.scss ***!
   \************************************************************************************************************************************************************************************************************************/
-:root{--node_border_radius:5px;--handle_outer_radius:4px;--handle_inner_radius:2px;--handle_width:10;--handle_width_hover:15;--handle_overlap:3;--nodeinput_margin:2;--nodeio_shift:calc(var(--handle_overlap) - var(--nodeinput_margin));--handle_source_color:#02cff7;--handle_target_color:#089bfd;--node_background:#3e34a2;--node_header_color:#201b55}.innernode{box-sizing:border-box;display:flex;flex-direction:column;height:100%;width:100%}.innernode.intrigger .nodeheader{background-color:#abb408}.innernode.error .nodeheader{background-color:red}.nodeheader{background-color:var(--node_header_color);border-radius:var(--node_border_radius) var(--node_border_radius) 0 0;box-sizing:border-box;justify-content:space-between;padding:.1rem;width:100%}.nodeheader,.nodeheader_element{align-items:center;display:flex}.nodeheader_title{flex-grow:1;justify-content:center;margin:0 10px}.nodeheader_title,.nodeheader_title_text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nodeheader_title_text{max-width:100%}.nodeheader .triggerbutton{cursor:pointer}.nodeheader .triggerbutton:hover{color:#0cc3f5}.nodeheader .triggerbutton:active{color:#075d74}.nodename_input{background:none;border:1px solid #000;border-radius:2px;box-sizing:border-box;color:#fff;font-size:inherit;margin:2px;text-align:center}.nodefooter{background-color:#4e0ba5;border-radius:0 0 var(--node_border_radius) var(--node_border_radius);padding:.1rem;width:100%}.nodefooter:empty{display:none}.nodefooter .nodeerror{background-color:rgba(255,0,0,.459);border:1px solid red;border-radius:2px;padding:.25rem}.nodebody{flex-grow:1}.noderesizecontrol{background:#0000!important;border:none!important;font-size:.5rem}.noderesizeicon{bottom:4px;font-size:.5rem;position:absolute;right:4px}.nodeinput,.nodeoutput{background-color:inherit;border:1px solid hsla(0,0%,100%,.533);border-radius:3px;box-sizing:border-box;display:flex;flex-direction:row;margin-bottom:.1rem;margin-left:calc(var(--nodeinput_margin)*1px);margin-right:calc(var(--nodeinput_margin)*1px);margin-top:.1rem;padding:.1rem;position:relative;width:auto}.iovaluefield{align-items:start;display:flex;flex-grow:1;flex-shrink:1;justify-content:start;line-break:anywhere;margin:.2rem;overflow:hidden}.iovaluefield>input{width:100%}.ioname{color:inherit;flex-grow:1;flex-shrink:1;margin:.2rem;min-width:2rem;overflow:hidden}.nodeinput .ioname{text-align:left}.nodeoutput .ioname{text-align:right}input.nodedatainput:focus{outline:none}input.nodedatainput.styledinput,select.nodedatainput.styleddropdown{background-color:var(--node_header_color);font-size:.5rem;height:1.5rem}
+:root{--node_border_radius:5px;--handle_outer_radius:4px;--handle_inner_radius:2px;--handle_width:10;--handle_width_hover:15;--handle_overlap:3;--nodeinput_margin:2;--nodeio_shift:calc(var(--handle_overlap) - var(--nodeinput_margin));--handle_source_color:#02cff7;--handle_target_color:#089bfd;--node_background:#3e34a2;--node_header_color:#201b55}.react-flow__node{background-clip:content-box;background-color:var(--node_background);border:2px solid #fff0;border-radius:var(--node_border_radius);box-sizing:initial;color:#f0f8ff;display:flex;flex-direction:column;font-size:.5rem;max-width:200px;min-width:100px;padding:0;transform:-50%,-50%;width:auto}.react-flow__node.selected{border-color:#fff9}.react-flow__node *{box-sizing:border-box}.react-flow__handle{border-radius:0;height:calc(100% - 4px);transition:left .2s ease-in-out,right .2s ease-in-out,width .2s ease-in-out;width:calc(var(--handle_width)*1px)}.react-flow__handle:hover{width:calc(var(--handle_width_hover)*1px)}.react-flow__handle.source{background-color:var(--handle_source_color)}.react-flow__handle.target{background-color:var(--handle_target_color)}.react-flow__handle-left{border-radius:var(--handle_outer_radius) var(--handle_inner_radius) var(--handle_inner_radius) var(--handle_outer_radius);left:calc((var(--nodeio_shift) - var(--handle_width))*1px)}.react-flow__handle-left:hover{left:calc((var(--nodeio_shift) - var(--handle_width_hover))*1px)}.react-flow__handle-right{border-radius:var(--handle_inner_radius) var(--handle_outer_radius) var(--handle_outer_radius) var(--handle_inner_radius);right:calc((var(--nodeio_shift) - var(--handle_width))*1px)}.react-flow__handle-right:hover{right:calc((var(--nodeio_shift) - var(--handle_width_hover))*1px)}.react-flow__handle-top{border-radius:var(--handle_outer_radius) var(--handle_outer_radius) var(--handle_inner_radius) var(--handle_inner_radius)}.react-flow__handle-bottom{border-radius:var(--handle_inner_radius) var(--handle_inner_radius) var(--handle_outer_radius) var(--handle_outer_radius)}.innernode{box-sizing:border-box;display:flex;flex-direction:column;height:100%;width:100%}.innernode.intrigger .nodeheader{background-color:#abb408}.innernode.error .nodeheader{background-color:red}.nodeheader{background-color:var(--node_header_color);border-radius:var(--node_border_radius) var(--node_border_radius) 0 0;box-sizing:border-box;justify-content:space-between;padding:.1rem;width:100%}.nodeheader,.nodeheader_element{align-items:center;display:flex}.nodeheader_title{flex-grow:1;justify-content:center;margin:0 10px}.nodeheader_title,.nodeheader_title_text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nodeheader_title_text{max-width:100%}.nodeheader .triggerbutton{cursor:pointer}.nodeheader .triggerbutton:hover{color:#0cc3f5}.nodeheader .triggerbutton:active{color:#075d74}.nodename_input{background:none;border:1px solid #000;border-radius:2px;box-sizing:border-box;color:#fff;font-size:inherit;margin:2px;text-align:center}.nodefooter{background-color:#4e0ba5;border-radius:0 0 var(--node_border_radius) var(--node_border_radius);padding:.1rem;width:100%}.nodefooter:empty{display:none}.nodefooter .nodeerror{background-color:rgba(255,0,0,.459);border:1px solid red;border-radius:2px;padding:.25rem}.nodebody{flex-grow:1}.nodedatabody{overflow:auto}.noderesizecontrol{background:#0000!important;border:none!important;font-size:.5rem}.noderesizeicon{bottom:4px;font-size:.5rem;position:absolute;right:4px}.nodeinput,.nodeio,.nodeoutput{background-color:inherit;border:1px solid hsla(0,0%,100%,.533);border-radius:3px;box-sizing:border-box;display:flex;flex-direction:row;margin-bottom:.1rem;margin-left:calc(var(--nodeinput_margin)*1px);margin-right:calc(var(--nodeinput_margin)*1px);margin-top:.1rem;padding:.1rem;position:relative;width:auto}.iovaluefield{align-items:start;display:flex;flex-grow:1;flex-shrink:1;justify-content:start;line-break:anywhere;margin:.2rem;overflow:hidden}.iovaluefield>input{width:100%}.nodeinput>.iovaluefield{overflow:visible}.ioname{color:inherit;flex-grow:1;flex-shrink:1;margin:.2rem;min-width:2rem;overflow:hidden}.nodeinput .ioname{text-align:left}.nodeoutput .ioname{text-align:right}input.nodedatainput:focus{outline:none}.nodedatainput.styleddropdown,.nodedatastyledelement,input.nodedatainput.styledinput{background-color:var(--node_header_color);font-size:.5rem;height:1.5rem}.nodedatainput.styleddropdown:disabled,.nodedatastyledelement:disabled,input.nodedatainput.styledinput:disabled{opacity:.5}.nodedatainput.styleddropdown,input.nodedatainput.styledinput{width:100%}
 /*!*************************************************************************************************************************************************************************************************************************!*\
   !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js!./src/frontend/node/io/io.scss ***!
-  \*************************************************************************************************************************************************************************************************************************/@keyframes slideRightAndFade{0%{opacity:0;transform:translateX(-2px)}to{opacity:1;transform:translateX(0)}}@keyframes slideDownAndFade{0%{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}@keyframes slideLeftAndFade{0%{opacity:0;transform:translateX(2px)}to{opacity:1;transform:translateX(0)}}.iotooltipcontent{background-color:#f9f9f9;border:1px solid #fff;border-radius:5px;box-shadow:0 10px 38px -10px #0e121659,0 10px 20px -15px #0e121633;color:#333;cursor:default;display:flex;flex-direction:column;font-size:10px;max-height:30vh;max-width:30vw;overflow:auto;padding:10px}.iotooltip_container{display:flex;flex-direction:column;max-height:inherit;max-width:inherit}.iotooltipcontentarrow{fill:#fff}
-/*!**************************************************************************************************************************************************************************************************************************!*\
-  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js!./src/frontend/utils/table.scss ***!
-  \**************************************************************************************************************************************************************************************************************************/
-.tablecontainer{background-color:#fff;overflow:auto}.tableHead{background-color:var(--funcnodesbackground1);color:var(--funheadercolor)!important;font-weight:700!important}.tableheadercolor{color:inherit!important}.indexcol,.tableheadercolor{font-family:inherit!important;font-weight:inherit!important}.indexcol{background-color:var(--funcnodesbackground2);color:var(--funheadercolor)!important}
+  \*************************************************************************************************************************************************************************************************************************/
+s slideUpAndFade from{opacity:0;transform:translateY(2px)}s slideUpAndFade to{opacity:1;transform:translateY(0)}@keyframes slideRightAndFade{0%{opacity:0;transform:translateX(-2px)}to{opacity:1;transform:translateX(0)}}@keyframes slideDownAndFade{0%{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}@keyframes slideLeftAndFade{0%{opacity:0;transform:translateX(2px)}to{opacity:1;transform:translateX(0)}}.iotooltipcontent{background-color:#f9f9f9;border:1px solid #fff;border-radius:5px;box-shadow:0 10px 38px -10px #0e121659,0 10px 20px -15px #0e121633;color:#333;cursor:default;display:flex;flex-direction:column;font-size:10px;max-height:40vh;max-width:40vw;overflow:auto;padding:10px}.iotooltipcontent.fullsize{max-height:100vh;max-width:100vw;position:fixed;top:0}.iotooltipcontent[data-state=delayed-open][data-side=top]{animation-name:slideDownAndFade}.iotooltipcontent[data-state=delayed-open][data-side=right]{animation-name:slideLeftAndFade}.iotooltipcontent[data-state=delayed-open][data-side=bottom]{animation-name:slideUpAndFade}.iotooltipcontent[data-state=delayed-open][data-side=left]{animation-name:slideRightAndFade}.iotooltip_container{display:flex;flex-direction:column;max-height:inherit;max-width:inherit}.iotooltipcontentarrow{fill:#fff}
 /*!********************************************************************************************************************************************************************************************************************************!*\
   !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js!./src/frontend/utils/colorpicker.scss ***!
   \********************************************************************************************************************************************************************************************************************************/
 .colorspace{display:grid;grid-template-columns:auto minmax(0,1fr);margin:.2rem}.colorspace_title{font-size:.7em;font-weight:700}.colorspace label{font-size:.7rem}.colorspace input{font-size:.7rem;max-height:.7rem}.colorspace input[type=range]{-webkit-appearance:none;background-color:#666;border-radius:5px;height:.7rem;margin:0;padding:0;width:100%}.colorspace input[type=range]::-moz-range-thumb,.colorspace input[type=range]::-webkit-range-thumb,.colorspace input[type=range]::-webkit-slider-thumb{background-color:#cc1c1c;border-radius:50%;cursor:pointer;height:.7rem;width:.7rem}
+/*!***************************************************************************************************************************************************************************************************************************!*\
+  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js!./src/frontend/utils/select.scss ***!
+  \***************************************************************************************************************************************************************************************************************************/
+.styled-select__control{height:100%;min-height:auto;min-width:10px}.styled-select__menu-list{max-height:200px}.styled-select__single-value{text-align:start}.styled-select__option{padding:2px 5px;text-align:start}.styled-select__option:hover{cursor:pointer}
+/*!**************************************************************************************************************************************************************************************************************************!*\
+  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js!./src/frontend/utils/table.scss ***!
+  \**************************************************************************************************************************************************************************************************************************/
+.tablecontainer{background-color:#fff;overflow:auto}.tableHead{background-color:var(--funcnodesbackground1);color:var(--funheadercolor)!important;font-weight:700!important}.tableheadercolor{color:inherit!important}.indexcol,.tableheadercolor{font-family:inherit!important;font-weight:inherit!important}.indexcol{background-color:var(--funcnodesbackground2);color:var(--funheadercolor)!important}
 /*!*******************************************************************************************************************************************************************************************************************!*\
   !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js!./src/frontend/edge.scss ***!
   \*******************************************************************************************************************************************************************************************************************/
-:root{--funcnodesedgecolor:#7bb3ec}
+:root{--funcnodesedgecolor:#7bb3ec}.funcnodes-edge .react-flow__edge-path{stroke:var(--funcnodesedgecolor);stroke-width:2px}.funcnodes-edge.selected .react-flow__edge-path{stroke:#1f0}
 /*!****************************************************************************************************************************************************************************************************************************************************!*\
   !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js!./src/frontend/funcnodesreactflow/funcnodesreactflow.scss ***!
   \****************************************************************************************************************************************************************************************************************************************************/
-.styledbtn,.styledcheckbox,.styleddropdown,.styledinput{background-color:var(--funcnodesbackground1);border:1px solid var(--funheadercolor);border-radius:.75rem;color:var(--funcnodestextcolor1);height:2rem;padding-left:.5rem;padding-right:.5rem}.styledbtn:hover,.styledcheckbox:hover,.styleddropdown:hover,.styledinput:hover{background-color:var(--funcnodesbackground_light)}.styledbtn:active,.styledcheckbox:active,.styleddropdown:active,.styledinput:active{background-color:var(--funheadercolor);color:var(--funcnodesbackground1)}.styledbtn:focus,.styledcheckbox:focus,.styleddropdown:focus,.styledinput:focus{outline:1px solid var(--funheadercolor)}.styleddropdown{padding-right:.25rem}.styledbtn{cursor:pointer}.styledinput :focus{outline:none}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{background-color:tr;opacity:.5}.styledcheckbox{accent-color:var(--funheadercolor);height:auto}.styledcheckbox:focus{outline:none}.styledcheckbox:after{background-color:var(--funheadercolor);content:""}.styledcheckbox.checked{background-color:var(--funheadercolor);color:var(--funcnodesbackground1)}:root{--funheadercolor:#00d9ff;--funcnodesbackground1:#19192a;--funcnodesbackground2:#2e2c44;--funcnodesbackground_light:#4c4c76;--containerboarderradius:1rem;--funcnodestextcolor1:#fff}.funcnodesreactflowcontainer{background-color:var(--funcnodesbackground1);color:var(--funcnodestextcolor1);display:flex;flex-direction:column;height:100%;position:relative;width:100%}.funcnodesreactflowcontainer *{box-sizing:border-box}.funcnodesreactflowbody{display:flex;flex-direction:row}.funcnodesreactflowbody,.reactflowlayer{flex-grow:1;overflow:hidden;position:relative}.reactflowlayer{background-color:var(--funcnodesbackground2);border-radius:var(--containerboarderradius);margin:.5rem}.vscrollcontainer{box-sizing:border-box;flex-grow:1;overflow-x:hidden;overflow-y:auto;padding:.5rem}.workerselect{max-width:140px}.workerselectoption.selected{color:var(--funcnodestextcolor1)}.workerselectoption.active{color:green}.workerselectoption.inactive{color:red}
-
-/*# sourceMappingURL=style.css.map */
+.basicstyleelement,.styled-select__menu,.styledbtn,.styledcheckbox,.styleddropdown,.styledinput,.styleelement{background-color:var(--funcnodesbackground1);border:1px solid var(--funheadercolor);border-radius:.75rem;color:var(--funcnodestextcolor1)}.styledbtn,.styledcheckbox,.styleddropdown,.styledinput,.styleelement{height:2rem;padding-left:.5rem;padding-right:.5rem}.styledbtn:hover,.styledcheckbox:hover,.styleddropdown:hover,.styledinput:hover,.styleelement:hover{background-color:var(--funcnodesbackground_light)}.styledbtn:active,.styledcheckbox:active,.styleddropdown:active,.styledinput:active,.styleelement:active{background-color:var(--funheadercolor);color:var(--funcnodesbackground1)}.styledbtn:focus,.styledcheckbox:focus,.styleddropdown:focus,.styledinput:focus,.styleelement:focus{outline:1px solid var(--funheadercolor)}.styleddropdown{padding-right:.25rem}.styledbtn{cursor:pointer}.styledinput :focus{outline:none}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{background-color:tr;opacity:.5}.styledcheckbox{accent-color:var(--funheadercolor);height:auto}.styledcheckbox:focus{outline:none}.styledcheckbox:after{background-color:var(--funheadercolor);content:""}.styledcheckbox.checked{background-color:var(--funheadercolor);color:var(--funcnodesbackground1)}.SliderContainer{height:100%;min-height:20px}.SliderContainer,.SliderRoot{align-items:center;display:flex;width:100%}.SliderRoot{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;position:relative;touch-action:none;-webkit-user-select:none;user-select:none}.SliderTrack{background-color:var(--funcnodesbackground1);border-radius:9999px;flex-grow:1;height:3px;position:relative}.SliderRange{background-color:var(--funheadercolor);border-radius:9999px;height:100%;position:absolute}.SliderThumb{background-color:#fff;border-radius:10px;box-shadow:0 2px 5px rgba(0,0,0,.333);display:block;height:10px;width:10px}.SliderThumb:hover{background-color:#999}.SliderThumb:focus{box-shadow:0 0 0 5px rgba(0,0,0,.333);outline:none}.styled-select__control{height:100%;min-height:auto}.styled-select__menu-list{height:auto;max-height:200px!important;padding-left:0}.styled-select__menu{margin-left:-.5rem}.styled-select__option:hover{background-color:var(--funcnodesbackground_light)}:root{--funheadercolor:#00d9ff;--funcnodesbackground1:#19192a;--funcnodesbackground2:#2e2c44;--funcnodesbackground_light:#4c4c76;--containerboarderradius:1rem;--funcnodestextcolor1:#fff}.funcnodesreactflowcontainer{background-color:var(--funcnodesbackground1);color:var(--funcnodestextcolor1);display:flex;flex-direction:column;height:100%;position:relative;width:100%}.funcnodesreactflowcontainer *{box-sizing:border-box}.funcnodesreactflowbody{display:flex;flex-direction:row}.funcnodesreactflowbody,.reactflowlayer{flex-grow:1;overflow:hidden;position:relative}.reactflowlayer{background-color:var(--funcnodesbackground2);border-radius:var(--containerboarderradius);margin:.5rem}.vscrollcontainer{box-sizing:border-box;flex-grow:1;overflow-x:hidden;overflow-y:auto;padding:.5rem}.workerselect{max-width:140px}.workerselectoption.selected{color:var(--funcnodestextcolor1)}.workerselectoption.active{color:green}.workerselectoption.inactive{color:red}

package/dist/data_text_javascript_base64_.index.js

@@ -0,0 +1,22 @@
+"use strict";
+/*
+ * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
+ * This devtool is neither made for production nor for readable output files.
+ * It uses "eval()" calls to create a separate source file in the browser devtools.
+ * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
+ * or disable the default devtool with "devtool: false".
+ * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
+ */
+(self["webpackChunkModuleName"] = self["webpackChunkModuleName"] || []).push([["data_text_javascript_base64_"],{
+
+/***/ "data:text/javascript;base64,":
+/*!************************************!*\
+  !*** data:text/javascript;base64, ***!
+  \************************************/
+/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n\n\n//# sourceURL=webpack://ModuleName/data:text/javascript;base64,?");
+
+/***/ })
+
+}]);

package/dist/frontend/datarenderer/data_renderer_overlay.d.ts

@@ -0,0 +1,5 @@
+import { IOType } from "../../states/nodeio.t";
+declare const DataOverlayRendererForIo: (io: IOType) => ({ io }: {
+    io: IOType;
+}) => JSX.Element;
+export { DataOverlayRendererForIo };

package/dist/frontend/datarenderer/data_renderer_preview.d.ts

@@ -0,0 +1,5 @@
+import { IOType } from "../../states/nodeio.t";
+declare const DataPreviewRendererForIo: (io: IOType) => ({ io }: {
+    io: IOType;
+}) => JSX.Element;
+export { DataPreviewRendererForIo };

package/dist/frontend/datarenderer/default_preview_renderer.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import { IOType } from "../../states/nodeio.t";
+declare const Base64ImageOutput: ({ io }: {
+    io: IOType;
+}) => React.JSX.Element;
+declare const SingleValueOutput: ({ io }: {
+    io: IOType;
+}) => React.JSX.Element;
+declare const TableOutput: ({ io }: {
+    io: IOType;
+}) => React.JSX.Element;
+declare const DictOutput: ({ io }: {
+    io: IOType;
+}) => React.JSX.Element;
+export { Base64ImageOutput, SingleValueOutput, TableOutput, DictOutput };

package/dist/frontend/datarenderer/images.d.ts

@@ -1,9 +1,9 @@
-import React from 'react';
-import { BaseRenderOptions } from '.';
+import React from "react";
+import { BaseRenderOptions } from ".";
 interface ImageRenderOptions extends BaseRenderOptions {
-    format?: 'png' | 'jpeg';
+    format?: "png" | "jpeg";
 }
-declare const Base64ImageRenderer: ({ value, renderoptions }: {
+declare const Base64ImageRenderer: ({ value, renderoptions, }: {
     value: string;
     renderoptions?: ImageRenderOptions | undefined;
 }) => React.JSX.Element;

package/dist/frontend/datarenderer/index.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { RenderType } from '../../types/rendering.t';
-import { ImageRenderOptions } from './images';
+import { RenderType } from "../../types/rendering.t";
+import { ImageRenderOptions } from "./images";
 interface BaseRenderOptions {
     type?: RenderType;
 }
@@ -8,7 +8,7 @@ interface StringRenderOptions extends BaseRenderOptions {
     max_length?: number;
 }
 type RenderOptions = BaseRenderOptions | ImageRenderOptions | StringRenderOptions;
-declare const get_rendertype: (rendertype: string) => ({ value, renderoptions }: {
+declare const get_rendertype: (rendertype: string) => ({ value, renderoptions, }: {
     value: any;
     renderoptions?: RenderOptions | undefined;
 }) => JSX.Element;

package/dist/frontend/datarenderer/plotly.d.ts

@@ -1,14 +1,10 @@
-import React from 'react';
-import { BaseRenderOptions } from '.';
-interface PlotlyRenderOptions extends BaseRenderOptions {
-    plottype?: 'line' | 'scatter' | 'imshow';
-    layout?: any;
-    colorscale?: string;
-}
-declare const AnyPlot: ({ value, renderoptions }: {
-    value: any;
-    renderoptions?: PlotlyRenderOptions | undefined;
+import React from "react";
+import RendererPlugin from "../../plugin/rendenderer";
+declare const RenderFigure: ({ data, layout, staticPlot, }: {
+    data: Plotly.Data[];
+    layout: Partial<Plotly.Layout>;
+    staticPlot?: boolean | undefined;
 }) => React.JSX.Element;
-export {};
-export default AnyPlot;
-export type { PlotlyRenderOptions };
+declare const PlotlyRendererPlugin: RendererPlugin;
+export default RenderFigure;
+export { PlotlyRendererPlugin };

package/dist/frontend/datarenderer/rendermappings.d.ts

@@ -0,0 +1,122 @@
+import React, { ReactElement } from "react";
+import { IOType, InputRendererType } from "../../states/nodeio.t";
+import RendererPlugin from "../../plugin/rendenderer";
+import FuncNodesReactPlugin from "../../plugin";
+type HandlePreviewRendererType = ({ io }: {
+    io: IOType;
+}) => JSX.Element;
+type DataOverlayRendererType = ({ io }: {
+    io: IOType;
+}) => JSX.Element;
+type DataPreviewViewRendererType = ({ io }: {
+    io: IOType;
+}) => JSX.Element;
+type DataViewRendererType = ({ io }: {
+    io: IOType;
+}) => JSX.Element;
+interface RenderMappingState {
+    Inputrenderer: {
+        [key: string]: InputRendererType;
+    };
+    HandlePreviewRenderer: {
+        [key: string]: HandlePreviewRendererType;
+    };
+    DataOverlayRenderer: {
+        [key: string]: DataOverlayRendererType;
+    };
+    DataPreviewViewRenderer: {
+        [key: string]: DataPreviewViewRendererType;
+    };
+    DataViewRenderer: {
+        [key: string]: DataViewRendererType;
+    };
+}
+interface DispatchOptions {
+    overwrite?: boolean;
+}
+interface extend_input_renderer_action {
+    type: "EXTEND_INPUT_RENDER";
+    payload: {
+        type: string;
+        component: InputRendererType;
+    };
+    options?: DispatchOptions;
+}
+interface extend_handle_preview_renderer_action {
+    type: "EXTEND_HANDLE_PREVIEW_RENDER";
+    payload: {
+        type: string;
+        component: HandlePreviewRendererType;
+    };
+    options?: DispatchOptions;
+}
+interface extend_data_overlay_renderer_action {
+    type: "EXTEND_DATA_OVERLAY_RENDER";
+    payload: {
+        type: string;
+        component: DataOverlayRendererType;
+    };
+    options?: DispatchOptions;
+}
+interface extend_data_preview_renderer_action {
+    type: "EXTEND_DATA_PREVIEW_RENDER";
+    payload: {
+        type: string;
+        component: DataPreviewViewRendererType;
+    };
+    options?: DispatchOptions;
+}
+interface extend_data_view_renderer_action {
+    type: "EXTEND_DATA_VIEW_RENDER";
+    payload: {
+        type: string;
+        component: DataViewRendererType;
+    };
+    options?: DispatchOptions;
+}
+interface extend_from_plugin_action {
+    type: "EXTEND_FROM_PLUGIN";
+    payload: {
+        plugin: RendererPlugin;
+    };
+    options?: DispatchOptions;
+}
+type renderMappingAction = extend_input_renderer_action | extend_handle_preview_renderer_action | extend_data_overlay_renderer_action | extend_data_preview_renderer_action | extend_data_view_renderer_action | extend_from_plugin_action;
+declare const RenderMappingProvider: ({ children, plugins, }: {
+    children: ReactElement;
+    plugins: {
+        [key: string]: FuncNodesReactPlugin;
+    };
+}) => React.JSX.Element;
+declare const RenderMappingContext: React.Context<{
+    Inputrenderer: {
+        [key: string]: InputRendererType;
+    };
+    HandlePreviewRenderer: {
+        [key: string]: HandlePreviewRendererType;
+    };
+    DataOverlayRenderer: {
+        [key: string]: DataOverlayRendererType;
+    };
+    DataPreviewViewRenderer: {
+        [key: string]: DataPreviewViewRendererType;
+    };
+    DataViewRenderer: {
+        [key: string]: DataViewRendererType;
+    };
+    extendInputRenderMapping: (_type: string, _component: InputRendererType, _options: DispatchOptions) => void;
+    extendHandlePreviewRenderMapping: (_type: string, _component: HandlePreviewRendererType, _options: DispatchOptions) => void;
+    extendDataOverlayRenderMapping: (_type: string, _component: DataOverlayRendererType, _options: DispatchOptions) => void;
+    extendDataPreviewRenderMapping: (_type: string, _component: DataPreviewViewRendererType, _options: DispatchOptions) => void;
+    extendDataViewRenderMapping: (_type: string, _component: DataViewRendererType, _options: DispatchOptions) => void;
+    extendFromPlugin: (_plugin: RendererPlugin, _options: DispatchOptions) => void;
+}>;
+interface DynamicComponentLoaderProps<P> {
+    component: React.ComponentType<P>;
+}
+interface DynamicComponentLoaderProps<P> {
+    component: React.ComponentType<P>;
+}
+declare const DynamicComponentLoader: <P extends object>({ component: Component, ...props }: DynamicComponentLoaderProps<P> & P) => JSX.Element;
+export { RenderMappingContext, RenderMappingProvider, DynamicComponentLoader };
+export type { RenderMappingState, extend_input_renderer_action, extend_handle_preview_renderer_action, extend_data_overlay_renderer_action, extend_data_preview_renderer_action, extend_data_view_renderer_action, extend_from_plugin_action, renderMappingAction, HandlePreviewRendererType, DataOverlayRendererType, DataPreviewViewRendererType, DataViewRendererType, };

package/dist/frontend/dialog.d.ts

@@ -10,6 +10,7 @@ interface CustomDialogProps {
     buttons?: {
         text: string;
         onClick: () => void;
+        close?: boolean;
     }[];
 }
 declare const CustomDialog: ({ trigger, title, description, children, closebutton, onOpenChange, buttons, }: CustomDialogProps) => React.JSX.Element;

package/dist/frontend/edge.d.ts

@@ -1,5 +1,5 @@
-import { EdgeProps } from 'reactflow';
-import './edge.scss';
-import React from 'react';
+import { EdgeProps } from "reactflow";
+import "./edge.scss";
+import React from "react";
 declare const DefaultEdge: ({ id, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, data, ...props }: EdgeProps) => React.JSX.Element;
 export default DefaultEdge;

package/dist/frontend/funcnodesreactflow/index.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import { FuncNodesReactFlowZustandInterface } from "../../states/fnrfzst.t";
+import { FuncNodesReactFlowZustandInterface, FuncnodesReactFlowProps } from "../../states/fnrfzst.t";
 declare const FuncNodesContext: React.Context<FuncNodesReactFlowZustandInterface>;
-declare const FuncnodesReactFlow: () => React.JSX.Element;
+declare const FuncnodesReactFlow: ({ useWorkerManager, default_worker, }: FuncnodesReactFlowProps) => React.JSX.Element;
 export default FuncnodesReactFlow;
 export { FuncNodesContext };

package/dist/frontend/funcnodesreactflow/react_flow_layer.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import 'reactflow/dist/style.css';
-import './funcnodesreactflow.scss';
+import React from "react";
+import "reactflow/dist/style.css";
+import "./funcnodesreactflow.scss";
 declare const ReactFlowLayer: () => React.JSX.Element;
 export default ReactFlowLayer;

package/dist/frontend/lib.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
-import './lib.scss';
-import { Shelf } from '../states/lib.t';
+import React from "react";
+import "./lib.scss";
+import { Shelf } from "../states/lib.t";
 declare const LibraryShelf: ({ item, filter }: {
     item: Shelf;
     filter: string;

package/dist/frontend/node/body_data_renderer.d.ts

@@ -0,0 +1,7 @@
+import { IOType } from "../../states/nodeio.t";
+declare const BodyDataRendererForIo: (io: IOType) => [({ io }: {
+    io: IOType;
+}) => JSX.Element, ({ io }: {
+    io: IOType;
+}) => JSX.Element];
+export { BodyDataRendererForIo };

package/dist/frontend/node/io/default_input_renderer.d.ts

@@ -1,11 +1,11 @@
-import { InputRendererProps } from '../../../states/nodeio.t';
-import React from 'react';
+import { InputRendererProps } from "../../../states/nodeio.t";
+import React from "react";
 declare const BooleanInput: ({ io, inputconverter }: InputRendererProps) => React.JSX.Element;
 declare const FloatInput: ({ io, inputconverter }: InputRendererProps) => React.JSX.Element;
 declare const IntegerInput: ({ io, inputconverter }: InputRendererProps) => React.JSX.Element;
 declare const StringInput: ({ io, inputconverter }: InputRendererProps) => React.JSX.Element;
-declare const SelectionInput: ({ io, inputconverter, parser }: InputRendererProps & {
+declare const SelectionInput: ({ io, inputconverter, parser, }: InputRendererProps & {
     parser?(s: string): any;
 }) => React.JSX.Element;
 declare const ColorInput: ({ io }: InputRendererProps) => React.JSX.Element;
-export { FloatInput, IntegerInput, BooleanInput, StringInput, SelectionInput, ColorInput };
+export { FloatInput, IntegerInput, BooleanInput, StringInput, SelectionInput, ColorInput, };

package/dist/frontend/node/io/default_output_render.d.ts

@@ -1,5 +1,5 @@
-import { IOType } from '../../../states/nodeio.t';
-import React from 'react';
+import { IOType } from "../../../states/nodeio.t";
+import React from "react";
 declare const InLineOutput: ({ io }: {
     io: IOType;
 }) => React.JSX.Element;

package/dist/frontend/node/io/handle_renderer.d.ts

@@ -1,5 +1,7 @@
-import { IOType } from '../../../states/nodeio.t';
-declare const PreviewHandleDataRendererForIo: (io: IOType) => ({ io }: {
+import { IOType } from "../../../states/nodeio.t";
+declare const PreviewHandleDataRendererForIo: (io: IOType) => [({ io }: {
     io: IOType;
-}) => JSX.Element;
+}) => JSX.Element, ({ io }: {
+    io: IOType;
+}) => JSX.Element];
 export { PreviewHandleDataRendererForIo };

package/dist/frontend/node/io/io.d.ts

@@ -1,7 +1,7 @@
-import './io.scss';
-import { HandleProps } from 'reactflow';
-import React from 'react';
-import { IOType, SerializedType } from '../../../states/nodeio.t';
+import "./io.scss";
+import { HandleProps } from "reactflow";
+import React from "react";
+import { IOType, SerializedType } from "../../../states/nodeio.t";
 declare const pick_best_io_type: (iot: SerializedType, typemap: {
     [key: string]: string;
 }) => [string | undefined, string | undefined];

package/dist/frontend/node/io/nodeinput.d.ts

@@ -1,5 +1,5 @@
-import { IOType } from '../../../states/nodeio.t';
-import React from 'react';
+import { IOType } from "../../../states/nodeio.t";
+import React from "react";
 declare const NodeInput: ({ io }: {
     io: IOType;
 }) => React.JSX.Element;

package/dist/frontend/node/io/nodeoutput.d.ts

@@ -1,5 +1,5 @@
-import { IOType } from '../../../states/nodeio.t';
-import React from 'react';
+import { IOType } from "../../../states/nodeio.t";
+import React from "react";
 declare const NodeOutput: ({ io }: {
     io: IOType;
 }) => React.JSX.Element;

package/dist/frontend/node/node.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
-import { NodeStore } from '../../states/node.t';
-import './node.scss';
+import React from "react";
+import { NodeStore } from "../../states/node.t";
+import "./node.scss";
 /**
  * A generic function to deeply merge two objects of type T.
  *

package/dist/frontend/utils/colorpicker.d.ts

@@ -1,19 +1,21 @@
-import React from 'react';
-import './colorpicker.scss';
-declare const HSLColorPicker: ({ onChange, colorconverter }: {
+import React from "react";
+import "./colorpicker.scss";
+declare const HSLColorPicker: ({ onChange, colorconverter, allow_null, }: {
     onChange: (colorconverter: {
         [key: string]: () => number[] | string;
-    }) => void;
+    } | null) => void;
     colorconverter: {
         [key: string]: () => number[] | string;
-    };
+    } | null;
+    allow_null?: boolean | undefined;
 }) => React.JSX.Element;
-declare const CustomColorPicker: ({ inicolordata, inicolorspace, onChange }: {
-    inicolordata?: string | string[] | number[] | undefined;
+declare const CustomColorPicker: ({ inicolordata, inicolorspace, allow_null, onChange, }: {
+    inicolordata?: string | number[] | string[] | undefined;
     inicolorspace?: string | undefined;
+    allow_null?: boolean | undefined;
     onChange?: ((colorconverter: {
         [key: string]: () => number[] | string;
-    }) => void) | undefined;
+    } | null) => void) | undefined;
 }) => React.JSX.Element;
 export default CustomColorPicker;
 export { HSLColorPicker };

package/dist/frontend/utils/jsondata.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import 'react-json-view-lite/dist/index.css';
+import React from "react";
+import "react-json-view-lite/dist/index.css";
 declare const JSONDataDisplay: ({ data }: {
     data: any;
 }) => React.JSX.Element;

package/dist/frontend/utils/select.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import { ActionMeta, SingleValue } from "react-select";
+import "./select.scss";
+declare const CustomSelect: <Option extends {
+    value: string;
+    label: string;
+}>({ options, items_per_page, className, defaultValue, onChange, }: {
+    options: Option[];
+    items_per_page?: number | undefined;
+    className?: string | undefined;
+    defaultValue?: Option | undefined;
+    onChange: (newValue: SingleValue<Option>, actionMeta: ActionMeta<Option>) => void;
+}) => React.JSX.Element;
+export default CustomSelect;

package/dist/frontend/utils/table.d.ts

@@ -1,5 +1,5 @@
-import './table.scss';
-import React from 'react';
+import "./table.scss";
+import React from "react";
 interface TableData {
     columns: string[];
     index: string[];

package/dist/funcnodes/funcnodesworker.d.ts

@@ -1,46 +1,59 @@
 /// <reference types="node" />
-import { FuncNodesReactFlowZustandInterface, JSONMessage, NodeSpaceEvent } from '../states/fnrfzst.t';
-import { NodeActionUpdate, NodeType, PartialNodeType } from '../states/node.t';
+import { FuncNodesReactFlowZustandInterface, JSONMessage, NodeSpaceEvent } from "../states/fnrfzst.t";
+import { NodeActionUpdate, NodeType, PartialNodeType } from "../states/node.t";
 interface WorkerProps {
-    zustand: FuncNodesReactFlowZustandInterface;
+    zustand?: FuncNodesReactFlowZustandInterface;
     uuid: string;
     on_error?: (error: string | Error) => void;
 }
 declare class FuncNodesWorker {
     messagePromises: Map<string, any>;
-    _zustand: FuncNodesReactFlowZustandInterface;
-    _nodeupdates: Map<string, PartialNodeType>;
+    _zustand?: FuncNodesReactFlowZustandInterface;
+    _local_nodeupdates: Map<string, PartialNodeType>;
     _nodeupdatetimer: NodeJS.Timeout;
     uuid: string;
     is_open: boolean;
     on_error: (error: any) => void;
     constructor(data: WorkerProps);
+    set_zustand(zustand: FuncNodesReactFlowZustandInterface): void;
+    stepwise_fullsync(): Promise<void>;
+    sync_lib(): Promise<void>;
+    sync_external_worker(): Promise<void>;
+    sync_funcnodes_plugins(): Promise<void>;
+    sync_view_state(): Promise<void>;
+    sync_nodespace(): Promise<void>;
     fullsync(): Promise<void>;
     _recieve_edge_added(src_nid: string, src_ioid: string, trg_nid: string, trg_ioid: string): Promise<void>;
     trigger_node(node_id: string): Promise<void>;
     add_node(node_id: string): Promise<void>;
     remove_node(node_id: string): Promise<void>;
     _recieve_node_added(data: NodeType): Promise<void>;
-    add_edge({ src_nid, src_ioid, trg_nid, trg_ioid, replace }: {
+    add_edge({ src_nid, src_ioid, trg_nid, trg_ioid, replace, }: {
         src_nid: string;
         src_ioid: string;
         trg_nid: string;
         trg_ioid: string;
         replace?: boolean;
     }): Promise<any>;
-    remove_edge({ src_nid, src_ioid, trg_nid, trg_ioid }: {
+    remove_edge({ src_nid, src_ioid, trg_nid, trg_ioid, }: {
         src_nid: string;
         src_ioid: string;
         trg_nid: string;
         trg_ioid: string;
     }): Promise<any>;
-    perform_update(): void;
-    update_node(action: NodeActionUpdate): void;
-    set_io_value({ nid, ioid, value, set_default }: {
+    add_external_worker({ module, cls_module, cls_name, }: {
+        module: string;
+        cls_module: string;
+        cls_name: string;
+    }): Promise<any>;
+    sync_local_node_updates(): void;
+    locally_update_node(action: NodeActionUpdate): void;
+    get_remote_node_state(nid: string): Promise<void>;
+    set_io_value({ nid, ioid, value, set_default, }: {
         nid: string;
         ioid: string;
         value: any;
-        set_default?: boolean;
+        set_default: boolean;
     }): Promise<any>;
     clear(): Promise<any>;
     save(): Promise<any>;
@@ -49,15 +62,17 @@ declare class FuncNodesWorker {
         nid: string;
         ioid: string;
     }): Promise<any>;
-    _send_cmd({ cmd, kwargs, wait_for_response, response_timeout }: {
+    _send_cmd({ cmd, kwargs, wait_for_response, response_timeout, retries, }: {
         cmd: string;
         kwargs?: any;
         wait_for_response?: boolean;
         response_timeout?: number;
+        retries?: number;
     }): Promise<any>;
     send(_data: any): Promise<void>;
     recieve_nodespace_event({ event, data }: NodeSpaceEvent): Promise<void>;
     add_lib(lib: string): Promise<any>;
+    add_worker_package(pkg: string): Promise<any>;
     recieve(data: JSONMessage): Promise<any>;
     disconnect(): void;
     onclose(): void;
@@ -67,6 +82,7 @@ declare class FuncNodesWorker {
         nid: string;
         ioid: string;
     }): Promise<any>;
+    get_node_status(nid: string): Promise<any>;
 }
 export default FuncNodesWorker;
 export type { WorkerProps };

package/dist/index.d.ts

@@ -1,2 +1,7 @@
-import FuncnodesReactFlow from './frontend';
+import FuncnodesReactFlow from "./frontend";
+import WebSocketWorker from "./funcnodes/websocketworker";
+import FuncNodesReactPlugin, { RendererPlugin } from "./plugin";
+import { IOType } from "./states/nodeio.t";
 export default FuncnodesReactFlow;
+export { WebSocketWorker };
+export type { IOType, FuncNodesReactPlugin, RendererPlugin };