@kineticdata/react 6.0.5 → 6.1.1

package/lib/components/table/tests/components.js

@@ -18,7 +18,7 @@ var _excluded = ["header", "body", "footer"],
   _excluded9 = ["cells"],
   _excluded10 = ["filters"],
   _excluded11 = ["fields", "error", "buttons"],
-  _excluded12 = ["table", "pagination", "filter", "columnControl"];
+  _excluded12 = ["table", "pagination", "filter", "filterControl", "columnControl"];
 var stringifyProps = function stringifyProps(props) {
   return JSON.stringify(props,
   // Make sure functions are stringified to an empty function string
@@ -138,6 +138,12 @@ var mockTableConfig = exports.mockTableConfig = {
       type: "submit"
     }, "Search"));
   },
+  FilterControl: function FilterControl(props) {
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      "data-testid": "FilterControlMock",
+      "data-props": stringifyProps(props)
+    });
+  },
   TextFilter: function TextFilter(props) {
     return /*#__PURE__*/_react["default"].createElement("div", {
       "data-testid": "TextFilterMock",
@@ -173,10 +179,11 @@ var TableViewMock = exports.TableViewMock = function TableViewMock(_ref12) {
   var table = _ref12.table,
     pagination = _ref12.pagination,
     filter = _ref12.filter,
+    filterControl = _ref12.filterControl,
     columnControl = _ref12.columnControl,
     props = (0, _objectWithoutProperties2["default"])(_ref12, _excluded12);
   return /*#__PURE__*/_react["default"].createElement("div", {
     "data-testid": "TableViewMock",
     "data-props": stringifyProps(props)
-  }, table, pagination, filter, columnControl);
+  }, table, pagination, filterControl, filter, columnControl);
 };

package/lib/components/task/builder/Connector.js

@@ -31,23 +31,23 @@ var Connector = exports.Connector = /*#__PURE__*/function (_Component) {
     _this.setTreeBuilder = function (treeBuilder) {
       _this.treeBuilder = treeBuilder;
     };
-    /*****************************************************************************
-     * Click handlers                                                            *
+    /*****************************************************************************
+     * Click handlers                                                            *
      ****************************************************************************/
     _this.onSelect = function (event) {
       if (typeof _this.props.onSelect === 'function') {
         _this.props.onSelect(_this.props.connector, event.shiftKey);
       }
     };
-    /*****************************************************************************
-     * Drag-and-drop support                                                     *
-     * Leverages the `watchDrag` helper exposed by the `TreeBuilder` instance.   *
-     * On move we update this instance's `head` or `tail` properties and set     *
-     * `dragging` to either "head" or "tail" so that the `draw` method knows if  *
-     * we are drawing to a dragging point or to the center of a node.            *
-     * On drop we check to see if the point we are dropping at is within a node  *
-     * (we check that its a valid node as well) and dispatch a redux action to   *
-     * persist the change or we reset the `head` or `tail` properties and `draw` *
+    /*****************************************************************************
+     * Drag-and-drop support                                                     *
+     * Leverages the `watchDrag` helper exposed by the `TreeBuilder` instance.   *
+     * On move we update this instance's `head` or `tail` properties and set     *
+     * `dragging` to either "head" or "tail" so that the `draw` method knows if  *
+     * we are drawing to a dragging point or to the center of a node.            *
+     * On drop we check to see if the point we are dropping at is within a node  *
+     * (we check that its a valid node as well) and dispatch a redux action to   *
+     * persist the change or we reset the `head` or `tail` properties and `draw` *
      ****************************************************************************/
     _this.dragHead = function (event) {
       _this.treeBuilder.watchDrag({
@@ -119,49 +119,53 @@ var Connector = exports.Connector = /*#__PURE__*/function (_Component) {
       _this.tail = point;
       _this.draw();
     };
-    /*****************************************************************************
-     * Rendering                                                                 *
-     * To make the drag-and-drop perform as fast as possible we manually         *
-     * manipulate some DOM elements in the `draw` method below. Anything that    *
-     * changes the instance's `head` or `tail` properties should also call       *
-     * `draw`                                                                    *
+    /*****************************************************************************
+     * Rendering                                                                 *
+     * To make the drag-and-drop perform as fast as possible we manually         *
+     * manipulate some DOM elements in the `draw` method below. Anything that    *
+     * changes the instance's `head` or `tail` properties should also call       *
+     * `draw`                                                                    *
      ****************************************************************************/
     _this.draw = function () {
       _this.connector.current.parentElement.style.display = '';
       var _getRectIntersections = (0, _helpers.getRectIntersections)((0, _assertThisInitialized2["default"])(_this)),
-        _getRectIntersections2 = (0, _slicedToArray2["default"])(_getRectIntersections, 2),
+        _getRectIntersections2 = (0, _slicedToArray2["default"])(_getRectIntersections, 3),
         _getRectIntersections3 = _getRectIntersections2[0],
         x1 = _getRectIntersections3.x,
         y1 = _getRectIntersections3.y,
         _getRectIntersections4 = _getRectIntersections2[1],
         x2 = _getRectIntersections4.x,
-        y2 = _getRectIntersections4.y;
+        y2 = _getRectIntersections4.y,
+        nodesOverlap = _getRectIntersections2[2];
       var dx = x2 - x1;
       var dy = y2 - y1;
       var length = Math.sqrt(Math.pow(dx, 2) + Math.pow(dy, 2));
       var angle = Math.atan2(dy, dx) * 180 / Math.PI + 180;
-      var connectorValue = _helpers.isIE11 ? "translate(".concat(x2, " ").concat(y2, ") rotate(").concat(angle, ")") : "translate(".concat(x2, "px, ").concat(y2, "px) rotate(").concat(angle, "deg)");
-      var connectorLabelValue = _helpers.isIE11 ? "translate(".concat(x1 + dx / 2, " ").concat(y1 + dy / 2, ")") : "translate(".concat(x1 + dx / 2, "px, ").concat(y1 + dy / 2, "px)");
-      if (_helpers.isIE11) {
-        _this.connector.current.transform = connectorValue;
-        if (_this.connectorLabel.current) {
-          _this.connectorLabel.current.transform = connectorLabelValue;
-        }
+      var connectorValue = "translate(".concat(x2, "px, ").concat(y2, "px) rotate(").concat(angle, "deg)");
+      var connectorLabelValue = "translate(".concat(x1 + dx / 2, "px, ").concat(y1 + dy / 2, "px)");
+
+      // If the nodes overlap, hide the connector line
+      if (nodesOverlap) {
+        _this.connector.current.style.display = 'none';
       } else {
-        _this.connector.current.style.transform = connectorValue;
-        if (_this.connectorLabel.current) {
-          _this.connectorLabel.current.style.transform = connectorLabelValue;
+        _this.connector.current.style.display = '';
+      }
+      _this.connector.current.style.transform = connectorValue;
+      if (_this.connectorLabel.current) {
+        var _this$props$connector3;
+        _this.connectorLabel.current.style.transform = connectorLabelValue;
+        // If the nodes overlap or the connector has an id, show the label
+        if (nodesOverlap || ((_this$props$connector3 = _this.props.connector) === null || _this$props$connector3 === void 0 ? void 0 : _this$props$connector3.id) !== null) {
+          _this.connectorLabel.current.style.display = '';
+        } else {
+          // If nodes don't overlap for a new connector, hide the label
+          _this.connectorLabel.current.style.display = 'none';
         }
       }
-
-      // this.connector.current.setAttribute(attribute, connectorValue);
       if (_this.connectorTail.current) {
         _this.connectorTail.current.setAttribute('cx', length);
       }
       _this.connectorBody.current.setAttribute('x2', length);
-      // if (this.connectorLabel.current) {
-      //   this.connectorLabel.current.setAttribute(attribute, connectorLabelValue);
-      // }
     };
     _this.connector = /*#__PURE__*/(0, _react.createRef)();
     _this.connectorBody = /*#__PURE__*/(0, _react.createRef)();
@@ -172,11 +176,11 @@ var Connector = exports.Connector = /*#__PURE__*/function (_Component) {
   (0, _createClass2["default"])(Connector, [{
     key: "shouldComponentUpdate",
     value:
-    /*****************************************************************************
-     * React lifecycle                                                           *
-     * Check the `connector` prop for change, which should be an immutable       *
-     * record. If that prop changes we need to sync the instance's `head` and    *
-     * `tail` values and call `draw`.                                            *
+    /*****************************************************************************
+     * React lifecycle                                                           *
+     * Check the `connector` prop for change, which should be an immutable       *
+     * record. If that prop changes we need to sync the instance's `head` and    *
+     * `tail` values and call `draw`.                                            *
      ****************************************************************************/
 
     function shouldComponentUpdate(nextProps) {
@@ -256,7 +260,7 @@ var Connector = exports.Connector = /*#__PURE__*/function (_Component) {
         className: "connector-head high-detail",
         points: constants.CONNECTOR_HEAD_POINTS,
         onMouseDown: this.dragHead
-      })), id !== null && /*#__PURE__*/_react["default"].createElement("g", {
+      })), id !== null ? /*#__PURE__*/_react["default"].createElement("g", {
         ref: this.connectorLabel,
         className: "connector-button",
         onClick: this.onSelect
@@ -300,7 +304,13 @@ var Connector = exports.Connector = /*#__PURE__*/function (_Component) {
         y: -constants.ICON_CENTER,
         height: constants.ICON_SIZE,
         width: constants.ICON_SIZE
-      }))));
+      }))) : /*#__PURE__*/_react["default"].createElement("circle", {
+        ref: this.connectorLabel,
+        className: "connector-placeholder",
+        r: constants.CONNECTOR_TAIL_RADIUS,
+        cx: "0",
+        cy: "0"
+      }));
     }
   }]);
   return Connector;

package/lib/components/task/builder/ConnectorForm.js

@@ -9,18 +9,22 @@ var _helpers = require("./helpers");
 var dataSources = function dataSources(_ref) {
   var tasks = _ref.tasks,
     tree = _ref.tree,
-    connector = _ref.connector;
+    connector = _ref.connector,
+    connections = _ref.connections;
   return {
     bindings: {
       fn: _helpers.buildBindings,
-      params: [tree, tasks, tree.nodes.get(connector.headId)]
+      params: [{
+        tree: tree,
+        tasks: tasks,
+        node: tree.nodes.get(connector.headId),
+        connections: connections
+      }]
     }
   };
 };
 var fields = function fields(_ref2) {
-  var connector = _ref2.connector,
-    tasks = _ref2.tasks,
-    tree = _ref2.tree;
+  var connector = _ref2.connector;
   return function (_ref3) {
     var bindings = _ref3.bindings;
     return bindings && [{
@@ -49,7 +53,7 @@ var fields = function fields(_ref2) {
       label: 'Condition',
       type: 'code',
       initialValue: connector.condition,
-      language: 'ruby',
+      language: 'ruby-expression',
       options: bindings
     }, {
       name: 'from',
@@ -82,7 +86,7 @@ var handleSubmit = function handleSubmit(_ref4) {
   };
 };
 var ConnectorForm = exports.ConnectorForm = (0, _Form.generateForm)({
-  formOptions: ['connector', 'tasks', 'tree'],
+  formOptions: ['connections', 'connector', 'tasks', 'tree'],
   dataSources: dataSources,
   fields: fields,
   handleSubmit: handleSubmit

package/lib/components/task/builder/Node.js

@@ -28,8 +28,8 @@ var Node = exports.Node = /*#__PURE__*/function (_Component) {
     var _this;
     (0, _classCallCheck2["default"])(this, Node);
     _this = _super.call(this, props);
-    /*****************************************************************************
-     * Click handlers                                                            *
+    /*****************************************************************************
+     * Click handlers                                                            *
      ****************************************************************************/
     _this.onSelect = function (shiftKey) {
       return function () {
@@ -38,15 +38,15 @@ var Node = exports.Node = /*#__PURE__*/function (_Component) {
         }
       };
     };
-    /*****************************************************************************
-     * Drag-and-drop support                                                     *
-     * Leverages the `watchDrag` helper exposed by the `TreeBuilder` instance.   *
-     * On move we need to update any related connectors manually (for maximum    *
-     * performance).                                                             *
-     * On drop we dispatch an action to update the node in redux to persist the  *
-     * change.                                                                   *
-     * We also watch for drag on the plus button, which should leverage the      *
-     * `TreeBuilder` instance to start creating a new connector                  *
+    /*****************************************************************************
+     * Drag-and-drop support                                                     *
+     * Leverages the `watchDrag` helper exposed by the `TreeBuilder` instance.   *
+     * On move we need to update any related connectors manually (for maximum    *
+     * performance).                                                             *
+     * On drop we dispatch an action to update the node in redux to persist the  *
+     * change.                                                                   *
+     * We also watch for drag on the plus button, which should leverage the      *
+     * `TreeBuilder` instance to start creating a new connector                  *
      ****************************************************************************/
     _this.drag = function (event) {
       _this.treeBuilder.watchDrag({
@@ -101,15 +101,15 @@ var Node = exports.Node = /*#__PURE__*/function (_Component) {
   }, {
     key: "shouldComponentUpdate",
     value:
-    /*****************************************************************************
-     * React lifecycle                                                           *
-     * Check the `node` prop for change, which should be an immutable record.    *
-     * If that prop changes we need to sync the instance's `position` value and  *
-     * call `draw`.                                                              *
+    /*****************************************************************************
+     * React lifecycle                                                           *
+     * Check the `node` prop for change, which should be an immutable record.    *
+     * If that prop changes we need to sync the instance's `position` value and  *
+     * call `draw`.                                                              *
      ****************************************************************************/
 
     function shouldComponentUpdate(nextProps) {
-      return !this.props.node.equals(nextProps.node) || this.props.primary !== nextProps.primary || this.props.selected !== nextProps.selected || this.props.highlighted !== nextProps.highlighted;
+      return !this.props.node.equals(nextProps.node) || this.props.primary !== nextProps.primary || this.props.selected !== nextProps.selected || this.props.highlighted !== nextProps.highlighted || this.props.missingIntegration !== nextProps.missingIntegration;
     }
   }, {
     key: "componentDidMount",
@@ -124,26 +124,16 @@ var Node = exports.Node = /*#__PURE__*/function (_Component) {
       this.draw();
     }
 
-    /*****************************************************************************
-     * Rendering                                                                 *
-     * To make the drag-and-drop perform as fast as possible we manually         *
-     * manipulate some DOM elements in the `draw` method below. Anything that    *
-     * changes the instance's `position` property should also call `draw`        *
+    /*****************************************************************************
+     * Rendering                                                                 *
+     * To make the drag-and-drop perform as fast as possible we manually         *
+     * manipulate some DOM elements in the `draw` method below. Anything that    *
+     * changes the instance's `position` property should also call `draw`        *
      ****************************************************************************/
   }, {
     key: "draw",
     value: function draw() {
-      // const attribute = isIE11 ? 'transform' : 'style';
-      // const value = isIE11
-      //   ? `translate(${this.position.x} ${this.position.y})`
-      //   : `transform: translate(${this.position.x}px,  ${this.position.y}px)`;
-      // this.el.current.setAttribute(attribute, value);
-
-      if (_helpers.isIE11) {
-        this.el.current.transform = "translate(".concat(this.position.x, " ").concat(this.position.y, ")");
-      } else {
-        this.el.current.style.transform = "translate(".concat(this.position.x, "px,  ").concat(this.position.y, "px)");
-      }
+      this.el.current.style.transform = "translate(".concat(this.position.x, "px,  ").concat(this.position.y, "px)");
     }
   }, {
     key: "render",
@@ -153,17 +143,19 @@ var Node = exports.Node = /*#__PURE__*/function (_Component) {
         highlighted = _this$props.highlighted,
         primary = _this$props.primary,
         selected = _this$props.selected,
+        missingIntegration = _this$props.missingIntegration,
         tasks = _this$props.tasks;
       var defers = node.defers,
         definitionId = node.definitionId,
         id = node.id,
         name = node.name;
       var tempNode = typeof id !== 'number';
-      var missing = !tempNode && !tasks.has(node.definitionId) && !node.definitionId.startsWith('system_tree_return_v') && !node.definitionId.startsWith('system_start_v');
+      var isRoutine = tasks.get(definitionId) && (0, _lodashEs.isArray)(tasks.get(definitionId).inputs);
+      var isIntegration = node.definitionId.startsWith("".concat(_constants.ADVANCED_HANDLER_NAME_INTEGRATION, "_v"));
+      var missing = !tempNode && !tasks.has(node.definitionId) && !node.definitionId.startsWith('system_tree_return_v') && !node.definitionId.startsWith('system_start_v') || missingIntegration;
       var invalid = missing || !tempNode && !name || node.parameters.some(function (parameter) {
         return parameter.required && parameter.value === '';
       });
-      var isRoutine = tasks.get(definitionId) && (0, _lodashEs.isArray)(tasks.get(definitionId).inputs);
       var type = (0, _helpers.getNodeType)(node);
       var height = type === 'join' || type === 'junction' ? constants.NODE_JOIN_JUNCTION_HEIGHT : type === 'start' ? constants.NODE_START_RADIUS * 2 : constants.NODE_HEIGHT;
       var width = type === 'start' ? constants.NODE_START_RADIUS * 2 : constants.NODE_WIDTH;
@@ -215,6 +207,10 @@ var Node = exports.Node = /*#__PURE__*/function (_Component) {
         d: constants.NODE_LEFT_BAR_PATH,
         className: "routine-bar",
         strokeWidth: constants.NODE_DECORATION_STROKE_WIDTH
+      }), isIntegration && /*#__PURE__*/_react["default"].createElement("path", {
+        d: constants.NODE_PLUG_BAR_PATH,
+        className: "integration-bar",
+        strokeWidth: constants.NODE_DECORATION_STROKE_WIDTH
       }), type === 'loop-head' && /*#__PURE__*/_react["default"].createElement("path", {
         d: constants.NODE_BOTTOM_BAR_PATH,
         className: "loop-bar",

package/lib/components/task/builder/NodeForm.js

@@ -10,16 +10,23 @@ var _immutable = require("immutable");
 var _Form = require("../../form/Form");
 var _models = require("./models");
 var _helpers = require("./helpers");
+var _constants = require("./constants");
 var _apis = require("../../../apis");
-var _TaskDefinitionConfigForm = require("./TaskDefinitionConfigForm");
 var dataSources = function dataSources(_ref) {
+  var _tasks$get, _tasks$get2, _tasks$get3, _tasks$get4;
   var tasks = _ref.tasks,
     tree = _ref.tree,
-    node = _ref.node;
+    node = _ref.node,
+    connections = _ref.connections;
   return {
     bindings: {
       fn: _helpers.buildBindings,
-      params: [tree, tasks, node]
+      params: [{
+        tree: tree,
+        tasks: tasks,
+        node: node,
+        connections: connections
+      }]
     },
     parameters: {
       fn: function fn(node) {
@@ -30,28 +37,93 @@ var dataSources = function dataSources(_ref) {
     form: {
       fn: function fn(node) {
         return (0, _apis.fetchForm)({
-          kappSlug: node.parameters.find(function (parameter) {
-            return parameter.id === 'kappSlug';
+          kappSlug: node.parameters.find(function (p) {
+            return p.id === 'kappSlug';
           }).value,
-          formSlug: node.parameters.find(function (parameter) {
-            return parameter.id === 'formSlug';
+          formSlug: node.parameters.find(function (p) {
+            return p.id === 'formSlug';
           }).value,
           include: 'fields,kapp'
         }).then(function (data) {
           return data.form;
         });
       },
-      params: (0, _TaskDefinitionConfigForm.generateTaskDefinition)(tasks.get(node.definitionId)) ? [node] : null
+      params: ((_tasks$get = tasks.get(node.definitionId)) === null || _tasks$get === void 0 ? void 0 : _tasks$get.definitionName) === _constants.ADVANCED_HANDLER_NAME_SUBMISSION_CREATE ? [node] : null
+    },
+    connection: {
+      fn: function fn(node) {
+        var _node$parameters$find;
+        var id = (_node$parameters$find = node.parameters.find(function (p) {
+          return p.id === 'connection';
+        })) === null || _node$parameters$find === void 0 ? void 0 : _node$parameters$find.value;
+        return (connections === null || connections === void 0 ? void 0 : connections.get(id)) || (0, _apis.fetchConnection)({
+          id: id
+        }).then(function (data) {
+          return data.connection;
+        });
+      },
+      params: ((_tasks$get2 = tasks.get(node.definitionId)) === null || _tasks$get2 === void 0 ? void 0 : _tasks$get2.definitionName) === _constants.ADVANCED_HANDLER_NAME_INTEGRATION ? [node] : null
+    },
+    operation: {
+      fn: function fn(node) {
+        var _node$parameters$find2, _node$parameters$find3;
+        var connectionId = (_node$parameters$find2 = node.parameters.find(function (p) {
+          return p.id === 'connection';
+        })) === null || _node$parameters$find2 === void 0 ? void 0 : _node$parameters$find2.value;
+        var id = (_node$parameters$find3 = node.parameters.find(function (p) {
+          return p.id === 'operation';
+        })) === null || _node$parameters$find3 === void 0 ? void 0 : _node$parameters$find3.value;
+        return (connections === null || connections === void 0 ? void 0 : connections.getIn([connectionId, 'operations', id])) || (0, _apis.fetchOperation)({
+          connectionId: connectionId,
+          id: id
+        }).then(function (data) {
+          return data.operation;
+        });
+      },
+      params: ((_tasks$get3 = tasks.get(node.definitionId)) === null || _tasks$get3 === void 0 ? void 0 : _tasks$get3.definitionName) === _constants.ADVANCED_HANDLER_NAME_INTEGRATION ? [node] : null
+    },
+    detectedInputs: {
+      fn: function fn(node) {
+        var _node$parameters$find4;
+        return (0, _apis.inspectOperation)({
+          operationId: (_node$parameters$find4 = node.parameters.find(function (p) {
+            return p.id === 'operation';
+          })) === null || _node$parameters$find4 === void 0 ? void 0 : _node$parameters$find4.value
+        }).then(function (data) {
+          return data.detectedInputs;
+        });
+      },
+      params: ((_tasks$get4 = tasks.get(node.definitionId)) === null || _tasks$get4 === void 0 ? void 0 : _tasks$get4.definitionName) === _constants.ADVANCED_HANDLER_NAME_INTEGRATION ? [node] : null
     },
     task: {
-      fn: function fn(node, form) {
-        return form ? (0, _TaskDefinitionConfigForm.generateTaskDefinition)(tasks.get(node.definitionId))({
-          form: form.toJS()
-        }) : tasks.get(node.definitionId);
+      fn: function fn(task) {
+        return task;
       },
       params: function params(_ref2) {
-        var form = _ref2.form;
-        return (0, _TaskDefinitionConfigForm.generateTaskDefinition)(tasks.get(node.definitionId)) ? form ? [node, form] : null : [node, null];
+        var form = _ref2.form,
+          connection = _ref2.connection,
+          operation = _ref2.operation,
+          detectedInputs = _ref2.detectedInputs;
+        var task = tasks.get(node.definitionId);
+        if ((task === null || task === void 0 ? void 0 : task.definitionName) === _constants.ADVANCED_HANDLER_NAME_SUBMISSION_CREATE) {
+          if (form) {
+            return [(0, _helpers.generateSubmissionCreateTaskDefinition)(task, {
+              form: form.toJS()
+            })];
+          }
+          return null;
+        } else if ((task === null || task === void 0 ? void 0 : task.definitionName) === _constants.ADVANCED_HANDLER_NAME_INTEGRATION) {
+          if (connection && operation && detectedInputs) {
+            return [(0, _helpers.generateIntegrationTaskDefinition)(task, {
+              connection: connection.toJS(),
+              operation: operation.toJS(),
+              detectedInputs: detectedInputs.toJS()
+            })];
+          }
+          return null;
+        } else {
+          return [task];
+        }
       }
     }
   };
@@ -73,8 +145,7 @@ var checkDependsOn = function checkDependsOn(parameter) {
   };
 };
 var fields = function fields(_ref4) {
-  var tasks = _ref4.tasks,
-    tree = _ref4.tree,
+  var tree = _ref4.tree,
     node = _ref4.node;
   return function (_ref5) {
     var bindings = _ref5.bindings;
@@ -125,12 +196,12 @@ var fields = function fields(_ref4) {
         name: "parameter_".concat(parameter.id),
         label: parameter.label,
         type: parameter.menu ? 'select' : 'code',
-        language: parameter.menu ? null : 'erb',
+        language: parameter.menu ? null : 'ruby-template',
         helpText: parameter.description,
         initialValue: parameter.value,
         options: parameter.menu ? getOptions(parameter.menu) : bindings,
         "transient": true,
-        visible: checkDependsOn(parameter) && (0, _TaskDefinitionConfigForm.checkOmittedParameters)(node, parameter)
+        visible: checkDependsOn(parameter) && (0, _helpers.checkOmittedParametersForAdvancedHandlers)(node, parameter)
       };
     })), [{
       name: 'parameters',
@@ -151,7 +222,7 @@ var fields = function fields(_ref4) {
       }).map(function (message) {
         return message.value;
       }).first(''),
-      language: 'erb',
+      language: 'ruby-template',
       options: bindings,
       "transient": true,
       visible: function visible(_ref8) {
@@ -167,7 +238,7 @@ var fields = function fields(_ref4) {
       }).map(function (message) {
         return message.value;
       }).first(''),
-      language: 'erb',
+      language: 'ruby-template',
       options: bindings,
       "transient": true,
       visible: function visible(_ref9) {
@@ -183,7 +254,7 @@ var fields = function fields(_ref4) {
       }).map(function (message) {
         return message.value;
       }).first(''),
-      language: 'erb',
+      language: 'ruby-template',
       options: bindings,
       "transient": true
     }, {
@@ -213,7 +284,7 @@ var handleSubmit = function handleSubmit(_ref11) {
   };
 };
 var NodeForm = exports.NodeForm = (0, _Form.generateForm)({
-  formOptions: ['node', 'tasks', 'tree'],
+  formOptions: ['connections', 'node', 'tasks', 'tree'],
   dataSources: dataSources,
   fields: fields,
   handleSubmit: handleSubmit

package/lib/components/task/builder/NodeParametersForm.js

@@ -9,7 +9,6 @@ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers
 var _Form = require("../../form/Form");
 var _helpers = require("./helpers");
 var _models = require("./models");
-var _TaskDefinitionConfigForm = require("./TaskDefinitionConfigForm");
 var getOptions = function getOptions(menu) {
   return menu.split(',').filter(function (value) {
     return !!value;
@@ -21,14 +20,20 @@ var getOptions = function getOptions(menu) {
   });
 };
 var dataSources = function dataSources(_ref) {
-  var task = _ref.task,
+  var connections = _ref.connections,
+    task = _ref.task,
     tasks = _ref.tasks,
     tree = _ref.tree,
     node = _ref.node;
   return {
     bindings: {
       fn: _helpers.buildBindings,
-      params: [tree, tasks, node]
+      params: [{
+        tree: tree,
+        tasks: tasks,
+        node: node,
+        connections: connections
+      }]
     },
     parameters: {
       fn: function fn() {
@@ -38,44 +43,52 @@ var dataSources = function dataSources(_ref) {
       transform: function transform(result) {
         return result.map(_helpers.normalizeParameter).map(_models.NodeParameter);
       }
+    },
+    oldParameters: {
+      fn: function fn() {
+        return node.parameters;
+      },
+      params: []
     }
   };
 };
 var fields = function fields(_ref2) {
   var node = _ref2.node,
-    task = _ref2.task,
-    tasks = _ref2.tasks,
-    tree = _ref2.tree;
+    task = _ref2.task;
   return function (_ref3) {
     var bindings = _ref3.bindings,
-      parameters = _ref3.parameters;
-    return bindings && parameters && [].concat((0, _toConsumableArray2["default"])(node.parameters.map(function (parameter) {
+      parameters = _ref3.parameters,
+      oldParameters = _ref3.oldParameters;
+    return bindings && parameters && oldParameters && [].concat((0, _toConsumableArray2["default"])(oldParameters.map(function (parameter) {
       return {
         name: "oldParameter_".concat(parameter.id),
         label: parameter.label,
         type: parameter.menu ? 'select' : 'code',
-        language: parameter.menu ? null : 'erb',
+        language: parameter.menu ? null : 'ruby-template',
         helpText: parameter.description,
         initialValue: parameter.value,
         options: parameter.menu ? getOptions(parameter.menu) : bindings,
         "transient": true,
         enabled: false,
-        visible: (0, _TaskDefinitionConfigForm.checkOmittedParameters)(node, parameter)
+        visible: (0, _helpers.checkOmittedParametersForAdvancedHandlers)(node, parameter)
       };
     })), (0, _toConsumableArray2["default"])(parameters.map(function (parameter) {
-      var matchingParameter = node.parameters.find(function (oldParameter) {
+      var matchingParameter = oldParameters.find(function (oldParameter) {
         return oldParameter.id === parameter.id;
       });
       return {
         name: "parameter_".concat(parameter.id),
         label: parameter.label,
         type: parameter.menu ? 'select' : 'code',
-        language: parameter.menu ? null : 'erb',
+        language: parameter.menu ? null : 'ruby-template',
         helpText: parameter.description,
-        initialValue: matchingParameter ? matchingParameter.value : parameter.defaultValue,
+        // If this parameter will be omitted, keep its value. Otherwise, set to
+        // the matchingParameter's value or the default
+        initialValue: !(0, _helpers.checkOmittedParametersForAdvancedHandlers)(task, parameter) ? parameter.value || parameter.defaultValue : matchingParameter ? matchingParameter.value : parameter.defaultValue,
         options: parameter.menu ? getOptions(parameter.menu) : bindings,
         "transient": true,
-        visible: (0, _TaskDefinitionConfigForm.checkOmittedParameters)(node, parameter)
+        // Use the task variable as the node since this is the new node
+        visible: (0, _helpers.checkOmittedParametersForAdvancedHandlers)(task, parameter)
       };
     })), [{
       name: 'parameters',
@@ -128,14 +141,13 @@ var fields = function fields(_ref2) {
     }]);
   };
 };
-var handleSubmit = function handleSubmit(_ref5) {
-  var node = _ref5.node;
+var handleSubmit = function handleSubmit() {
   return function (values) {
     return values;
   };
 };
 var NodeParametersForm = exports.NodeParametersForm = (0, _Form.generateForm)({
-  formOptions: ['node', 'task', 'tasks', 'tree'],
+  formOptions: ['connections', 'node', 'task', 'tasks', 'tree'],
   dataSources: dataSources,
   fields: fields,
   handleSubmit: handleSubmit