config-editor-base 2.9.0 → 2.9.2

package/dist/index.js

@@ -11,6 +11,7 @@ var Files = _interopDefault(require('react-files'));
 var applyNav = require('rjsf-tabs');
 var applyNav__default = _interopDefault(applyNav);
 var reactGhLikeDiff = require('react-gh-like-diff');
+var Ajv = _interopDefault(require('ajv'));
 
 function _arrayLikeToArray(r, a) {
   (null == a || a > r.length) && (a = r.length);
@@ -19274,8 +19275,14 @@ var EditorSection = /*#__PURE__*/function (_React$Component) {
       isSubmitting: false,
       isDownloadConfig: false,
       isCompareChanges: false,
-      activeSideBar: 'schema-modal'
+      activeSideBar: 'schema-modal',
+      showNewToolsHighlight: true
     };
+    setTimeout(function () {
+      _this.setState({
+        showNewToolsHighlight: false
+      });
+    }, 10000);
     _this.input = '';
     _this.s3 = _this.props.fetchFileContentExt ? true : false;
     return _this;
@@ -19567,7 +19574,9 @@ var EditorSection = /*#__PURE__*/function (_React$Component) {
     }, ' ', "Review changes", ' ')), /*#__PURE__*/React.createElement("div", {
       className: "col-xs-7",
       style: {
-        "float": 'left'
+        "float": 'left',
+        display: 'flex',
+        alignItems: 'center'
       }
     }, editorToolsFull.map(function (modal, idx) {
       return /*#__PURE__*/React.createElement(EditorToolButton, {
@@ -19578,7 +19587,15 @@ var EditorSection = /*#__PURE__*/function (_React$Component) {
         comment: modal.comment,
         className: modal["class"]
       });
-    }))))))), /*#__PURE__*/React.createElement("div", {
+    }), this.state.showNewToolsHighlight && /*#__PURE__*/React.createElement("span", {
+      style: {
+        fontSize: '12px',
+        color: '#337ab7',
+        marginLeft: '10px',
+        transition: 'opacity 1s ease-out',
+        opacity: this.state.showNewToolsHighlight ? 1 : 0
+      }
+    }, "New: OBD & filter builder tools"))))))), /*#__PURE__*/React.createElement("div", {
       className: "config-bar-background"
     }));
   };
@@ -21879,7 +21896,6 @@ function extractSupportedPidsFromBitmap(rangeStart, bitmapHex, supportedSet) {
 }
 
 var merge$1 = require("deepmerge");
-var yourForm$1;
 var modeOptions = [{
   value: "all",
   label: "Select from all PIDs"
@@ -22190,6 +22206,7 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
     }
   };
   _proto.testMergedFile = function testMergedFile() {
+    var _this8 = this;
     var _this$state4 = this.state,
       generatedConfig = _this$state4.generatedConfig,
       enableControlSignal = _this$state4.enableControlSignal,
@@ -22260,8 +22277,24 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
     this.setState({
       mergedConfig: mergedConfigTemp
     }, function () {
-      if (yourForm$1) {
-        yourForm$1.submit();
+      var schemaContent = _this8.props.schemaContent;
+      if (schemaContent && mergedConfigTemp) {
+        try {
+          var ajv = new Ajv({
+            allErrors: true,
+            strict: false,
+            logger: false
+          });
+          var validate = ajv.compile(schemaContent);
+          var valid = validate(mergedConfigTemp);
+          _this8.setState({
+            mergedConfigValid: valid
+          });
+        } catch (e) {
+          _this8.setState({
+            mergedConfigValid: false
+          });
+        }
       }
     });
   };
@@ -22309,7 +22342,7 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
     linkElement.click();
   };
   _proto.render = function render() {
-    var _this8 = this;
+    var _this9 = this;
     var _this$state6 = this.state,
       toolMode = _this$state6.toolMode,
       channel = _this$state6.channel,
@@ -22320,7 +22353,6 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
       searchQuery = _this$state6.searchQuery,
       supportedPids = _this$state6.supportedPids,
       generatedConfig = _this$state6.generatedConfig,
-      mergedConfig = _this$state6.mergedConfig,
       mergedConfigValid = _this$state6.mergedConfigValid,
       csvFileName = _this$state6.csvFileName,
       mixedWarning = _this$state6.mixedWarning,
@@ -22330,7 +22362,6 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
       combinedConfig = _this$state6.combinedConfig;
     var _this$props = this.props,
       formData = _this$props.formData,
-      schemaContent = _this$props.schemaContent,
       editorConfigFiles = _this$props.editorConfigFiles;
     var configFileName = editorConfigFiles && editorConfigFiles.length > 0 ? editorConfigFiles[0].name : "";
     var isVersion0109 = configFileName.includes("01.09");
@@ -22374,7 +22405,7 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
     }, /*#__PURE__*/React.createElement(Files, {
       onChange: this.handleCsvUpload,
       onError: function onError(error) {
-        return _this8.props.showAlert("danger", error.message);
+        return _this9.props.showAlert("danger", error.message);
       },
       accepts: [".csv"],
       multiple: false,
@@ -22401,7 +22432,7 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
       options: channelOptions,
       value: channel,
       onChange: function onChange(opt) {
-        return _this8.handleSettingChange("channel", opt);
+        return _this9.handleSettingChange("channel", opt);
       },
       comment: "Select which CAN channel should be used to transmit the OBD requests."
     })), /*#__PURE__*/React.createElement("div", {
@@ -22411,7 +22442,7 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
       options: bitRateOptions,
       value: bitRate,
       onChange: function onChange(opt) {
-        return _this8.handleSettingChange("bitRate", opt);
+        return _this9.handleSettingChange("bitRate", opt);
       },
       comment: "Cars typically use 500K, trucks/buses may use 250K or 500K."
     }))), toolMode !== "test" && /*#__PURE__*/React.createElement("div", {
@@ -22423,7 +22454,7 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
       options: canIdOptions,
       value: canId,
       onChange: function onChange(opt) {
-        return _this8.handleSettingChange("canId", opt);
+        return _this9.handleSettingChange("canId", opt);
       },
       comment: "Cars typically use 7DF, trucks/buses typically use 18DB33F1."
     })), /*#__PURE__*/React.createElement("div", {
@@ -22433,7 +22464,7 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
       options: obdModeOptions,
       value: obdMode,
       onChange: function onChange(opt) {
-        return _this8.handleSettingChange("obdMode", opt);
+        return _this9.handleSettingChange("obdMode", opt);
       },
       comment: "Cars use OBD2, trucks/buses may use OBD2 or WWH-OBD."
     }))), toolMode !== "test" && /*#__PURE__*/React.createElement("div", {
@@ -22446,17 +22477,17 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
       max: 10000,
       onChange: function onChange(e) {
         var val = parseInt(e.target.value) || 0;
-        _this8.setState({
+        _this9.setState({
           spacing: val
         });
       },
       onBlur: function onBlur(e) {
         var val = Math.min(10000, Math.max(100, parseInt(e.target.value) || 100));
-        _this8.setState({
+        _this9.setState({
           spacing: val
         }, function () {
-          if (_this8.getSelectedPids().length > 0) {
-            _this8.generateTransmitList();
+          if (_this9.getSelectedPids().length > 0) {
+            _this9.generateTransmitList();
           }
         });
       }
@@ -22507,7 +22538,7 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
         key: pid.uniqueId,
         className: "checkbox-white-space",
         onClick: function onClick() {
-          return !pid.disabled && _this8.handlePidToggle(pid.uniqueId);
+          return !pid.disabled && _this9.handlePidToggle(pid.uniqueId);
         },
         style: {
           display: "flex",
@@ -22533,7 +22564,7 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
         checked: pid.selected,
         disabled: pid.disabled,
         onChange: function onChange() {
-          return !pid.disabled && _this8.handlePidToggle(pid.uniqueId);
+          return !pid.disabled && _this9.handlePidToggle(pid.uniqueId);
         }
       }), /*#__PURE__*/React.createElement("span", null))), /*#__PURE__*/React.createElement("span", {
         className: "binary-text-alt-2",
@@ -22576,11 +22607,11 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
       type: "checkbox",
       checked: enableOBDFilter,
       onChange: function onChange() {
-        _this8.setState({
+        _this9.setState({
           enableOBDFilter: !enableOBDFilter
         }, function () {
-          if (_this8.getSelectedPids().length > 0) {
-            _this8.generateTransmitList();
+          if (_this9.getSelectedPids().length > 0) {
+            _this9.generateTransmitList();
           }
         });
       },
@@ -22605,11 +22636,11 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
       type: "checkbox",
       checked: enableControlSignal,
       onChange: function onChange() {
-        _this8.setState({
+        _this9.setState({
           enableControlSignal: !enableControlSignal
         }, function () {
-          if (_this8.getSelectedPids().length > 0) {
-            _this8.generateTransmitList();
+          if (_this9.getSelectedPids().length > 0) {
+            _this9.generateTransmitList();
           }
         });
       },
@@ -22654,7 +22685,7 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
       type: "checkbox",
       checked: showPreview,
       onChange: function onChange() {
-        return _this8.setState({
+        return _this9.setState({
           showPreview: !showPreview
         });
       },
@@ -22668,20 +22699,7 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
       }
     }, /*#__PURE__*/React.createElement("pre", {
       className: "browse-file-preview"
-    }, JSON.stringify(combinedConfig, null, 2))))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null)), /*#__PURE__*/React.createElement("div", {
-      style: {
-        display: "none"
-      }
-    }, /*#__PURE__*/React.createElement(Form, {
-      validator: validator,
-      onError: this.onValidationError,
-      schema: schemaContent ? schemaContent : {},
-      formData: mergedConfig ? mergedConfig : {},
-      onSubmit: this.onSubmit,
-      ref: function ref(form) {
-        yourForm$1 = form;
-      }
-    })));
+    }, JSON.stringify(combinedConfig, null, 2))))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null)));
   };
   return OBDTool;
 }(React.Component);
@@ -22994,13 +23012,13 @@ function applyPrescaler(frame, filter, prescalerState) {
       state.lastData = currentData;
       return true;
     }
-    var maskValue = prescalerValue ? parseInt(prescalerValue, 16) : 0xFFFFFFFFFFFFFFFFn;
+    var maskValue = prescalerValue ? BigInt("0x" + prescalerValue) : BigInt("0xFFFFFFFFFFFFFFFF");
     var prevBytes = parseDataBytes(state.lastData);
     var currBytes = parseDataBytes(currentData);
     var changed = false;
     for (var i = 0; i < Math.max(prevBytes.length, currBytes.length); i++) {
       var byteMask = BigInt(1) << BigInt(i);
-      if ((BigInt(maskValue) & byteMask) !== BigInt(0)) {
+      if ((maskValue & byteMask) !== BigInt(0)) {
         var prevByte = prevBytes[i] || 0;
         var currByte = currBytes[i] || 0;
         if (prevByte !== currByte) {
@@ -23107,7 +23125,6 @@ function evaluateFilters(frames, configData, detectedDeviceType) {
 var _excluded = ["name"],
   _excluded2 = ["name"];
 var merge$2 = require("deepmerge");
-var yourForm$2;
 var prescalerOptions = [{
   value: "none",
   label: "None"
@@ -24035,6 +24052,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
     return filterConfig;
   };
   _proto.testMergedFile = function testMergedFile() {
+    var _this11 = this;
     var _this$state7 = this.state,
       generatedFilterConfig = _this$state7.generatedFilterConfig,
       filterMergeMode = _this$state7.filterMergeMode;
@@ -24068,8 +24086,24 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
     this.setState({
       mergedConfig: mergedConfigTemp
     }, function () {
-      if (yourForm$2) {
-        yourForm$2.submit();
+      var schemaContent = _this11.props.schemaContent;
+      if (schemaContent && mergedConfigTemp) {
+        try {
+          var ajv = new Ajv({
+            allErrors: true,
+            strict: false,
+            logger: false
+          });
+          var validate = ajv.compile(schemaContent);
+          var valid = validate(mergedConfigTemp);
+          _this11.setState({
+            mergedConfigValid: valid
+          });
+        } catch (e) {
+          _this11.setState({
+            mergedConfigValid: false
+          });
+        }
       }
     });
   };
@@ -24277,7 +24311,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
     });
   };
   _proto.render = function render() {
-    var _this11 = this;
+    var _this12 = this;
     var _this$state10 = this.state,
       csvFileName = _this$state10.csvFileName,
       dbcFileNames = _this$state10.dbcFileNames,
@@ -24316,7 +24350,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
     }, /*#__PURE__*/React.createElement(Files, {
       onChange: this.handleCsvUpload,
       onError: function onError(error) {
-        return _this11.props.showAlert("danger", error.message);
+        return _this12.props.showAlert("danger", error.message);
       },
       accepts: [".csv"],
       multiple: false,
@@ -24330,7 +24364,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
     }, /*#__PURE__*/React.createElement(Files, {
       onChange: this.handleDbcUpload,
       onError: function onError(error) {
-        return _this11.props.showAlert("danger", error.message);
+        return _this12.props.showAlert("danger", error.message);
       },
       accepts: [".dbc"],
       multiple: true,
@@ -24365,10 +24399,10 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
       type: "checkbox",
       checked: groupJ1939Pgns,
       onChange: function onChange() {
-        _this11.setState({
+        _this12.setState({
           groupJ1939Pgns: !groupJ1939Pgns
         }, function () {
-          _this11.mergeData();
+          _this12.mergeData();
         });
       },
       style: {
@@ -24378,7 +24412,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
     }), "Group 29-bit IDs as PGNs"), /*#__PURE__*/React.createElement("p", {
       className: "field-description field-description-shift"
     }, "In J1939/ISOBUS/NMEA protocol use cases it can be relevant to evaluate messages at the 18-bit PGN level instead of the 29-bit ID level.")), csvData && function () {
-      var isEnabled = _this11.props.formData && _this11.isFirmwareVersionSupported();
+      var isEnabled = _this12.props.formData && _this12.isFirmwareVersionSupported();
       return /*#__PURE__*/React.createElement("div", {
         className: "form-group pl0 field-string",
         style: {
@@ -24395,9 +24429,9 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
         }
       }, /*#__PURE__*/React.createElement("input", {
         type: "checkbox",
-        checked: _this11.state.showFilteredSummary,
+        checked: _this12.state.showFilteredSummary,
         onChange: function onChange() {
-          return _this11.toggleFilteredSummary();
+          return _this12.toggleFilteredSummary();
         },
         disabled: !isEnabled,
         style: {
@@ -24446,10 +24480,10 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
       }, label, ":"), /*#__PURE__*/React.createElement("input", {
         type: "text",
         className: "form-control encryption-input",
-        value: _this11.state["channelMap" + label],
+        value: _this12.state["channelMap" + label],
         onChange: function onChange(e) {
-          var _this11$setState;
-          return _this11.setState((_this11$setState = {}, _this11$setState["channelMap" + label] = e.target.value, _this11$setState));
+          var _this12$setState;
+          return _this12.setState((_this12$setState = {}, _this12$setState["channelMap" + label] = e.target.value, _this12$setState));
         },
         style: {
           width: "36px",
@@ -24565,11 +24599,11 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
         marginLeft: "8px"
       }
     }, "Signals")), filteredEntries.map(function (entry) {
-      var isChannelValid = _this11.props.deviceType === "CANmod" ? _this11.isChannelValid(entry.channel) : true;
+      var isChannelValid = _this12.props.deviceType === "CANmod" ? _this12.isChannelValid(entry.channel) : true;
       return /*#__PURE__*/React.createElement("div", {
         key: entry.uniqueId,
         onClick: function onClick() {
-          return isChannelValid && _this11.handleEntryToggle(entry.uniqueId);
+          return isChannelValid && _this12.handleEntryToggle(entry.uniqueId);
         },
         style: {
           display: "flex",
@@ -24597,7 +24631,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
         checked: entry.selected,
         disabled: !isChannelValid,
         onChange: function onChange() {
-          return isChannelValid && _this11.handleEntryToggle(entry.uniqueId);
+          return isChannelValid && _this12.handleEntryToggle(entry.uniqueId);
         }
       }), /*#__PURE__*/React.createElement("span", null))), /*#__PURE__*/React.createElement("span", {
         className: "binary-text-alt-2",
@@ -24634,7 +24668,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
           display: "flex",
           alignItems: "center"
         }
-      }, _this11.renderBarChart(entry.isGroup ? entry.groupedPercentage : entry.percentage, maxPercentage), /*#__PURE__*/React.createElement("span", {
+      }, _this12.renderBarChart(entry.isGroup ? entry.groupedPercentage : entry.percentage, maxPercentage), /*#__PURE__*/React.createElement("span", {
         style: {
           marginLeft: "4px",
           fontFamily: "monospace",
@@ -24725,7 +24759,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
         marginLeft: "4px"
       },
       onClick: function onClick() {
-        return _this11.selectTop(30);
+        return _this12.selectTop(30);
       }
     }, "Top 30"), /*#__PURE__*/React.createElement("span", {
       style: {
@@ -24738,7 +24772,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
         cursor: "pointer"
       },
       onClick: function onClick() {
-        return _this11.selectTop(50);
+        return _this12.selectTop(50);
       }
     }, "Top 50"), /*#__PURE__*/React.createElement("span", {
       style: {
@@ -24751,7 +24785,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
         cursor: "pointer"
       },
       onClick: function onClick() {
-        return _this11.selectMatched(true);
+        return _this12.selectMatched(true);
       }
     }, "Matched"), /*#__PURE__*/React.createElement("span", {
       style: {
@@ -24764,13 +24798,13 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
         cursor: "pointer"
       },
       onClick: function onClick() {
-        return _this11.selectMatched(false);
+        return _this12.selectMatched(false);
       }
     }, "Unmatched")), csvData && function () {
-      var activeCsvData = _this11.state.showFilteredSummary && _this11.state.filteredCsvData ? _this11.state.filteredCsvData : csvData;
-      var isFiltered = _this11.state.showFilteredSummary && _this11.state.filteredCsvData;
-      var originalFileSize = _this11.csvFileSize / (1024 * 1024);
-      var filteredFileSize = isFiltered ? originalFileSize * (1 - _this11.state.filterReductionPercent / 100) : originalFileSize;
+      var activeCsvData = _this12.state.showFilteredSummary && _this12.state.filteredCsvData ? _this12.state.filteredCsvData : csvData;
+      var isFiltered = _this12.state.showFilteredSummary && _this12.state.filteredCsvData;
+      var originalFileSize = _this12.csvFileSize / (1024 * 1024);
+      var filteredFileSize = isFiltered ? originalFileSize * (1 - _this12.state.filterReductionPercent / 100) : originalFileSize;
       return /*#__PURE__*/React.createElement("div", {
         style: {
           fontSize: "12px",
@@ -24797,7 +24831,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
           color: "#5cb85c",
           marginTop: "4px"
         }
-      }, "Showing filtered summary (reduction: ", /*#__PURE__*/React.createElement("strong", null, _this11.state.filterReductionPercent.toFixed(1), "%"), ")"));
+      }, "Showing filtered summary (reduction: ", /*#__PURE__*/React.createElement("strong", null, _this12.state.filterReductionPercent.toFixed(1), "%"), ")"));
     }(), function () {
       var hasSelection = mergedEntries.some(function (e) {
         return e.selected;
@@ -24823,8 +24857,8 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
       }, /*#__PURE__*/React.createElement("div", {
         className: "col-xs-6",
         style: {
-          opacity: _this11.props.deviceType === "CANmod" ? 0.5 : 1,
-          pointerEvents: _this11.props.deviceType === "CANmod" ? "none" : "auto"
+          opacity: _this12.props.deviceType === "CANmod" ? 0.5 : 1,
+          pointerEvents: _this12.props.deviceType === "CANmod" ? "none" : "auto"
         }
       }, /*#__PURE__*/React.createElement(SimpleDropdown, {
         name: "Type",
@@ -24835,59 +24869,59 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
           value: "rejection",
           label: "Rejection"
         }],
-        value: _this11.state.filterType,
+        value: _this12.state.filterType,
         onChange: function onChange(opt) {
-          return _this11.setState({
+          return _this12.setState({
             filterType: opt.value
           }, function () {
-            return _this11.generateFilterConfig();
+            return _this12.generateFilterConfig();
           });
         }
-      }), _this11.props.deviceType === "CANmod" && /*#__PURE__*/React.createElement("span", {
+      }), _this12.props.deviceType === "CANmod" && /*#__PURE__*/React.createElement("span", {
         className: "field-description",
         style: {
           fontSize: "11px",
           color: "#999"
         }
-      }, "CANmod only supports acceptance filters")), _this11.state.filterType === "acceptance" && /*#__PURE__*/React.createElement("div", {
+      }, "CANmod only supports acceptance filters")), _this12.state.filterType === "acceptance" && /*#__PURE__*/React.createElement("div", {
         className: "col-xs-6"
       }, /*#__PURE__*/React.createElement(SimpleDropdown, {
         name: "Prescaler",
         options: prescalerOptions,
-        value: _this11.state.prescalerType,
+        value: _this12.state.prescalerType,
         onChange: function onChange(opt) {
-          return _this11.setState({
+          return _this12.setState({
             prescalerType: opt.value
           }, function () {
-            return _this11.generateFilterConfig();
+            return _this12.generateFilterConfig();
           });
         }
-      }))), _this11.state.filterType === "acceptance" && _this11.state.prescalerType !== "none" && /*#__PURE__*/React.createElement("div", {
+      }))), _this12.state.filterType === "acceptance" && _this12.state.prescalerType !== "none" && /*#__PURE__*/React.createElement("div", {
         className: "form-group pl0 field-string"
-      }, _this11.state.prescalerType === "count" && "Count value", _this11.state.prescalerType === "time" && "Time interval (ms)", _this11.state.prescalerType === "data" && "Data mask (hex)", (_this11.state.prescalerType === "count" || _this11.state.prescalerType === "time") && /*#__PURE__*/React.createElement("input", {
+      }, _this12.state.prescalerType === "count" && "Count value", _this12.state.prescalerType === "time" && "Time interval (ms)", _this12.state.prescalerType === "data" && "Data mask (hex)", (_this12.state.prescalerType === "count" || _this12.state.prescalerType === "time") && /*#__PURE__*/React.createElement("input", {
         type: "number",
         className: "form-control encryption-input",
         min: "1",
-        max: _this11.state.prescalerType === "count" ? 256 : 4194304,
-        value: _this11.state.prescalerValue,
+        max: _this12.state.prescalerType === "count" ? 256 : 4194304,
+        value: _this12.state.prescalerValue,
         onChange: function onChange(e) {
-          return _this11.setState({
+          return _this12.setState({
             prescalerValue: parseInt(e.target.value) || 1
           }, function () {
-            return _this11.generateFilterConfig();
+            return _this12.generateFilterConfig();
           });
         }
-      }), _this11.state.prescalerType === "data" && /*#__PURE__*/React.createElement("input", {
+      }), _this12.state.prescalerType === "data" && /*#__PURE__*/React.createElement("input", {
         type: "text",
         className: "form-control encryption-input",
-        value: _this11.state.dataPrescalerMask,
+        value: _this12.state.dataPrescalerMask,
         onChange: function onChange(e) {
           var val = e.target.value.toUpperCase();
           if (/^[a-fA-F0-9]*$/.test(val) && val.length <= 16) {
-            _this11.setState({
+            _this12.setState({
               dataPrescalerMask: val
             }, function () {
-              return _this11.generateFilterConfig();
+              return _this12.generateFilterConfig();
             });
           }
         },
@@ -24898,7 +24932,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
         }
       }), /*#__PURE__*/React.createElement("span", {
         className: "field-description field-description-shift"
-      }, _this11.state.prescalerType === "count" && "Accept every Nth message (1-256)", _this11.state.prescalerType === "time" && "Minimum time between messages (1-4194304 ms)", _this11.state.prescalerType === "data" && "Hex mask for data change detection")), /*#__PURE__*/React.createElement("div", {
+      }, _this12.state.prescalerType === "count" && "Accept every Nth message (1-256)", _this12.state.prescalerType === "time" && "Minimum time between messages (1-4194304 ms)", _this12.state.prescalerType === "data" && "Hex mask for data change detection")), /*#__PURE__*/React.createElement("div", {
         style: {
           display: "flex",
           alignItems: "center",
@@ -24918,12 +24952,12 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
         type: "radio",
         name: "filterMergeMode",
         value: "replace",
-        checked: _this11.state.filterMergeMode === "replace",
+        checked: _this12.state.filterMergeMode === "replace",
         onChange: function onChange(e) {
-          return _this11.setState({
+          return _this12.setState({
             filterMergeMode: e.target.value
           }, function () {
-            return _this11.generateFilterConfig();
+            return _this12.generateFilterConfig();
           });
         },
         style: {
@@ -24946,12 +24980,12 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
         type: "radio",
         name: "filterMergeMode",
         value: "append_top",
-        checked: _this11.state.filterMergeMode === "append_top",
+        checked: _this12.state.filterMergeMode === "append_top",
         onChange: function onChange(e) {
-          return _this11.setState({
+          return _this12.setState({
             filterMergeMode: e.target.value
           }, function () {
-            return _this11.generateFilterConfig();
+            return _this12.generateFilterConfig();
           });
         },
         style: {
@@ -24974,12 +25008,12 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
         type: "radio",
         name: "filterMergeMode",
         value: "append_bottom",
-        checked: _this11.state.filterMergeMode === "append_bottom",
+        checked: _this12.state.filterMergeMode === "append_bottom",
         onChange: function onChange(e) {
-          return _this11.setState({
+          return _this12.setState({
             filterMergeMode: e.target.value
           }, function () {
-            return _this11.generateFilterConfig();
+            return _this12.generateFilterConfig();
           });
         },
         style: {
@@ -25013,9 +25047,9 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
         }, 0);
         return " (" + count11Bit + " 11-bit, " + count29Bit + " 29-bit) | " + sizePercent.toFixed(1) + "%";
       }()), function () {
-        var isFirmwareSupported = _this11.isFirmwareVersionSupported();
-        var isCanmod = _this11.props.deviceType === "CANmod";
-        var isCanmodRouter = isCanmod && _this11.isCanmodRouter();
+        var isFirmwareSupported = _this12.isFirmwareVersionSupported();
+        var isCanmod = _this12.props.deviceType === "CANmod";
+        var isCanmodRouter = isCanmod && _this12.isCanmodRouter();
         var minFirmware = isCanmod ? MIN_FIRMWARE_CANMOD_ROUTER : MIN_FIRMWARE_CANEDGE;
         var isDeviceSupported = !isCanmod || isCanmodRouter;
         return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
@@ -25026,20 +25060,20 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
           }
         }, /*#__PURE__*/React.createElement("button", {
           className: "btn btn-primary",
-          onClick: _this11.onMerge,
-          disabled: !_this11.props.formData || Object.keys(_this11.props.formData).length === 0 || _this11.state.mergedConfigValid !== true || !isFirmwareSupported || !isDeviceSupported
+          onClick: _this12.onMerge,
+          disabled: !_this12.props.formData || Object.keys(_this12.props.formData).length === 0 || _this12.state.mergedConfigValid !== true || !isFirmwareSupported || !isDeviceSupported
         }, "Merge files"), /*#__PURE__*/React.createElement("button", {
           className: "btn btn-default",
-          onClick: _this11.onDownload,
-          disabled: Object.keys(_this11.state.generatedFilterConfig).length === 0
-        }, "Download JSON")), _this11.props.formData && Object.keys(_this11.props.formData).length > 0 && isDeviceSupported && !isFirmwareSupported && /*#__PURE__*/React.createElement("div", {
+          onClick: _this12.onDownload,
+          disabled: Object.keys(_this12.state.generatedFilterConfig).length === 0
+        }, "Download JSON")), _this12.props.formData && Object.keys(_this12.props.formData).length > 0 && isDeviceSupported && !isFirmwareSupported && /*#__PURE__*/React.createElement("div", {
           style: {
             fontSize: "12px",
             color: "#666",
             marginTop: "8px"
           }
         }, "Merging requires firmware ", minFirmware, ".XX+ - please update your device"));
-      }(), Object.keys(_this11.state.generatedFilterConfig).length > 0 && /*#__PURE__*/React.createElement("div", {
+      }(), Object.keys(_this12.state.generatedFilterConfig).length > 0 && /*#__PURE__*/React.createElement("div", {
         style: {
           marginTop: "10px"
         }
@@ -25052,17 +25086,17 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
         }
       }, /*#__PURE__*/React.createElement("input", {
         type: "checkbox",
-        checked: _this11.state.showFilterPreview,
+        checked: _this12.state.showFilterPreview,
         onChange: function onChange() {
-          return _this11.setState({
-            showFilterPreview: !_this11.state.showFilterPreview
+          return _this12.setState({
+            showFilterPreview: !_this12.state.showFilterPreview
           });
         },
         style: {
           marginRight: "6px",
           marginBottom: "4px"
         }
-      }), "Show partial config preview"), _this11.state.showFilterPreview && /*#__PURE__*/React.createElement("div", {
+      }), "Show partial config preview"), _this12.state.showFilterPreview && /*#__PURE__*/React.createElement("div", {
         style: {
           marginTop: "10px"
         }
@@ -25073,21 +25107,8 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
           overflow: "auto",
           fontSize: "11px"
         }
-      }, JSON.stringify(_this11.state.generatedFilterConfig, null, 2)))));
-    }()), /*#__PURE__*/React.createElement("div", {
-      style: {
-        display: "none"
-      }
-    }, /*#__PURE__*/React.createElement(Form, {
-      validator: validator,
-      onError: this.onValidationError,
-      schema: this.props.schemaContent ? this.props.schemaContent : {},
-      formData: this.state.mergedConfig ? this.state.mergedConfig : {},
-      onSubmit: this.onSubmit,
-      ref: function ref(form) {
-        yourForm$2 = form;
-      }
-    })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null)));
+      }, JSON.stringify(_this12.state.generatedFilterConfig, null, 2)))));
+    }()), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null)));
   };
   return FilterBuilderTool;
 }(React.Component);