config-editor-base 3.1.0 → 3.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,7 +3,7 @@ import { connect } from 'react-redux';
3
3
  import classNames from 'classnames';
4
4
  import validator from '@rjsf/validator-ajv6';
5
5
  import Form from '@rjsf/core';
6
- import saveAs from 'file-saver';
6
+ import saveAs, { saveAs as saveAs$1 } from 'file-saver';
7
7
  import Select from 'react-select';
8
8
  import Files from 'react-files';
9
9
  import applyNav, { GENERIC_NAV } from 'rjsf-tabs';
@@ -147,7 +147,7 @@ var loadFile = function loadFile(fileName) {
147
147
  var _require = require('detect-browser'),
148
148
  detect = _require.detect;
149
149
  var browser = detect();
150
- var crcBrowserSupport = ['chrome', 'firefox', 'opera', 'safari', 'edge'].includes(browser.name);
150
+ var crcBrowserSupport = ['chrome', 'firefox', 'opera', 'safari', 'edge'].includes(browser && browser.name);
151
151
 
152
152
  var SET_SCHEMA_LIST = "editor/SET_SCHEMA_LIST";
153
153
  var SET_CONFIG_LIST = "editor/SET_CONFIG_LIST";
@@ -1291,6 +1291,19 @@ var runConfigurationWarningChecks = function runConfigurationWarningChecks(conte
1291
1291
  dispatch(checkCANmodMonitoringMode(content));
1292
1292
  };
1293
1293
  };
1294
+ var collectConfigurationWarnings = function collectConfigurationWarnings(content) {
1295
+ var messages = [];
1296
+ var _capture = function capture(action) {
1297
+ if (typeof action === "function") return action(_capture, function () {
1298
+ return {};
1299
+ });
1300
+ if (action && action.type === "alert/SET" && action.alert && action.alert.type === "warning") {
1301
+ messages.push(action.alert.message);
1302
+ }
1303
+ };
1304
+ _capture(runConfigurationWarningChecks(content));
1305
+ return messages;
1306
+ };
1294
1307
  var checkCANmodMonitoringMode = function checkCANmodMonitoringMode(content) {
1295
1308
  return function (dispatch) {
1296
1309
  var _content$phy, _content$phy$can, _content$phy$can$phy;
@@ -1430,6 +1443,7 @@ var actions = {
1430
1443
  checkFileSplitValue: checkFileSplitValue,
1431
1444
  checkGNSSEstimate: checkGNSSEstimate,
1432
1445
  runConfigurationWarningChecks: runConfigurationWarningChecks,
1446
+ collectConfigurationWarnings: collectConfigurationWarnings,
1433
1447
  checkCANmodMonitoringMode: checkCANmodMonitoringMode,
1434
1448
  saveUpdatedConfiguration: saveUpdatedConfiguration,
1435
1449
  setUpdatedFormData: setUpdatedFormData,
@@ -18935,11 +18949,9 @@ var PartialConfigLoader = /*#__PURE__*/function (_React$Component) {
18935
18949
  var _this$props = this.props,
18936
18950
  formData = _this$props.formData,
18937
18951
  schemaContent = _this$props.schemaContent;
18938
- return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h4", null, "Partial config loader"), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
18952
+ return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h4", null, "Partial config loader"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
18939
18953
  className: "form-group pl0 field-string"
18940
18954
  }, /*#__PURE__*/React.createElement("p", {
18941
- className: "reduced-margin"
18942
- }, "Upload partial Configuration File"), /*#__PURE__*/React.createElement("p", {
18943
18955
  className: "field-description field-description-shift"
18944
18956
  }, "Select a JSON file containing a partial Configuration File. This lets you e.g. load a list of transmit messages or filters. The loaded JSON is validated vs. the Rule Schema, after which it can be merged into the editor Configuration File (even if it is not valid)")), /*#__PURE__*/React.createElement("div", null, formData ? /*#__PURE__*/React.createElement("div", {
18945
18957
  className: "text-area-wrapper row no-gutters reduced-margin"
@@ -18958,20 +18970,31 @@ var PartialConfigLoader = /*#__PURE__*/function (_React$Component) {
18958
18970
  minFileSize: 0,
18959
18971
  clickable: true
18960
18972
  }, /*#__PURE__*/React.createElement("button", {
18961
- className: "btn btn-primary"
18973
+ className: "btn btn-primary",
18974
+ title: "Upload a partial Configuration File to merge it"
18962
18975
  }, "Load JSON file"), /*#__PURE__*/React.createElement("div", {
18963
18976
  className: "browse-file-name"
18964
- }, jsonFileName))), Object.keys(jsonFile).length ? /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("pre", {
18977
+ }, jsonFileName))), Object.keys(jsonFile).length ? /*#__PURE__*/React.createElement("div", {
18978
+ className: "text-area-wrapper row no-gutters"
18979
+ }, /*#__PURE__*/React.createElement("pre", {
18965
18980
  className: "browse-file-preview"
18966
- }, JSON.stringify(jsonFile, null, 2)), formData ? /*#__PURE__*/React.createElement("div", null, mergedConfigValid ? /*#__PURE__*/React.createElement("span", null, " ", /*#__PURE__*/React.createElement("p", {
18967
- className: "btn-highlight"
18981
+ }, JSON.stringify(jsonFile, null, 2)), formData ? /*#__PURE__*/React.createElement("div", null, mergedConfigValid ? /*#__PURE__*/React.createElement("div", {
18982
+ className: "btn-highlight",
18983
+ style: {
18984
+ fontSize: "12px",
18985
+ marginBottom: "8px"
18986
+ }
18968
18987
  }, /*#__PURE__*/React.createElement("i", {
18969
18988
  className: "fa fa-check"
18970
- }), " \xA0Merged Configuration File validated")) : null, !mergedConfigValid ? /*#__PURE__*/React.createElement("p", {
18971
- className: "red-text"
18989
+ }), " Merged Configuration File validated") : null, !mergedConfigValid ? /*#__PURE__*/React.createElement("div", {
18990
+ className: "red-text",
18991
+ style: {
18992
+ fontSize: "12px",
18993
+ marginBottom: "8px"
18994
+ }
18972
18995
  }, /*#__PURE__*/React.createElement("i", {
18973
18996
  className: "fa fa-times"
18974
- }), " \xA0Merged Configuration File is invalid") : null, /*#__PURE__*/React.createElement("button", {
18997
+ }), " Merged Configuration File is invalid") : null, /*#__PURE__*/React.createElement("button", {
18975
18998
  className: "btn btn-primary",
18976
18999
  onClick: this.onReview
18977
19000
  }, "Merge files")) : null) : null) : /*#__PURE__*/React.createElement("div", {
@@ -19148,6 +19171,57 @@ function ArrayFieldTemplate(props) {
19148
19171
  }), " "))));
19149
19172
  }
19150
19173
 
19174
+ var isPlainObject = function isPlainObject(value) {
19175
+ return value !== null && typeof value === 'object' && !Array.isArray(value);
19176
+ };
19177
+ var jsonEqual = function jsonEqual(a, b) {
19178
+ return JSON.stringify(a) === JSON.stringify(b);
19179
+ };
19180
+ var clone = function clone(value) {
19181
+ return JSON.parse(JSON.stringify(value));
19182
+ };
19183
+ var computeConfigDelta = function computeConfigDelta(past, current) {
19184
+ var deletions = [];
19185
+ if (!isPlainObject(past) || !isPlainObject(current)) {
19186
+ return {
19187
+ partial: isPlainObject(current) ? clone(current) : {},
19188
+ deletions: deletions
19189
+ };
19190
+ }
19191
+ var _walk = function walk(pastNode, currentNode, path) {
19192
+ var partialNode = {};
19193
+ Object.keys(currentNode).forEach(function (key) {
19194
+ var childPath = path ? path + '.' + key : key;
19195
+ var pastValue = pastNode[key];
19196
+ var currentValue = currentNode[key];
19197
+ if (!(key in pastNode)) {
19198
+ partialNode[key] = clone(currentValue);
19199
+ } else if (isPlainObject(pastValue) && isPlainObject(currentValue)) {
19200
+ var childPartial = _walk(pastValue, currentValue, childPath);
19201
+ if (Object.keys(childPartial).length) {
19202
+ partialNode[key] = childPartial;
19203
+ }
19204
+ } else if (!jsonEqual(pastValue, currentValue)) {
19205
+ if (Array.isArray(pastValue) && isPlainObject(currentValue)) {
19206
+ deletions.push(childPath);
19207
+ } else {
19208
+ partialNode[key] = clone(currentValue);
19209
+ }
19210
+ }
19211
+ });
19212
+ Object.keys(pastNode).forEach(function (key) {
19213
+ if (!(key in currentNode)) {
19214
+ deletions.push(path ? path + '.' + key : key);
19215
+ }
19216
+ });
19217
+ return partialNode;
19218
+ };
19219
+ return {
19220
+ partial: _walk(past, current, ''),
19221
+ deletions: deletions
19222
+ };
19223
+ };
19224
+
19151
19225
  var selectOptions$1 = function selectOptions(Files) {
19152
19226
  Files = lodash.orderBy(Files, ["name"], ["desc"]);
19153
19227
  return [].concat(Files, [{
@@ -19163,7 +19237,7 @@ var pastCrc32 = "N/A";
19163
19237
  var _require$1 = require("detect-browser"),
19164
19238
  detect$1 = _require$1.detect;
19165
19239
  var browser$1 = detect$1();
19166
- var crcBrowserSupport$1 = ["chrome", "firefox", "opera", "safari", "edge"].includes(browser$1.name);
19240
+ var crcBrowserSupport$1 = ["chrome", "firefox", "opera", "safari", "edge"].includes(browser$1 && browser$1.name);
19167
19241
  var EditorChangesComparison = /*#__PURE__*/function (_React$Component) {
19168
19242
  function EditorChangesComparison(props) {
19169
19243
  var _this;
@@ -19176,6 +19250,68 @@ var EditorChangesComparison = /*#__PURE__*/function (_React$Component) {
19176
19250
  _this.handleSelectChange = function (selectedValue) {
19177
19251
  _this.props.handleDropdownChange(selectedValue.value, "Previous Configuration File");
19178
19252
  };
19253
+ _this.getPartialDelta = function () {
19254
+ var _this$props = _this.props,
19255
+ past = _this$props.past,
19256
+ current = _this$props.current,
19257
+ showAlert = _this$props.showAlert;
19258
+ var pastObj = null;
19259
+ try {
19260
+ pastObj = JSON.parse(past);
19261
+ } catch (e) {
19262
+ pastObj = null;
19263
+ }
19264
+ if (!pastObj || typeof pastObj !== "object") {
19265
+ if (showAlert) {
19266
+ showAlert("info", "Select a Previous Configuration File first");
19267
+ }
19268
+ return null;
19269
+ }
19270
+ var _computeConfigDelta = computeConfigDelta(pastObj, current),
19271
+ partial = _computeConfigDelta.partial,
19272
+ deletions = _computeConfigDelta.deletions;
19273
+ if (!Object.keys(partial).length) {
19274
+ if (showAlert) {
19275
+ showAlert("info", "No changes detected vs. the Previous Configuration File");
19276
+ }
19277
+ return null;
19278
+ }
19279
+ if (deletions.length && showAlert) {
19280
+ showAlert("warning", deletions.length + " deleted setting(s) cannot be expressed in a partial config and were excluded: " + deletions.join(", "));
19281
+ }
19282
+ return {
19283
+ partial: partial,
19284
+ deletions: deletions
19285
+ };
19286
+ };
19287
+ _this.onDownloadPartial = function () {
19288
+ var delta = _this.getPartialDelta();
19289
+ if (!delta) {
19290
+ return;
19291
+ }
19292
+ var revisedConfigFile = _this.props.revisedConfigFile;
19293
+ var fileName = "partial-" + (revisedConfigFile && revisedConfigFile.value || "config.json");
19294
+ var blob = new Blob([JSON.stringify(delta.partial, null, 2)], {
19295
+ type: "text/json"
19296
+ });
19297
+ saveAs$1(blob, fileName);
19298
+ };
19299
+ _this.onTransferClick = function () {
19300
+ var delta = _this.getPartialDelta();
19301
+ if (!delta) {
19302
+ return;
19303
+ }
19304
+ var _this$props2 = _this.props,
19305
+ onTransferPartial = _this$props2.onTransferPartial,
19306
+ closeChangesModal = _this$props2.closeChangesModal,
19307
+ revisedConfigFile = _this$props2.revisedConfigFile;
19308
+ closeChangesModal();
19309
+ onTransferPartial({
19310
+ partial: delta.partial,
19311
+ deletions: delta.deletions,
19312
+ configName: revisedConfigFile && revisedConfigFile.value || null
19313
+ });
19314
+ };
19179
19315
  _this.toggleCheckbox = _this.toggleCheckbox.bind(_this);
19180
19316
  _this.handleSelectChange = _this.handleSelectChange.bind(_this);
19181
19317
  _this.state = {
@@ -19186,17 +19322,17 @@ var EditorChangesComparison = /*#__PURE__*/function (_React$Component) {
19186
19322
  _inheritsLoose(EditorChangesComparison, _React$Component);
19187
19323
  var _proto = EditorChangesComparison.prototype;
19188
19324
  _proto.render = function render() {
19189
- var _this$props = this.props,
19190
- options = _this$props.options,
19191
- selected = _this$props.selected,
19192
- past = _this$props.past,
19193
- current = _this$props.current,
19194
- closeChangesModal = _this$props.closeChangesModal,
19195
- revisedConfigFile = _this$props.revisedConfigFile,
19196
- crc32EditorLive = _this$props.crc32EditorLive,
19197
- isCompareChanges = _this$props.isCompareChanges,
19198
- enableDownload = _this$props.enableDownload,
19199
- externalSubmit = _this$props.externalSubmit;
19325
+ var _this$props3 = this.props,
19326
+ options = _this$props3.options,
19327
+ selected = _this$props3.selected,
19328
+ past = _this$props3.past,
19329
+ current = _this$props3.current,
19330
+ closeChangesModal = _this$props3.closeChangesModal,
19331
+ revisedConfigFile = _this$props3.revisedConfigFile,
19332
+ crc32EditorLive = _this$props3.crc32EditorLive,
19333
+ isCompareChanges = _this$props3.isCompareChanges,
19334
+ enableDownload = _this$props3.enableDownload,
19335
+ externalSubmit = _this$props3.externalSubmit;
19200
19336
  var pastCleaned = past && Object.keys(past).length ? JSON.stringify(JSON.parse(past), null, 2) : "";
19201
19337
  if (crcBrowserSupport$1 == 1 && past && Object.keys(past).length) {
19202
19338
  var _require2 = require("crc"),
@@ -19205,6 +19341,15 @@ var EditorChangesComparison = /*#__PURE__*/function (_React$Component) {
19205
19341
  } else {
19206
19342
  pastCrc32 = "N/A";
19207
19343
  }
19344
+ var partialAvailable = false;
19345
+ try {
19346
+ var pastObj = past ? JSON.parse(past) : null;
19347
+ if (pastObj && typeof pastObj === "object") {
19348
+ partialAvailable = Object.keys(computeConfigDelta(pastObj, current).partial).length > 0;
19349
+ }
19350
+ } catch (e) {
19351
+ partialAvailable = false;
19352
+ }
19208
19353
  return /*#__PURE__*/React.createElement("div", {
19209
19354
  className: isCompareChanges ? "show modal-custom-wrapper" : "hidden modal-custom-wrapper"
19210
19355
  }, /*#__PURE__*/React.createElement("div", {
@@ -19281,7 +19426,19 @@ var EditorChangesComparison = /*#__PURE__*/function (_React$Component) {
19281
19426
  type: "submit",
19282
19427
  onClick: enableDownload,
19283
19428
  className: "btn btn-primary ml15"
19284
- }, " ", "Download to disk", " "))));
19429
+ }, " ", "Download to disk", " "), /*#__PURE__*/React.createElement("button", {
19430
+ type: "button",
19431
+ onClick: this.onDownloadPartial,
19432
+ className: "btn btn-white ml15",
19433
+ disabled: !partialAvailable,
19434
+ title: "Download the delta changes as a partial config JSON e.g. for application across multiple devices"
19435
+ }, " ", "Download partial JSON to disk", " "), typeof this.props.onTransferPartial === "function" ? /*#__PURE__*/React.createElement("button", {
19436
+ type: "button",
19437
+ onClick: this.onTransferClick,
19438
+ className: "btn btn-white ml15",
19439
+ disabled: !partialAvailable,
19440
+ title: "Transfer the delta changes as a partial config JSON to the OTA batch manager for application across multiple devices"
19441
+ }, " ", "Transfer to OTA batch manager", " ") : null)));
19285
19442
  };
19286
19443
  return EditorChangesComparison;
19287
19444
  }(React.Component);
@@ -19616,7 +19773,9 @@ var EditorSection = /*#__PURE__*/function (_React$Component) {
19616
19773
  handleDropdownChange: this.handleDropdownChange,
19617
19774
  closeChangesModal: this.closeChangesModal,
19618
19775
  enableDownload: this.enableDownload.bind(this),
19619
- externalSubmit: this.props.fetchFileContentExt ? true : false
19776
+ externalSubmit: this.props.fetchFileContentExt ? true : false,
19777
+ showAlert: this.props.showAlert,
19778
+ onTransferPartial: this.props.onTransferPartial
19620
19779
  }), /*#__PURE__*/React.createElement("div", {
19621
19780
  className: classNames({
19622
19781
  'config-bar': true,
@@ -19831,6 +19990,64 @@ var SimpleDropdown = /*#__PURE__*/function (_React$Component) {
19831
19990
  return SimpleDropdown;
19832
19991
  }(React.Component);
19833
19992
 
19993
+ var CollapsiblePreview = /*#__PURE__*/function (_React$Component) {
19994
+ function CollapsiblePreview() {
19995
+ return _React$Component.apply(this, arguments) || this;
19996
+ }
19997
+ _inheritsLoose(CollapsiblePreview, _React$Component);
19998
+ var _proto = CollapsiblePreview.prototype;
19999
+ _proto.render = function render() {
20000
+ var _this$props = this.props,
20001
+ open = _this$props.open,
20002
+ onToggle = _this$props.onToggle,
20003
+ data = _this$props.data,
20004
+ onDownload = _this$props.onDownload,
20005
+ label = _this$props.label;
20006
+ return /*#__PURE__*/React.createElement("div", {
20007
+ style: {
20008
+ marginTop: "10px"
20009
+ }
20010
+ }, /*#__PURE__*/React.createElement("div", {
20011
+ onClick: onToggle,
20012
+ style: {
20013
+ display: "inline-flex",
20014
+ alignItems: "center",
20015
+ cursor: "pointer",
20016
+ fontSize: "12px",
20017
+ color: "#999999",
20018
+ userSelect: "none"
20019
+ }
20020
+ }, /*#__PURE__*/React.createElement("i", {
20021
+ className: open ? "fa fa-angle-down" : "fa fa-angle-right",
20022
+ style: {
20023
+ marginRight: "6px",
20024
+ width: "8px"
20025
+ }
20026
+ }), label || "Show partial config preview"), open ? /*#__PURE__*/React.createElement("div", {
20027
+ style: {
20028
+ marginTop: "10px"
20029
+ }
20030
+ }, /*#__PURE__*/React.createElement("pre", {
20031
+ className: "browse-file-preview",
20032
+ style: {
20033
+ maxHeight: "300px",
20034
+ overflow: "auto",
20035
+ fontSize: "11px"
20036
+ }
20037
+ }, JSON.stringify(data, null, 2)), onDownload ? /*#__PURE__*/React.createElement("button", {
20038
+ className: "btn",
20039
+ onClick: onDownload,
20040
+ style: {
20041
+ backgroundColor: "#fff",
20042
+ border: "1px solid #ccc",
20043
+ color: "#333",
20044
+ marginTop: "8px"
20045
+ }
20046
+ }, "Download JSON") : null) : null);
20047
+ };
20048
+ return CollapsiblePreview;
20049
+ }(React.Component);
20050
+
19834
20051
  var obdPids = [
19835
20052
  {
19836
20053
  service: "01",
@@ -22742,48 +22959,28 @@ var OBDTool = /*#__PURE__*/function (_React$Component) {
22742
22959
  marginBottom: "15px",
22743
22960
  marginTop: "10px"
22744
22961
  }
22745
- }, "When testing supported PIDs, make sure the ignition is on for 2 minutes before you connect the device. Let the device be connected for 5 minutes to perform the test."), mergedConfigValid === false && /*#__PURE__*/React.createElement("p", {
22746
- className: "red-text"
22962
+ }, "When testing supported PIDs, make sure the ignition is on for 2 minutes before you connect the device. Let the device be connected for 5 minutes to perform the test."), mergedConfigValid === false && /*#__PURE__*/React.createElement("div", {
22963
+ className: "red-text",
22964
+ style: {
22965
+ fontSize: "12px",
22966
+ marginBottom: "8px"
22967
+ }
22747
22968
  }, /*#__PURE__*/React.createElement("i", {
22748
22969
  className: "fa fa-times"
22749
22970
  }), " Merged Configuration File is invalid"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("button", {
22750
22971
  className: "btn btn-primary",
22751
22972
  onClick: this.onMerge,
22752
22973
  disabled: !formData || Object.keys(formData).length === 0 || mergedConfigValid !== true
22753
- }, "Merge files"), /*#__PURE__*/React.createElement("button", {
22754
- className: "btn btn-default",
22755
- onClick: this.onDownload,
22756
- disabled: Object.keys(generatedConfig).length === 0,
22757
- style: {
22758
- marginLeft: "10px"
22759
- }
22760
- }, "Download JSON"))), Object.keys(generatedConfig).length > 0 && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("label", {
22761
- style: {
22762
- display: "flex",
22763
- alignItems: "center",
22764
- cursor: "pointer",
22765
- fontSize: "12px",
22766
- marginTop: "8px"
22767
- }
22768
- }, /*#__PURE__*/React.createElement("input", {
22769
- type: "checkbox",
22770
- checked: showPreview,
22771
- onChange: function onChange() {
22974
+ }, "Merge files"))), Object.keys(generatedConfig).length > 0 && /*#__PURE__*/React.createElement(CollapsiblePreview, {
22975
+ open: showPreview,
22976
+ onToggle: function onToggle() {
22772
22977
  return _this9.setState({
22773
22978
  showPreview: !showPreview
22774
22979
  });
22775
22980
  },
22776
- style: {
22777
- marginRight: "6px",
22778
- marginBottom: "4px"
22779
- }
22780
- }), "Show partial config preview"), showPreview && /*#__PURE__*/React.createElement("div", {
22781
- style: {
22782
- marginTop: "10px"
22783
- }
22784
- }, /*#__PURE__*/React.createElement("pre", {
22785
- className: "browse-file-preview"
22786
- }, 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)));
22981
+ data: combinedConfig,
22982
+ onDownload: this.onDownload
22983
+ })), /*#__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)));
22787
22984
  };
22788
22985
  return OBDTool;
22789
22986
  }(React.Component);
@@ -24868,7 +25065,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
24868
25065
  style: {
24869
25066
  width: barWidth + "px",
24870
25067
  height: "10px",
24871
- backgroundColor: "#4a90d9",
25068
+ backgroundColor: "#46a5e0",
24872
25069
  borderRadius: "2px",
24873
25070
  display: "inline-block"
24874
25071
  }
@@ -25334,7 +25531,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
25334
25531
  }
25335
25532
  }, "Select: "), /*#__PURE__*/React.createElement("span", {
25336
25533
  style: {
25337
- color: "#337ab7",
25534
+ color: "#46a5e0",
25338
25535
  cursor: "pointer",
25339
25536
  marginLeft: "4px"
25340
25537
  },
@@ -25348,7 +25545,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
25348
25545
  }
25349
25546
  }, "|"), /*#__PURE__*/React.createElement("span", {
25350
25547
  style: {
25351
- color: "#337ab7",
25548
+ color: "#46a5e0",
25352
25549
  cursor: "pointer"
25353
25550
  },
25354
25551
  onClick: function onClick() {
@@ -25361,7 +25558,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
25361
25558
  }
25362
25559
  }, "|"), /*#__PURE__*/React.createElement("span", {
25363
25560
  style: {
25364
- color: "#337ab7",
25561
+ color: "#46a5e0",
25365
25562
  cursor: "pointer"
25366
25563
  },
25367
25564
  onClick: function onClick() {
@@ -25374,7 +25571,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
25374
25571
  }
25375
25572
  }, "|"), /*#__PURE__*/React.createElement("span", {
25376
25573
  style: {
25377
- color: "#337ab7",
25574
+ color: "#46a5e0",
25378
25575
  cursor: "pointer"
25379
25576
  },
25380
25577
  onClick: function onClick() {
@@ -25642,11 +25839,7 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
25642
25839
  className: "btn btn-primary",
25643
25840
  onClick: _this10.onMerge,
25644
25841
  disabled: !_this10.props.formData || Object.keys(_this10.props.formData).length === 0 || _this10.state.mergedConfigValid !== true || !isFirmwareSupported || !isDeviceSupported
25645
- }, "Merge files"), /*#__PURE__*/React.createElement("button", {
25646
- className: "btn btn-default",
25647
- onClick: _this10.onDownload,
25648
- disabled: Object.keys(_this10.state.generatedFilterConfig).length === 0
25649
- }, "Download JSON")), function () {
25842
+ }, "Merge files")), function () {
25650
25843
  var mergeDisabled = !_this10.props.formData || Object.keys(_this10.props.formData).length === 0 || _this10.state.mergedConfigValid !== true || !isFirmwareSupported || !isDeviceSupported;
25651
25844
  if (!mergeDisabled) return null;
25652
25845
  var reason = "";
@@ -25669,41 +25862,16 @@ var FilterBuilderTool = /*#__PURE__*/function (_React$Component) {
25669
25862
  }
25670
25863
  }, reason) : null;
25671
25864
  }());
25672
- }(), Object.keys(_this10.state.generatedFilterConfig).length > 0 && /*#__PURE__*/React.createElement("div", {
25673
- style: {
25674
- marginTop: "10px"
25675
- }
25676
- }, /*#__PURE__*/React.createElement("label", {
25677
- style: {
25678
- display: "flex",
25679
- alignItems: "center",
25680
- cursor: "pointer",
25681
- fontSize: "12px"
25682
- }
25683
- }, /*#__PURE__*/React.createElement("input", {
25684
- type: "checkbox",
25685
- checked: _this10.state.showFilterPreview,
25686
- onChange: function onChange() {
25865
+ }(), Object.keys(_this10.state.generatedFilterConfig).length > 0 && /*#__PURE__*/React.createElement(CollapsiblePreview, {
25866
+ open: _this10.state.showFilterPreview,
25867
+ onToggle: function onToggle() {
25687
25868
  return _this10.setState({
25688
25869
  showFilterPreview: !_this10.state.showFilterPreview
25689
25870
  });
25690
25871
  },
25691
- style: {
25692
- marginRight: "6px",
25693
- marginBottom: "4px"
25694
- }
25695
- }), "Show partial config preview"), _this10.state.showFilterPreview && /*#__PURE__*/React.createElement("div", {
25696
- style: {
25697
- marginTop: "10px"
25698
- }
25699
- }, /*#__PURE__*/React.createElement("pre", {
25700
- className: "browse-file-preview",
25701
- style: {
25702
- maxHeight: "300px",
25703
- overflow: "auto",
25704
- fontSize: "11px"
25705
- }
25706
- }, JSON.stringify(_this10.state.generatedFilterConfig, null, 2)))));
25872
+ data: _this10.state.generatedFilterConfig,
25873
+ onDownload: _this10.onDownload
25874
+ }));
25707
25875
  }()), /*#__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)));
25708
25876
  };
25709
25877
  return FilterBuilderTool;
@@ -25728,5 +25896,5 @@ var mapDispatchToProps$4 = function mapDispatchToProps(dispatch) {
25728
25896
  };
25729
25897
  var FilterBuilderTool$1 = connect(mapStateToProps$4, mapDispatchToProps$4)(FilterBuilderTool);
25730
25898
 
25731
- export { EditorSection$1 as EditorSection, FilterBuilderTool$1 as FilterBuilderTool, OBDTool$1 as OBDTool, reducer as editor, actions as editorActions };
25899
+ export { EditorSection$1 as EditorSection, FilterBuilderTool$1 as FilterBuilderTool, OBDTool$1 as OBDTool, computeConfigDelta, reducer as editor, actions as editorActions };
25732
25900
  //# sourceMappingURL=index.modern.js.map