config-editor-base 2.9.1 → 2.9.2

package/dist/index.modern.js

@@ -8,6 +8,7 @@ import Select from 'react-select';
 import Files from 'react-files';
 import applyNav, { GENERIC_NAV } from 'rjsf-tabs';
 import { ReactGhLikeDiff } from 'react-gh-like-diff';
+import Ajv from 'ajv';
 
 function _arrayLikeToArray(r, a) {
   (null == a || a > r.length) && (a = r.length);
@@ -21892,7 +21893,6 @@ function extractSupportedPidsFromBitmap(rangeStart, bitmapHex, supportedSet) {
 }
 
 var merge$1 = require("deepmerge");
-var yourForm$1;
 var modeOptions = [{
   value: "all",
   label: "Select from all PIDs"
@@ -22203,6 +22203,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,
@@ -22273,8 +22274,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
+          });
+        }
       }
     });
   };
@@ -22322,7 +22339,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,
@@ -22333,7 +22350,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,
@@ -22343,7 +22359,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");
@@ -22387,7 +22402,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,
@@ -22414,7 +22429,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", {
@@ -22424,7 +22439,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", {
@@ -22436,7 +22451,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", {
@@ -22446,7 +22461,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", {
@@ -22459,17 +22474,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();
           }
         });
       }
@@ -22520,7 +22535,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",
@@ -22546,7 +22561,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",
@@ -22589,11 +22604,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();
           }
         });
       },
@@ -22618,11 +22633,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();
           }
         });
       },
@@ -22667,7 +22682,7 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
       type: "checkbox",
       checked: showPreview,
       onChange: function onChange() {
-        return _this8.setState({
+        return _this9.setState({
           showPreview: !showPreview
         });
       },
@@ -22681,20 +22696,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);
@@ -23120,7 +23122,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"
@@ -24048,6 +24049,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;
@@ -24081,8 +24083,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
+          });
+        }
       }
     });
   };
@@ -24290,7 +24308,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,
@@ -24329,7 +24347,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,
@@ -24343,7 +24361,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,
@@ -24378,10 +24396,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: {
@@ -24391,7 +24409,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: {
@@ -24408,9 +24426,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: {
@@ -24459,10 +24477,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",
@@ -24578,11 +24596,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",
@@ -24610,7 +24628,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",
@@ -24647,7 +24665,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",
@@ -24738,7 +24756,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: {
@@ -24751,7 +24769,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: {
@@ -24764,7 +24782,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: {
@@ -24777,13 +24795,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",
@@ -24810,7 +24828,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;
@@ -24836,8 +24854,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",
@@ -24848,59 +24866,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();
             });
           }
         },
@@ -24911,7 +24929,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",
@@ -24931,12 +24949,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: {
@@ -24959,12 +24977,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: {
@@ -24987,12 +25005,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: {
@@ -25026,9 +25044,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", {
@@ -25039,20 +25057,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"
         }
@@ -25065,17 +25083,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"
         }
@@ -25086,21 +25104,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);