@splunk/visualizations 24.0.0 → 24.3.0

package/SingleValueRadial.js

@@ -87,7 +87,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 239);
+/******/ 	return __webpack_require__(__webpack_require__.s = 252);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -134,7 +134,7 @@ var React = __webpack_require__(1);
 
 var styled_components_1 = __webpack_require__(4);
 
-var SizeAwareWrapper_1 = __webpack_require__(17);
+var SizeAwareWrapper_1 = __webpack_require__(16);
 
 var style_1 = __webpack_require__(13);
 
@@ -195,6 +195,7 @@ var withFixedSizeContainer = function withFixedSizeContainer(Viz) {
 
     return React.createElement(FixSizeItem, {
       "data-test": "fix-size-item",
+      "data-splunk-visualization-version": "24.3.0 - 1c1ae4b3c",
       width: width,
       height: height,
       backgroundColor: backgroundColor
@@ -231,6 +232,20 @@ module.exports = require("@splunk/visualizations-shared/schemaUtils");
 /***/ }),
 
 /***/ 15:
+/***/ (function(module, exports) {
+
+module.exports = require("@babel/runtime/helpers/createClass");
+
+/***/ }),
+
+/***/ 16:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/visualizations-shared/SizeAwareWrapper");
+
+/***/ }),
+
+/***/ 17:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -265,11 +280,11 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "lighten", function() { return lighten; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "darken", function() { return darken; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "handleValueClickCallback", function() { return handleValueClickCallback; });
-/* harmony import */ var _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+/* harmony import */ var _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(8);
 /* harmony import */ var _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(2);
 /* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var _splunk_visualizations_shared_numberUtils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(21);
+/* harmony import */ var _splunk_visualizations_shared_numberUtils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(22);
 /* harmony import */ var _splunk_visualizations_shared_numberUtils__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_numberUtils__WEBPACK_IMPORTED_MODULE_2__);
 /* harmony import */ var _splunk_visualizations_shared_domUtils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(44);
 /* harmony import */ var _splunk_visualizations_shared_domUtils__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_domUtils__WEBPACK_IMPORTED_MODULE_3__);
@@ -1239,20 +1254,6 @@ var handleValueClickCallback = function handleValueClickCallback(ev, majorValue,
 
 /***/ }),
 
-/***/ 16:
-/***/ (function(module, exports) {
-
-module.exports = require("@babel/runtime/helpers/createClass");
-
-/***/ }),
-
-/***/ 17:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/visualizations-shared/SizeAwareWrapper");
-
-/***/ }),
-
 /***/ 18:
 /***/ (function(module, exports) {
 
@@ -1277,21 +1278,21 @@ module.exports = require("lodash");
 /***/ 20:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/themes/pick");
+module.exports = require("@babel/runtime/helpers/typeof");
 
 /***/ }),
 
 /***/ 21:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/visualizations-shared/numberUtils");
+module.exports = require("@splunk/themes/pick");
 
 /***/ }),
 
 /***/ 22:
 /***/ (function(module, exports) {
 
-module.exports = require("@babel/runtime/helpers/typeof");
+module.exports = require("@splunk/visualizations-shared/numberUtils");
 
 /***/ }),
 
@@ -1301,7 +1302,7 @@ module.exports = require("@babel/runtime/helpers/typeof");
 "use strict";
 
 
-var _defineProperty = __webpack_require__(7);
+var _defineProperty = __webpack_require__(8);
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -1366,34 +1367,6 @@ exports.getSortingParams = getSortingParams;
 
 /***/ }),
 
-/***/ 239:
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.PureSingleValueRadialThemes = exports.PureSingleValueRadial = exports.config = void 0;
-
-var SingleValueRadial_1 = __webpack_require__(256);
-
-var withDashboardViz_1 = __webpack_require__(27);
-
-var config_1 = __webpack_require__(240);
-
-exports.config = config_1.default;
-exports.PureSingleValueRadial = SingleValueRadial_1.default; // TODO: proper theming support for SVR when we come back to SVR viz
-
-exports.PureSingleValueRadialThemes = {};
-exports.default = withDashboardViz_1.default({
-  ReactViz: SingleValueRadial_1.default,
-  vizConfig: config_1.default
-});
-
-/***/ }),
-
 /***/ 24:
 /***/ (function(module, exports, __webpack_require__) {
 
@@ -1459,7 +1432,124 @@ exports.getPaginationParams = getPaginationParams;
 
 /***/ }),
 
-/***/ 240:
+/***/ 25:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.shouldShowIconPlaceholder = void 0;
+
+var React = __webpack_require__(1);
+
+var T = __webpack_require__(0);
+
+var lodash_1 = __webpack_require__(2);
+
+var i18n_1 = __webpack_require__(3);
+
+var Message_1 = __webpack_require__(9);
+
+var FixedSizeContainer_1 = __webpack_require__(12);
+/**
+ * @method shouldShowIconPlaceholder
+ * @param {object} dataSources
+ * @param {boolean} loading
+ * @returns {boolean}
+ */
+
+
+var shouldShowIconPlaceholder = function shouldShowIconPlaceholder(dataSources) {
+  var loading = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  var data = lodash_1.get(dataSources, 'primary.data.columns[0]', undefined);
+  var noData = data === undefined;
+  var fields = lodash_1.get(dataSources, 'primary.data.fields[0]', undefined);
+  var noFields = fields === undefined;
+  return loading || noData || noFields;
+};
+
+exports.shouldShowIconPlaceholder = shouldShowIconPlaceholder;
+var propTypes = {
+  icon: T.func,
+  width: T.oneOfType([T.string, T.number]),
+  height: T.oneOfType([T.string, T.number]),
+  // eslint-disable-next-line react/no-unused-prop-types
+  backgroundColor: T.string
+};
+/**
+ * @method IconPlaceholder
+ * @param {IconPlaceholderProps} props
+ * @returns {React.ReactElement}
+ */
+
+var IconPlaceholder = function IconPlaceholder(props) {
+  var width = props.width,
+      height = props.height,
+      icon = props.icon;
+
+  if (icon) {
+    return React.createElement(icon, {
+      style: {
+        left: '50%',
+        top: '50%',
+        color: 'grey',
+        position: 'absolute',
+        transform: 'translate(-50%, -50%)'
+      },
+      width: '50%',
+      height: '50%'
+    });
+  }
+
+  return React.createElement(Message_1.default, {
+    width: width,
+    height: height,
+    level: "warning",
+    message: i18n_1._('No DataSource Connected')
+  });
+};
+
+IconPlaceholder.propTypes = propTypes;
+IconPlaceholder.defaultProps = {
+  width: '100%',
+  height: 250
+};
+exports.default = FixedSizeContainer_1.default(IconPlaceholder);
+
+/***/ }),
+
+/***/ 252:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PureSingleValueRadialThemes = exports.PureSingleValueRadial = exports.config = void 0;
+
+var SingleValueRadial_1 = __webpack_require__(269);
+
+var withDashboardViz_1 = __webpack_require__(27);
+
+var config_1 = __webpack_require__(253);
+
+exports.config = config_1.default;
+exports.PureSingleValueRadial = SingleValueRadial_1.default; // TODO: proper theming support for SVR when we come back to SVR viz
+
+exports.PureSingleValueRadialThemes = {};
+exports.default = withDashboardViz_1.default({
+  ReactViz: SingleValueRadial_1.default,
+  vizConfig: config_1.default
+});
+
+/***/ }),
+
+/***/ 253:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -1473,11 +1563,11 @@ var i18n_1 = __webpack_require__(3);
 
 var schemaUtils_1 = __webpack_require__(14);
 
-var pick_1 = __webpack_require__(20);
+var pick_1 = __webpack_require__(21);
 
 var variables_1 = __webpack_require__(19);
 
-var PresetPalettes_1 = __webpack_require__(48);
+var PresetPalettes_1 = __webpack_require__(49);
 
 var visualization_icons_1 = __webpack_require__(42);
 
@@ -1487,19 +1577,19 @@ var configUtils_1 = __webpack_require__(6);
 
 var VizCategory_1 = __webpack_require__(26);
 
-var DynamicMajorColorEditor_1 = __webpack_require__(75);
+var DynamicMajorColorEditor_1 = __webpack_require__(76);
 
-var DynamicTrendColorEditor_1 = __webpack_require__(76);
+var DynamicTrendColorEditor_1 = __webpack_require__(77);
 
-var DynamicBackgroundColorEditor_1 = __webpack_require__(77);
+var DynamicBackgroundColorEditor_1 = __webpack_require__(78);
 
-var StaticMajorColorEditor_1 = __webpack_require__(78);
+var StaticMajorColorEditor_1 = __webpack_require__(79);
 
-var StaticTrendColorEditor_1 = __webpack_require__(79);
+var StaticTrendColorEditor_1 = __webpack_require__(80);
 
-var StaticBackgroundColorEditor_1 = __webpack_require__(67);
+var StaticBackgroundColorEditor_1 = __webpack_require__(68);
 
-var RadialBackgroundColor_1 = __webpack_require__(241);
+var RadialBackgroundColor_1 = __webpack_require__(254);
 
 var dataContract = {
   requiredDataSources: [{
@@ -1544,6 +1634,10 @@ var defaultContext = {
   }, {
     from: 80,
     value: '#118832'
+  }],
+  majorColorMatchConfig: [{
+    match: '',
+    value: '#5C33FF'
   }]
 };
 var optionsSchema = {
@@ -1855,7 +1949,7 @@ exports.default = configUtils_1.enhanceConfig(config);
 
 /***/ }),
 
-/***/ 241:
+/***/ 254:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -1886,7 +1980,7 @@ exports.default = radialBackground;
 
 /***/ }),
 
-/***/ 25:
+/***/ 26:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -1895,87 +1989,27 @@ exports.default = radialBackground;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.shouldShowIconPlaceholder = void 0;
-
-var React = __webpack_require__(1);
-
-var T = __webpack_require__(0);
-
-var lodash_1 = __webpack_require__(2);
-
-var i18n_1 = __webpack_require__(3);
-
-var Message_1 = __webpack_require__(9);
-
-var FixedSizeContainer_1 = __webpack_require__(12);
-/**
- * @method shouldShowIconPlaceholder
- * @param {object} dataSources
- * @param {boolean} loading
- * @returns {boolean}
- */
-
-
-var shouldShowIconPlaceholder = function shouldShowIconPlaceholder(dataSources) {
-  var loading = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-  var data = lodash_1.get(dataSources, 'primary.data.columns[0]', undefined);
-  var noData = data === undefined;
-  var fields = lodash_1.get(dataSources, 'primary.data.fields[0]', undefined);
-  var noFields = fields === undefined;
-  return loading || noData || noFields;
-};
-
-exports.shouldShowIconPlaceholder = shouldShowIconPlaceholder;
-var propTypes = {
-  icon: T.func,
-  width: T.oneOfType([T.string, T.number]),
-  height: T.oneOfType([T.string, T.number]),
-  // eslint-disable-next-line react/no-unused-prop-types
-  backgroundColor: T.string
-};
-/**
- * @method IconPlaceholder
- * @param {IconPlaceholderProps} props
- * @returns {React.ReactElement}
- */
-
-var IconPlaceholder = function IconPlaceholder(props) {
-  var width = props.width,
-      height = props.height,
-      icon = props.icon;
-
-  if (icon) {
-    return React.createElement(icon, {
-      style: {
-        left: '50%',
-        top: '50%',
-        color: 'grey',
-        position: 'absolute',
-        transform: 'translate(-50%, -50%)'
-      },
-      width: '50%',
-      height: '50%'
-    });
-  }
-
-  return React.createElement(Message_1.default, {
-    width: width,
-    height: height,
-    level: "warning",
-    message: i18n_1._('No DataSource Connected')
-  });
-};
+exports.VizCategory = void 0;
+var VizCategory;
 
-IconPlaceholder.propTypes = propTypes;
-IconPlaceholder.defaultProps = {
-  width: '100%',
-  height: 250
-};
-exports.default = FixedSizeContainer_1.default(IconPlaceholder);
+(function (VizCategory) {
+  VizCategory["SINGLE_VALUE"] = "Single Value";
+  VizCategory["TRENDS"] = "Trends";
+  VizCategory["COMPARISONS"] = "Comparisons";
+  VizCategory["TABLE"] = "Table";
+  VizCategory["GAUGE"] = "Gauge";
+  VizCategory["DISTRIBUTIONS"] = "Distributions";
+  VizCategory["CHOROPLETH"] = "Choropleth Maps";
+  VizCategory["SHAPES"] = "Shapes";
+  VizCategory["MISC"] = "misc";
+  VizCategory["FLOW"] = "Flow";
+  VizCategory["CORRELATION"] = "Correlation";
+  VizCategory["SPATIAL"] = "Spatial";
+})(VizCategory = exports.VizCategory || (exports.VizCategory = {}));
 
 /***/ }),
 
-/***/ 256:
+/***/ 269:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -1995,7 +2029,7 @@ var external_prop_types_ = __webpack_require__(0);
 var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);
 
 // EXTERNAL MODULE: external "@splunk/themes/pick"
-var pick_ = __webpack_require__(20);
+var pick_ = __webpack_require__(21);
 var pick_default = /*#__PURE__*/__webpack_require__.n(pick_);
 
 // EXTERNAL MODULE: external "@splunk/themes/variables"
@@ -2007,29 +2041,29 @@ var external_styled_components_ = __webpack_require__(4);
 var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
 
 // EXTERNAL MODULE: external "lodash/pick"
-var external_lodash_pick_ = __webpack_require__(62);
+var external_lodash_pick_ = __webpack_require__(63);
 var external_lodash_pick_default = /*#__PURE__*/__webpack_require__.n(external_lodash_pick_);
 
 // EXTERNAL MODULE: external "lodash/isEmpty"
-var isEmpty_ = __webpack_require__(63);
+var isEmpty_ = __webpack_require__(64);
 var isEmpty_default = /*#__PURE__*/__webpack_require__.n(isEmpty_);
 
 // EXTERNAL MODULE: external "@splunk/visualizations-shared/style"
 var style_ = __webpack_require__(13);
 
 // EXTERNAL MODULE: external "@splunk/visualizations-shared/SizeAwareWrapper"
-var SizeAwareWrapper_ = __webpack_require__(17);
+var SizeAwareWrapper_ = __webpack_require__(16);
 var SizeAwareWrapper_default = /*#__PURE__*/__webpack_require__.n(SizeAwareWrapper_);
 
 // EXTERNAL MODULE: ./src/common/components/VizStyleWrapper.jsx
-var VizStyleWrapper = __webpack_require__(57);
+var VizStyleWrapper = __webpack_require__(59);
 
 // EXTERNAL MODULE: external "@babel/runtime/helpers/defineProperty"
-var defineProperty_ = __webpack_require__(7);
+var defineProperty_ = __webpack_require__(8);
 var defineProperty_default = /*#__PURE__*/__webpack_require__.n(defineProperty_);
 
 // EXTERNAL MODULE: ./src/SingleValueBasic/SingleValueBasic.jsx + 2 modules
-var SingleValueBasic = __webpack_require__(61);
+var SingleValueBasic = __webpack_require__(62);
 
 // EXTERNAL MODULE: external "@splunk/visualizations-shared/colorConstants"
 var colorConstants_ = __webpack_require__(40);
@@ -2101,7 +2135,7 @@ RadialGraph_RadialGraph.defaultProps = {
 };
 /* harmony default export */ var PureSingleValueRadial_RadialGraph = (RadialGraph_RadialGraph);
 // EXTERNAL MODULE: ./src/common/utils/singleValueUtils.js
-var singleValueUtils = __webpack_require__(15);
+var singleValueUtils = __webpack_require__(17);
 
 // CONCATENATED MODULE: ./src/SingleValueRadial/PureSingleValueRadial/utils/displayUtils.js
 
@@ -2669,35 +2703,6 @@ SingleValueRadial_SingleValueRadial.defaultProps = {
 
 /***/ }),
 
-/***/ 26:
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.VizCategory = void 0;
-var VizCategory;
-
-(function (VizCategory) {
-  VizCategory["SINGLE_VALUE"] = "Single Value";
-  VizCategory["TRENDS"] = "Trends";
-  VizCategory["COMPARISONS"] = "Comparisons";
-  VizCategory["TABLE"] = "Table";
-  VizCategory["GAUGE"] = "Gauge";
-  VizCategory["DISTRIBUTIONS"] = "Distributions";
-  VizCategory["CHOROPLETH"] = "Choropleth Maps";
-  VizCategory["SHAPES"] = "Shapes";
-  VizCategory["MISC"] = "misc";
-  VizCategory["FLOW"] = "Flow";
-  VizCategory["CORRELATION"] = "Correlation";
-  VizCategory["SPATIAL"] = "Spatial";
-})(VizCategory = exports.VizCategory || (exports.VizCategory = {}));
-
-/***/ }),
-
 /***/ 27:
 /***/ (function(module, exports, __webpack_require__) {
 
@@ -2738,7 +2743,7 @@ var withEditModeCover_1 = __webpack_require__(37);
 
 var withPlaceholder_1 = __webpack_require__(38);
 
-var hocUtils_1 = __webpack_require__(8);
+var hocUtils_1 = __webpack_require__(7);
 /**
  * hoc that wraps a pure react visualization in a Dashboard visualization
  * @param {DashboardVizOpts} opts
@@ -2751,6 +2756,7 @@ var withDashboardViz = function withDashboardViz(opts) {
       vizConfig = opts.vizConfig,
       _opts$computeVizProps = opts.computeVizProps,
       computeVizProps = _opts$computeVizProps === void 0 ? function () {} : _opts$computeVizProps,
+      disableEditModeCover = opts.disableEditModeCover,
       useIconPlaceholder = opts.useIconPlaceholder; // sanitizing props before sending them to reactviz.
 
   var SanitizedReactViz = SanitizeProps_1.withSanitizedProps(ReactViz);
@@ -2915,7 +2921,7 @@ var withDashboardViz = function withDashboardViz(opts) {
 
   DashboardViz.config = vizConfig; // @ts-ignore: TODO fix sc upgrade TS issues
 
-  return styled_components_1.withTheme(withPlaceholder_1.default(withEditModeCover_1.default(DashboardViz), useIconPlaceholder));
+  return styled_components_1.withTheme(withPlaceholder_1.default(withEditModeCover_1.default(DashboardViz, disableEditModeCover), useIconPlaceholder));
 };
 
 exports.default = withDashboardViz;
@@ -3110,7 +3116,7 @@ exports.default = SplunkVisualization;
 
 var _classCallCheck = __webpack_require__(10);
 
-var _createClass = __webpack_require__(16);
+var _createClass = __webpack_require__(15);
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -3329,13 +3335,15 @@ var React = __webpack_require__(1);
 
 var styled_components_1 = __webpack_require__(4);
 
-var hocUtils_1 = __webpack_require__(8);
+var hocUtils_1 = __webpack_require__(7);
 
 var Cover = styled_components_1.default.div.withConfig({
   displayName: "withEditModeCover__Cover",
   componentId: "sc-1gsbnxb-0"
 })(["position:absolute;left:0;right:0;top:0;bottom:0;"]);
-var Blocker = styled_components_1.default.div.withConfig({
+var Blocker = styled_components_1.default.div.attrs({
+  'data-splunk-visualization-version': "24.3.0 - 1c1ae4b3c"
+}).withConfig({
   displayName: "withEditModeCover__Blocker",
   componentId: "sc-1gsbnxb-1"
 })(["position:relative;width:100%;height:100%;"]);
@@ -3346,10 +3354,11 @@ var Blocker = styled_components_1.default.div.withConfig({
  * @returns {ExtendedDashViz} Wrapper
  */
 
-var withEditModeCover = function withEditModeCover(Visualization) {
+var withEditModeCover = function withEditModeCover(Visualization, disableEditModeCover) {
   var Wrapper = function Wrapper(props) {
     var mode = props.mode;
-    return React.createElement(Blocker, null, React.createElement(Visualization, Object.assign({}, props)), mode === 'edit' && React.createElement(Cover, {
+    var showEditCover = mode === 'edit' && !disableEditModeCover;
+    return React.createElement(Blocker, null, React.createElement(Visualization, Object.assign({}, props)), showEditCover && React.createElement(Cover, {
       "data-test": "edit-mode-cover"
     }));
   };
@@ -3383,7 +3392,7 @@ var IconPlaceholder_1 = __webpack_require__(25);
 
 var VizBehavior_1 = __webpack_require__(5);
 
-var hocUtils_1 = __webpack_require__(8);
+var hocUtils_1 = __webpack_require__(7);
 
 var withPlaceholder = function withPlaceholder(Visualization) {
   var useIconPlaceholder = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : IconPlaceholder_1.shouldShowIconPlaceholder;
@@ -3460,7 +3469,7 @@ module.exports = require("@splunk/visualizations-shared/domUtils");
 
 /***/ }),
 
-/***/ 48:
+/***/ 49:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualization-color-palettes/editors/PresetPalettes");
@@ -3505,7 +3514,7 @@ var VizBehavior;
 
 /***/ }),
 
-/***/ 57:
+/***/ 59:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -3535,7 +3544,7 @@ VizStyleWrapper.displayName = 'VizStyleWrapper';
 "use strict";
 
 
-var _defineProperty = __webpack_require__(7);
+var _defineProperty = __webpack_require__(8);
 
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
@@ -3721,7 +3730,7 @@ exports.generatePrecisionValues = generatePrecisionValues;
 
 /***/ }),
 
-/***/ 61:
+/***/ 62:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -3748,14 +3757,14 @@ var external_styled_components_ = __webpack_require__(4);
 var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
 
 // EXTERNAL MODULE: ./src/common/utils/singleValueUtils.js
-var singleValueUtils = __webpack_require__(15);
+var singleValueUtils = __webpack_require__(17);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/ArrowUp"
-var ArrowUp_ = __webpack_require__(64);
+var ArrowUp_ = __webpack_require__(65);
 var ArrowUp_default = /*#__PURE__*/__webpack_require__.n(ArrowUp_);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/ArrowDown"
-var ArrowDown_ = __webpack_require__(65);
+var ArrowDown_ = __webpack_require__(66);
 var ArrowDown_default = /*#__PURE__*/__webpack_require__.n(ArrowDown_);
 
 // CONCATENATED MODULE: ./src/SingleValueBasic/TrendValue.jsx
@@ -3825,7 +3834,7 @@ TrendValue_SingleValueContent.propTypes = {
 };
 /* harmony default export */ var TrendValue = (TrendValue_SingleValueContent);
 // EXTERNAL MODULE: external "cssesc"
-var external_cssesc_ = __webpack_require__(66);
+var external_cssesc_ = __webpack_require__(67);
 var external_cssesc_default = /*#__PURE__*/__webpack_require__.n(external_cssesc_);
 
 // CONCATENATED MODULE: ./src/SingleValueBasic/MajorValue.jsx
@@ -4010,42 +4019,42 @@ var SingleValueTrendValue = TrendValue;
 
 /***/ }),
 
-/***/ 62:
+/***/ 63:
 /***/ (function(module, exports) {
 
 module.exports = require("lodash/pick");
 
 /***/ }),
 
-/***/ 63:
+/***/ 64:
 /***/ (function(module, exports) {
 
 module.exports = require("lodash/isEmpty");
 
 /***/ }),
 
-/***/ 64:
+/***/ 65:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/ArrowUp");
 
 /***/ }),
 
-/***/ 65:
+/***/ 66:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/ArrowDown");
 
 /***/ }),
 
-/***/ 66:
+/***/ 67:
 /***/ (function(module, exports) {
 
 module.exports = require("cssesc");
 
 /***/ }),
 
-/***/ 67:
+/***/ 68:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -4070,13 +4079,79 @@ var StaticBackgroundColorEditor = {
 /***/ }),
 
 /***/ 7:
-/***/ (function(module, exports) {
+/***/ (function(module, exports, __webpack_require__) {
 
-module.exports = require("@babel/runtime/helpers/defineProperty");
+"use strict";
+
+
+var _typeof = __webpack_require__(20);
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.deepMergeWithArrayOverrides = exports.extendStaticWrapperProps = void 0;
+
+var lodash_1 = __webpack_require__(2);
+/**
+ * @method extendStaticWrapperProps
+ * @param {Object} props
+ * @param {DashboardVizType} props.Wrapper
+ * @param {DashboardVizType} props.Visualization
+ */
+
+
+var extendStaticWrapperProps = function extendStaticWrapperProps(_ref) {
+  var Wrapper = _ref.Wrapper,
+      Visualization = _ref.Visualization;
+  var extendProperties = ['propTypes', 'defaultProps', 'config'];
+  extendProperties.forEach(function (prop) {
+    if (Visualization[prop]) {
+      // eslint-disable-next-line no-param-reassign
+      Wrapper[prop] = Visualization[prop];
+    }
+  });
+};
+
+exports.extendStaticWrapperProps = extendStaticWrapperProps;
+/**
+ * helper to deeply merge objects while preserving arrays in earlier source objects
+ * deeply nested primitive keys are merged similarly to lodash's defaultsDeep, while keys with arrays will be preserved if already present in the resultant merged object
+ * this prevents default arrays from appending values to user-defined arrays (this occurs if the default array is longer than the user-defined one)
+ *
+ * @method deepMergeWithArrayOverrides
+ * @param {Object} initial - target object to merge values into
+ * @param {Object[]} sources - other default options to be merged into the resultant object if no explicit value is provided, with earlier args taking precedence over later ones
+ *
+ * @returns {Object}
+ */
+
+var deepMergeWithArrayOverrides = function deepMergeWithArrayOverrides(initial) {
+  var clone = lodash_1.cloneDeep(initial);
+
+  for (var _len = arguments.length, sources = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    sources[_key - 1] = arguments[_key];
+  }
+
+  sources.forEach(function (sourceToApply) {
+    Object.keys(sourceToApply).forEach(function (sourceKey) {
+      if (!Object.prototype.hasOwnProperty.call(clone, sourceKey)) {
+        clone[sourceKey] = lodash_1.cloneDeep(sourceToApply[sourceKey]);
+      } // object merging excluding arrays
+
+
+      if (clone[sourceKey] && _typeof(clone[sourceKey]) === 'object' && !Array.isArray(clone[sourceKey]) && _typeof(sourceToApply[sourceKey]) === 'object') {
+        clone[sourceKey] = exports.deepMergeWithArrayOverrides(clone[sourceKey], sourceToApply[sourceKey]);
+      }
+    });
+  });
+  return clone;
+};
+
+exports.deepMergeWithArrayOverrides = deepMergeWithArrayOverrides;
 
 /***/ }),
 
-/***/ 75:
+/***/ 76:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -4109,15 +4184,13 @@ var getDynamicMajorColorEditor = function getDynamicMajorColorEditor(_ref) {
         defaults: {
           majorValue: defaultContext.majorColorConfig
         }
-      } // TODO(fkurniawan): add back in when FormatterEditor supports full MatchValue editor
-      // {
-      //     label: _('Matches'),
-      //     value: 'matchValue',
-      //     defaults: {
-      //         majorValue: [{ match: 'foo', value: '#f00' }],
-      //     },
-      // },
-      ],
+      }, {
+        label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Matches'),
+        value: 'matchValue',
+        defaults: {
+          majorValue: defaultContext.majorColorMatchConfig
+        }
+      }],
       dataSelectors: [{
         label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Major Value'),
         value: 'majorValue'
@@ -4129,7 +4202,7 @@ var getDynamicMajorColorEditor = function getDynamicMajorColorEditor(_ref) {
 
 /***/ }),
 
-/***/ 76:
+/***/ 77:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -4174,7 +4247,7 @@ var getDynamicTrendColorEditor = function getDynamicTrendColorEditor(_ref) {
 
 /***/ }),
 
-/***/ 77:
+/***/ 78:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -4208,15 +4281,13 @@ var getDynamicBackgroundColorEditor = function getDynamicBackgroundColorEditor(_
           majorValue: defaultContext.majorColorConfig,
           trendValue: defaultContext.trendColorConfig
         }
-      } // TODO(fkurniawan): add back in when FormatterEditor supports full MatchValue editor
-      // {
-      //     label: _('Matches'),
-      //     value: 'matchValue',
-      //     defaults: {
-      //         majorValue: [{ match: 'foo', value: '#f00' }],
-      //     },
-      // },
-      ],
+      }, {
+        label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Matches'),
+        value: 'matchValue',
+        defaults: {
+          majorValue: defaultContext.majorColorMatchConfig
+        }
+      }],
       dataSelectors: [{
         label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Major Value'),
         value: 'majorValue'
@@ -4231,7 +4302,7 @@ var getDynamicBackgroundColorEditor = function getDynamicBackgroundColorEditor(_
 
 /***/ }),
 
-/***/ 78:
+/***/ 79:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -4255,7 +4326,14 @@ var StaticMajorColorEditor = {
 
 /***/ }),
 
-/***/ 79:
+/***/ 8:
+/***/ (function(module, exports) {
+
+module.exports = require("@babel/runtime/helpers/defineProperty");
+
+/***/ }),
+
+/***/ 80:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -4283,79 +4361,6 @@ var StaticTrendColorEditor = {
 
 /***/ }),
 
-/***/ 8:
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-var _typeof = __webpack_require__(22);
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.deepMergeWithArrayOverrides = exports.extendStaticWrapperProps = void 0;
-
-var lodash_1 = __webpack_require__(2);
-/**
- * @method extendStaticWrapperProps
- * @param {Object} props
- * @param {DashboardVizType} props.Wrapper
- * @param {DashboardVizType} props.Visualization
- */
-
-
-var extendStaticWrapperProps = function extendStaticWrapperProps(_ref) {
-  var Wrapper = _ref.Wrapper,
-      Visualization = _ref.Visualization;
-  var extendProperties = ['propTypes', 'defaultProps', 'config'];
-  extendProperties.forEach(function (prop) {
-    if (Visualization[prop]) {
-      // eslint-disable-next-line no-param-reassign
-      Wrapper[prop] = Visualization[prop];
-    }
-  });
-};
-
-exports.extendStaticWrapperProps = extendStaticWrapperProps;
-/**
- * helper to deeply merge objects while preserving arrays in earlier source objects
- * deeply nested primitive keys are merged similarly to lodash's defaultsDeep, while keys with arrays will be preserved if already present in the resultant merged object
- * this prevents default arrays from appending values to user-defined arrays (this occurs if the default array is longer than the user-defined one)
- *
- * @method deepMergeWithArrayOverrides
- * @param {Object} initial - target object to merge values into
- * @param {Object[]} sources - other default options to be merged into the resultant object if no explicit value is provided, with earlier args taking precedence over later ones
- *
- * @returns {Object}
- */
-
-var deepMergeWithArrayOverrides = function deepMergeWithArrayOverrides(initial) {
-  var clone = lodash_1.cloneDeep(initial);
-
-  for (var _len = arguments.length, sources = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-    sources[_key - 1] = arguments[_key];
-  }
-
-  sources.forEach(function (sourceToApply) {
-    Object.keys(sourceToApply).forEach(function (sourceKey) {
-      if (!Object.prototype.hasOwnProperty.call(clone, sourceKey)) {
-        clone[sourceKey] = lodash_1.cloneDeep(sourceToApply[sourceKey]);
-      } // object merging excluding arrays
-
-
-      if (clone[sourceKey] && _typeof(clone[sourceKey]) === 'object' && !Array.isArray(clone[sourceKey]) && _typeof(sourceToApply[sourceKey]) === 'object') {
-        clone[sourceKey] = exports.deepMergeWithArrayOverrides(clone[sourceKey], sourceToApply[sourceKey]);
-      }
-    });
-  });
-  return clone;
-};
-
-exports.deepMergeWithArrayOverrides = deepMergeWithArrayOverrides;
-
-/***/ }),
-
 /***/ 9:
 /***/ (function(module, exports) {