@splunk/visualizations 26.3.0 → 26.4.1

package/SingleValueIcon.js

@@ -87,7 +87,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 488);
+/******/ 	return __webpack_require__(__webpack_require__.s = 480);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -95,70 +95,25 @@ module.exports =
 /***/ 0:
 /***/ (function(module, exports) {
 
-module.exports = require("react");
+module.exports = require("prop-types");
 
 /***/ }),
 
 /***/ 1:
 /***/ (function(module, exports) {
 
-module.exports = require("prop-types");
+module.exports = require("react");
 
 /***/ }),
 
 /***/ 10:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/visualization-schemas");
-
-/***/ }),
-
-/***/ 100:
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TrellisTitle = exports.TRELLIS_TITLE_HEIGHT = void 0;
-
-var React = __webpack_require__(0);
-
-var styled_components_1 = __webpack_require__(4);
-
-exports.TRELLIS_TITLE_HEIGHT = 28;
-var TrellisTitleText = styled_components_1.default.div.withConfig({
-  displayName: "TrellisTitle__TrellisTitleText",
-  componentId: "sc-2cu404-0"
-})(["margin-left:10px;margin-right:10px;padding-top:8px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;"]);
-var TrellisTitleDiv = styled_components_1.default.div.withConfig({
-  displayName: "TrellisTitle__TrellisTitleDiv",
-  componentId: "sc-2cu404-1"
-})(["height:", "px;font-size:14px;font-weight:700;color:", ";background-color:", ";box-shadow:0 1px ", ";"], exports.TRELLIS_TITLE_HEIGHT, function (props) {
-  return props.fontColor;
-}, function (props) {
-  return props.backgroundColor;
-}, function (props) {
-  return props.backgroundColor;
-});
-
-var TrellisTitle = function TrellisTitle(props) {
-  var titleText = String(props.trellisKey).toString();
-  return React.createElement(TrellisTitleDiv, {
-    fontColor: props.fontColor,
-    backgroundColor: props.backgroundColor,
-    "data-test": "trellis-title",
-    title: titleText
-  }, React.createElement(TrellisTitleText, null, titleText));
-};
-
-exports.TrellisTitle = TrellisTitle;
+module.exports = require("@splunk/visualizations-shared/numberUtils");
 
 /***/ }),
 
-/***/ 105:
+/***/ 104:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/trellisUtils");
@@ -168,23 +123,23 @@ module.exports = require("@splunk/visualizations-shared/trellisUtils");
 /***/ 11:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/visualizations-shared/numberUtils");
+module.exports = require("@splunk/visualizations-shared/Message");
 
 /***/ }),
 
-/***/ 112:
+/***/ 111:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
+/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(3);
 /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(29);
+/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(28);
 /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__);
 
 
 var StaticBackgroundColorEditor = {
-  label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Background'),
+  label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Background color'),
   option: 'backgroundColor',
   editor: 'editor.color',
   showEditor: function showEditor(_ref) {
@@ -196,7 +151,7 @@ var StaticBackgroundColorEditor = {
 
 /***/ }),
 
-/***/ 114:
+/***/ 113:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Paginator");
@@ -206,7 +161,7 @@ module.exports = require("@splunk/react-ui/Paginator");
 /***/ 12:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/visualizations-shared/Message");
+module.exports = require("@babel/runtime/helpers/defineProperty");
 
 /***/ }),
 
@@ -216,9 +171,9 @@ module.exports = require("@splunk/visualizations-shared/Message");
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDynamicTrendColorEditor", function() { return getDynamicTrendColorEditor; });
-/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
+/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(3);
 /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(29);
+/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(28);
 /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__);
 
 
@@ -261,9 +216,9 @@ var getDynamicTrendColorEditor = function getDynamicTrendColorEditor(_ref) {
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDynamicBackgroundColorEditor", function() { return getDynamicBackgroundColorEditor; });
-/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
+/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(3);
 /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(29);
+/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(28);
 /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__);
 
 
@@ -271,7 +226,7 @@ var getDynamicBackgroundColorEditor = function getDynamicBackgroundColorEditor(_
   var defaultContext = _ref.defaultContext,
       defaultPalettesConfig = _ref.defaultPalettesConfig;
   return {
-    label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Background'),
+    label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Background color'),
     option: 'backgroundColor',
     context: 'backgroundColorEditorConfig',
     editor: 'editor.dynamicColor',
@@ -315,7 +270,7 @@ var getDynamicBackgroundColorEditor = function getDynamicBackgroundColorEditor(_
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
+/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(3);
 /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__);
 
 var StaticMajorAndTrendLayout = [[{
@@ -366,9 +321,9 @@ var StaticMajorAndTrendLayout = [[{
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
+/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(3);
 /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(29);
+/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(28);
 /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__);
 
 
@@ -390,9 +345,9 @@ var StaticMajorColorEditor = {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
+/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(3);
 /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(29);
+/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(28);
 /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__);
 
 
@@ -424,13 +379,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.TrellisBackgroundColorEditor = exports.TrellisEditorConfig = void 0;
 
-var React = __webpack_require__(0);
+var React = __webpack_require__(1);
 
-var i18n_1 = __webpack_require__(2);
+var i18n_1 = __webpack_require__(3);
 
-var FeatureFlagContext_1 = __webpack_require__(28);
+var FeatureFlagContext_1 = __webpack_require__(27);
 
-var visualization_schemas_1 = __webpack_require__(10);
+var visualization_schemas_1 = __webpack_require__(9);
 /* eslint-disable react-hooks/rules-of-hooks */
 
 
@@ -530,7 +485,7 @@ exports.TrellisBackgroundColorEditor = {
 "use strict";
 
 
-var _slicedToArray = __webpack_require__(6);
+var _slicedToArray = __webpack_require__(5);
 
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
@@ -549,39 +504,39 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var React = __webpack_require__(0);
+var React = __webpack_require__(1);
 
-var react_1 = __webpack_require__(0);
+var react_1 = __webpack_require__(1);
 
-var lodash_1 = __webpack_require__(3);
+var lodash_1 = __webpack_require__(2);
 
 var styled_components_1 = __webpack_require__(4);
 
-var Paginator_1 = __webpack_require__(114);
+var Paginator_1 = __webpack_require__(113);
 
-var i18n_1 = __webpack_require__(2);
+var i18n_1 = __webpack_require__(3);
 
-var themes_1 = __webpack_require__(80);
+var themes_1 = __webpack_require__(79);
 
-var useSplunkTheme_1 = __webpack_require__(77);
+var useSplunkTheme_1 = __webpack_require__(76);
 
-var FeatureFlagContext_1 = __webpack_require__(28);
+var FeatureFlagContext_1 = __webpack_require__(27);
 
-var SizeAwareWrapper_1 = __webpack_require__(26);
+var SizeAwareWrapper_1 = __webpack_require__(25);
 
-var style_1 = __webpack_require__(19);
+var style_1 = __webpack_require__(18);
 
-var Message_1 = __webpack_require__(12);
+var Message_1 = __webpack_require__(11);
 
-var trellisUtils_1 = __webpack_require__(105);
+var trellisUtils_1 = __webpack_require__(104);
 
-var hocUtils_1 = __webpack_require__(34);
+var hocUtils_1 = __webpack_require__(33);
 
-var JSONSchemaUtils_1 = __webpack_require__(35);
+var JSONSchemaUtils_1 = __webpack_require__(34);
 
-var visualization_schemas_1 = __webpack_require__(10);
+var visualization_schemas_1 = __webpack_require__(9);
 
-var Options_1 = __webpack_require__(17);
+var Options_1 = __webpack_require__(16);
 
 var trellisUtils_2 = __webpack_require__(128);
 
@@ -837,16 +792,16 @@ exports.default = withTrellis;
 "use strict";
 
 
-var _toConsumableArray = __webpack_require__(7);
+var _toConsumableArray = __webpack_require__(6);
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getTrellisDataSourcesBySplitMode = exports.dataSourcesSplitByModeStatsorUnknown = exports.dataSourcesSplitByModeChart = exports.dataSourcesSplitByModeTimechart = exports.dataSourcesSplitByAggregationsStats = exports.dataSourcesSplitByAggregationsTimechartAndChart = exports.dataSourcesSplitByAggregationsUnknown = exports.AGGREGATIONS = void 0;
 
-var lodash_1 = __webpack_require__(3);
+var lodash_1 = __webpack_require__(2);
 
-var trellisUtils_1 = __webpack_require__(105);
+var trellisUtils_1 = __webpack_require__(104);
 
 exports.AGGREGATIONS = 'aggregations';
 /**
@@ -1337,7 +1292,7 @@ module.exports = require("lodash/pick");
 /***/ 13:
 /***/ (function(module, exports) {
 
-module.exports = require("@babel/runtime/helpers/defineProperty");
+module.exports = require("@splunk/themes/variables");
 
 /***/ }),
 
@@ -1349,13 +1304,6 @@ module.exports = require("lodash/isEmpty");
 /***/ }),
 
 /***/ 14:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/themes/variables");
-
-/***/ }),
-
-/***/ 15:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -1366,9 +1314,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.downsampleDataSources = exports.calculateDownsamplingThreshold = exports.calculateThresholdOnRangeSelect = exports.isDownsamplingEnabledForViz = exports.convertToArrOfObjects = void 0;
 
-var numberUtils_1 = __webpack_require__(11);
+var numberUtils_1 = __webpack_require__(10);
 
-var interfaces_1 = __webpack_require__(40); // TODO: utilize this fn in ParallelCoordinates
+var interfaces_1 = __webpack_require__(39); // TODO: utilize this fn in ParallelCoordinates
 
 
 var convertToArrOfObjects = function convertToArrOfObjects(columns, fields) {
@@ -1503,19 +1451,21 @@ var largestTriangleThreeBuckets = function largestTriangleThreeBuckets(data, thr
  */
 
 
-var strictlyCoerceYColumn = function strictlyCoerceYColumn(column) {
-  // Splunk charting allows for numbers in formats such as negative hex that
+var strictlyCoerceYColumn = function strictlyCoerceYColumn(column, options) {
+  var isNullCoercionEnabled = options.nullValueDisplay === 'zero'; // Splunk charting allows for numbers in formats such as negative hex that
   // Number() does not support and also allows loose coercion of hex numbers (but not other formats)
   // We want to identify columns which contain at least one value that can be loosely coerced
+
   var canLooselyCoerceSomeValues = column.findIndex(function (value) {
-    return (0, numberUtils_1.startsWithNumber)("".concat(value));
+    return (0, numberUtils_1.startsWithNumber)("".concat(value)) || isNullCoercionEnabled && value === null;
   }) >= 0; // If not all values in column can be strictly coerced to a number, we do not downsample
 
   var coercedColumn = [];
   var canDownsampleColumn = !column.some(function (value) {
-    var coercedValue = Number(value); // if it can't be parsed or isn't safe, fail
+    var coercedValue = Number(value);
+    var coerceValueToZero = isNullCoercionEnabled && value === null; // if it can't be parsed or isn't safe, fail
 
-    if (Number.isNaN(coercedValue) || coercedValue <= Number.MIN_SAFE_INTEGER || coercedValue >= Number.MAX_SAFE_INTEGER || typeof value !== 'string' && typeof value !== 'number') {
+    if (Number.isNaN(coercedValue) || coercedValue <= Number.MIN_SAFE_INTEGER || coercedValue >= Number.MAX_SAFE_INTEGER || typeof value !== 'string' && typeof value !== 'number' && !coerceValueToZero) {
       return true;
     } // save value and continue to next
 
@@ -1596,8 +1546,7 @@ var calculateDownsamplingThreshold = function calculateDownsamplingThreshold(_re
       dataSources = _ref3.dataSources,
       selectChartEvent = _ref3.selectChartEvent,
       width = _ref3.width,
-      xField = _ref3.xField,
-      y2Fields = _ref3.y2Fields;
+      xField = _ref3.xField;
 
   var _a, _b, _c;
 
@@ -1634,14 +1583,7 @@ var calculateDownsamplingThreshold = function calculateDownsamplingThreshold(_re
     });
     var lastIndex = fullSeries.findIndex(function (x) {
       return downsampledSeries[endXIndex] === x;
-    }); // For charts with categorical x-axis (charts with an xField that isn't _time), do not support
-    // re-calculating downsampling threshold if the chart is zoomed in until SPL-259458 is fixed
-    // Also do not support re-calculating downsampling threshold for zoomed-in charts with y2
-    // until SPL-259611 is fixed
-
-    if (xField !== '_time' || (y2Fields === null || y2Fields === void 0 ? void 0 : y2Fields.length)) {
-      return firstIndex === 0 && lastIndex === fullSeries.length - 1 ? width : null;
-    }
+    });
 
     if (firstIndex >= 0 && lastIndex >= 0 && firstIndex <= lastIndex) {
       return (0, exports.calculateThresholdOnRangeSelect)({
@@ -1691,7 +1633,7 @@ var isColumnStrictlyIncreasing = function isColumnStrictlyIncreasing(column, fie
  */
 
 
-var tryToCoerceAllDisplayedFields = function tryToCoerceAllDisplayedFields(ds, xField, yFields, fieldTypes) {
+var tryToCoerceAllDisplayedFields = function tryToCoerceAllDisplayedFields(ds, xField, yFields, fieldTypes, options) {
   var xColumn = [];
   var yColumns = [];
   var canDownsample = !ds.data.fields.some(function (field, index) {
@@ -1705,7 +1647,7 @@ var tryToCoerceAllDisplayedFields = function tryToCoerceAllDisplayedFields(ds, x
     if (fieldName === xField) {
       xColumn = strictlyCoerceXColumn(column, fieldType);
     } else if (yFields.has(fieldName)) {
-      var _strictlyCoerceYColum = strictlyCoerceYColumn(ds.data.columns[index]),
+      var _strictlyCoerceYColum = strictlyCoerceYColumn(ds.data.columns[index], options),
           coercedColumn = _strictlyCoerceYColum.coercedColumn,
           canLooselyCoerceSomeValues = _strictlyCoerceYColum.canLooselyCoerceSomeValues,
           canDownsampleColumn = _strictlyCoerceYColum.canDownsampleColumn; // do not perform downsampling if a column can possibly be displayed but cannot
@@ -1795,7 +1737,7 @@ var downsampleDataSources = function downsampleDataSources(_ref4) {
     return dataSources;
   }
 
-  var _tryToCoerceAllDispla = tryToCoerceAllDisplayedFields(primaryDS, xField, nonInternalYFields, fieldTypes),
+  var _tryToCoerceAllDispla = tryToCoerceAllDisplayedFields(primaryDS, xField, nonInternalYFields, fieldTypes, options),
       xColumn = _tryToCoerceAllDispla.xColumn,
       yColumns = _tryToCoerceAllDispla.yColumns;
 
@@ -1832,7 +1774,14 @@ exports.downsampleDataSources = downsampleDataSources;
 
 /***/ }),
 
-/***/ 155:
+/***/ 15:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/visualizations-shared/colorUtils");
+
+/***/ }),
+
+/***/ 153:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -1877,15 +1826,15 @@ exports.defaultContext = {
 
 /***/ }),
 
-/***/ 156:
+/***/ 154:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDynamicMajorColorEditor", function() { return getDynamicMajorColorEditor; });
-/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
+/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(3);
 /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(29);
+/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(28);
 /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__);
 
 
@@ -1928,48 +1877,41 @@ var getDynamicMajorColorEditor = function getDynamicMajorColorEditor(_ref) {
 
 /***/ }),
 
-/***/ 16:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/visualizations-shared/colorUtils");
-
-/***/ }),
-
-/***/ 161:
+/***/ 159:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations/SingleValueBasic");
 
 /***/ }),
 
-/***/ 17:
+/***/ 16:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualization-encoding/Options");
 
 /***/ }),
 
-/***/ 18:
+/***/ 17:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
-var _slicedToArray = __webpack_require__(6);
+var _slicedToArray = __webpack_require__(5);
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var React = __webpack_require__(0);
+var React = __webpack_require__(1);
 
 var styled_components_1 = __webpack_require__(4);
 
-var style_1 = __webpack_require__(19);
+var style_1 = __webpack_require__(18);
 
-var colorUtils_1 = __webpack_require__(16);
+var colorUtils_1 = __webpack_require__(15);
 
-var SizeAwareWrapper_1 = __webpack_require__(26);
+var SizeAwareWrapper_1 = __webpack_require__(25);
 
 var Item = styled_components_1.default.div.attrs(function (_ref) {
   var width = _ref.width;
@@ -2040,7 +1982,7 @@ var withFixedSizeContainer = function withFixedSizeContainer(Viz) {
 
     return React.createElement(FixSizeItem, {
       "data-test": "fix-size-item",
-      "data-splunk-visualization-version": "26.3.0 - a1ef240a6",
+      "data-splunk-visualization-version": "26.4.1 - 2b7482c08",
       width: width,
       height: height,
       backgroundColor: backgroundColor
@@ -2062,56 +2004,28 @@ exports.default = withFixedSizeContainer;
 
 /***/ }),
 
-/***/ 19:
+/***/ 18:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/style");
 
 /***/ }),
 
-/***/ 190:
+/***/ 188:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/enterprise/Activity");
 
 /***/ }),
 
-/***/ 191:
+/***/ 189:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/enterprise/Clock");
 
 /***/ }),
 
-/***/ 192:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-icons/enterprise/Pencil");
-
-/***/ }),
-
-/***/ 193:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-icons/enterprise/Star");
-
-/***/ }),
-
-/***/ 194:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-icons/enterprise/Question");
-
-/***/ }),
-
-/***/ 2:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/ui-utils/i18n");
-
-/***/ }),
-
-/***/ 20:
+/***/ 19:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -2147,17 +2061,17 @@ __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__(13);
+/* harmony import */ var _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(12);
 /* 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__(3);
+/* 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__(11);
+/* harmony import */ var _splunk_visualizations_shared_numberUtils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(10);
 /* 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__(74);
+/* harmony import */ var _splunk_visualizations_shared_domUtils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(73);
 /* harmony import */ var _splunk_visualizations_shared_domUtils__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_domUtils__WEBPACK_IMPORTED_MODULE_3__);
-/* harmony import */ var _splunk_visualizations_shared_propUtils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(36);
+/* harmony import */ var _splunk_visualizations_shared_propUtils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(35);
 /* harmony import */ var _splunk_visualizations_shared_propUtils__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_propUtils__WEBPACK_IMPORTED_MODULE_4__);
-/* harmony import */ var _splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(70);
+/* harmony import */ var _splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(69);
 /* harmony import */ var _splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_5__);
 
 
@@ -2407,7 +2321,7 @@ var computeColors = function computeColors(props, defaultColors) {
  * @param {Number} props.value                    // The major/trend value
  * @param {Number} props.numberPrecision
  * @param {Bool} props.shouldUseThousandSeparators
- * @param {Bool} props.shouldAbbreviateTrendValue
+ * @param {Bool} props.shouldAbbreviateValue
  * @returns {Number} major or trend text
  */
 
@@ -2415,11 +2329,11 @@ var computeText = function computeText(_ref4) {
   var value = _ref4.value,
       numberPrecision = _ref4.numberPrecision,
       shouldUseThousandSeparators = _ref4.shouldUseThousandSeparators,
-      shouldAbbreviateTrendValue = _ref4.shouldAbbreviateTrendValue;
+      shouldAbbreviateValue = _ref4.shouldAbbreviateValue;
   var text = Object(_splunk_visualizations_shared_numberUtils__WEBPACK_IMPORTED_MODULE_2__["isNumerial"])(value) ? Object(_splunk_visualizations_shared_numberUtils__WEBPACK_IMPORTED_MODULE_2__["formatNumber"])(value, numberPrecision, {
     useThousandSeparators: shouldUseThousandSeparators,
     // todo: need update formatNumber
-    useTrendUnits: shouldAbbreviateTrendValue
+    useTrendUnits: shouldAbbreviateValue
   }) : value; // When text is undefined, return empty string
 
   text = text || '';
@@ -2431,19 +2345,21 @@ var computeText = function computeText(_ref4) {
  * @param {Number} props.majorValue
  * @param {Number} props.numberPrecision
  * @param {Bool} props.shouldUseThousandSeparators
+ * @param {Bool} props.shouldAbbreviateMajorValue
  * @returns {String} majorText
  */
 
 var getMajorText = function getMajorText(_ref5) {
   var majorValue = _ref5.majorValue,
       numberPrecision = _ref5.numberPrecision,
-      shouldUseThousandSeparators = _ref5.shouldUseThousandSeparators;
+      shouldUseThousandSeparators = _ref5.shouldUseThousandSeparators,
+      shouldAbbreviateMajorValue = _ref5.shouldAbbreviateMajorValue;
   return computeText({
     value: majorValue === null ? 'N/A' : majorValue,
     // if majorValue is null, use `N/A`.
     numberPrecision: numberPrecision,
     shouldUseThousandSeparators: shouldUseThousandSeparators,
-    shouldAbbreviateTrendValue: false
+    shouldAbbreviateValue: shouldAbbreviateMajorValue
   });
 };
 /*
@@ -2471,7 +2387,7 @@ var getTrendText = function getTrendText(_ref6) {
       value: value,
       numberPrecision: numberPrecision,
       shouldUseThousandSeparators: shouldUseThousandSeparators,
-      shouldAbbreviateTrendValue: shouldAbbreviateTrendValue
+      shouldAbbreviateValue: shouldAbbreviateTrendValue
     });
   };
 
@@ -2615,6 +2531,7 @@ var getUnderLabel = function getUnderLabel(_ref10) {
  * @param {Number} props.numberPrecision
  * @param {Bool} props.shouldUseThousandSeparators
  * @param {Bool} props.shouldAbbreviateTrendValue
+ * @param {Bool} props.shouldAbbreviateMajorValue
  * @returns {Number, Number, Number, Number} Major text, trend text, major text size, trend text size
  */
 
@@ -2629,14 +2546,16 @@ var getMajorAndTrend = function getMajorAndTrend(_ref11) {
       unit = _ref11.unit,
       numberPrecision = _ref11.numberPrecision,
       shouldUseThousandSeparators = _ref11.shouldUseThousandSeparators,
-      shouldAbbreviateTrendValue = _ref11.shouldAbbreviateTrendValue;
+      shouldAbbreviateTrendValue = _ref11.shouldAbbreviateTrendValue,
+      shouldAbbreviateMajorValue = _ref11.shouldAbbreviateMajorValue;
   var majorTextSpaceRatio = Object(_splunk_visualizations_shared_numberUtils__WEBPACK_IMPORTED_MODULE_2__["isNumerial"])(trendValue) && shouldShowTrend(trendDisplay) ? 0.6 : 1;
   var textContentWidth = width * 0.9;
   var textContentHeight = height * 0.9;
   var majorText = getMajorText({
     majorValue: majorValue,
     numberPrecision: numberPrecision,
-    shouldUseThousandSeparators: shouldUseThousandSeparators
+    shouldUseThousandSeparators: shouldUseThousandSeparators,
+    shouldAbbreviateMajorValue: shouldAbbreviateMajorValue
   });
   var majorTextFontSize = majorFontSize || getMajorFontSize({
     width: textContentWidth,
@@ -2762,6 +2681,7 @@ var updateVizInSmallSpace = function updateVizInSmallSpace(_ref12) {
  * @param {Number} props.numberPrecision
  * @param {Bool} props.shouldUseThousandSeparators
  * @param {Bool} props.shouldAbbreviateTrendValue
+ * @param {Bool} props.shouldAbbreviateMajorValue
  * @param {Object} props.toRemoveList
  * @returns {Object} results
  * @returns {String} results.majorText
@@ -2786,6 +2706,7 @@ var computeSingleValueContent = function computeSingleValueContent(_ref13) {
       numberPrecision = _ref13.numberPrecision,
       shouldUseThousandSeparators = _ref13.shouldUseThousandSeparators,
       shouldAbbreviateTrendValue = _ref13.shouldAbbreviateTrendValue,
+      shouldAbbreviateMajorValue = _ref13.shouldAbbreviateMajorValue,
       toRemoveList = _ref13.toRemoveList;
 
   var _getMajorAndTrend = getMajorAndTrend({
@@ -2799,7 +2720,8 @@ var computeSingleValueContent = function computeSingleValueContent(_ref13) {
     unit: unit,
     numberPrecision: numberPrecision,
     shouldUseThousandSeparators: shouldUseThousandSeparators,
-    shouldAbbreviateTrendValue: shouldAbbreviateTrendValue
+    shouldAbbreviateTrendValue: shouldAbbreviateTrendValue,
+    shouldAbbreviateMajorValue: shouldAbbreviateMajorValue
   }),
       majorText = _getMajorAndTrend.majorText,
       trendText = _getMajorAndTrend.trendText,
@@ -2888,6 +2810,7 @@ var minimallyTruncateStringToWidth = function minimallyTruncateStringToWidth(_re
  * @param {Number} props.numberPrecision
  * @param {Bool} props.shouldUseThousandSeparators
  * @param {Bool} props.shouldAbbreviateTrendValue
+ * @param {Bool} props.shouldAbbreviateMajorValue,
  * @param {Object} props.toRemoveList
  * @param {Bool} props.smallViz
  * @returns {Object} results
@@ -2913,6 +2836,7 @@ var computeSingleValueRadialContent = function computeSingleValueRadialContent(_
       numberPrecision = _ref15.numberPrecision,
       shouldUseThousandSeparators = _ref15.shouldUseThousandSeparators,
       shouldAbbreviateTrendValue = _ref15.shouldAbbreviateTrendValue,
+      shouldAbbreviateMajorValue = _ref15.shouldAbbreviateMajorValue,
       smallViz = _ref15.smallViz;
 
   var _getMajorAndTrend2 = getMajorAndTrend({
@@ -2926,7 +2850,8 @@ var computeSingleValueRadialContent = function computeSingleValueRadialContent(_
     unit: unit,
     numberPrecision: numberPrecision,
     shouldUseThousandSeparators: shouldUseThousandSeparators,
-    shouldAbbreviateTrendValue: shouldAbbreviateTrendValue
+    shouldAbbreviateTrendValue: shouldAbbreviateTrendValue,
+    shouldAbbreviateMajorValue: shouldAbbreviateMajorValue
   }),
       majorText = _getMajorAndTrend2.majorText,
       trendText = _getMajorAndTrend2.trendText,
@@ -2957,7 +2882,8 @@ var computeSingleValueRadialContent = function computeSingleValueRadialContent(_
       trendDisplay: trendDisplay,
       numberPrecision: numberPrecision,
       shouldUseThousandSeparators: shouldUseThousandSeparators,
-      shouldAbbreviateTrendValue: shouldAbbreviateTrendValue
+      shouldAbbreviateTrendValue: shouldAbbreviateTrendValue,
+      shouldAbbreviateMajorValue: shouldAbbreviateMajorValue
     });
 
     majorText = _getMajorAndTrend3.majorText;
@@ -3140,7 +3066,35 @@ var handleValueClickCallback = function handleValueClickCallback(ev, majorValue,
 
 /***/ }),
 
-/***/ 21:
+/***/ 190:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/react-icons/enterprise/Pencil");
+
+/***/ }),
+
+/***/ 191:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/react-icons/enterprise/Star");
+
+/***/ }),
+
+/***/ 192:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/react-icons/enterprise/Question");
+
+/***/ }),
+
+/***/ 2:
+/***/ (function(module, exports) {
+
+module.exports = require("lodash");
+
+/***/ }),
+
+/***/ 20:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -3155,15 +3109,15 @@ exports.validOutputModes = ['json_cols', 'json'];
 
 /***/ }),
 
-/***/ 22:
+/***/ 21:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
-var _classCallCheck = __webpack_require__(9);
+var _classCallCheck = __webpack_require__(8);
 
-var _createClass = __webpack_require__(25);
+var _createClass = __webpack_require__(24);
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -3193,7 +3147,7 @@ exports.DefaultVizActionHandler = DefaultVizActionHandler;
 
 /***/ }),
 
-/***/ 23:
+/***/ 22:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -3222,7 +3176,7 @@ var VizCategory;
 
 /***/ }),
 
-/***/ 24:
+/***/ 23:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -3255,37 +3209,37 @@ exports.extendStaticWrapperProps = extendStaticWrapperProps;
 
 /***/ }),
 
-/***/ 25:
+/***/ 24:
 /***/ (function(module, exports) {
 
 module.exports = require("@babel/runtime/helpers/createClass");
 
 /***/ }),
 
-/***/ 26:
+/***/ 25:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/SizeAwareWrapper");
 
 /***/ }),
 
-/***/ 27:
+/***/ 26:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
-var _toConsumableArray = __webpack_require__(7);
+var _toConsumableArray = __webpack_require__(6);
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.insertLayout = exports.isDynamicOption = exports.uncollapseEditorConfig = exports.generatePrecisionValues = exports.getInitialPreset = exports.enhanceConfig = exports.enhanceOptionsSchemaWithDynamicOptions = void 0;
 
-var lodash_1 = __webpack_require__(3); // included for backwards compatibility
+var lodash_1 = __webpack_require__(2); // included for backwards compatibility
 
 
-var visualization_schemas_1 = __webpack_require__(10);
+var visualization_schemas_1 = __webpack_require__(9);
 
 Object.defineProperty(exports, "enhanceOptionsSchemaWithDynamicOptions", {
   enumerable: true,
@@ -3426,49 +3380,49 @@ exports.insertLayout = insertLayout;
 
 /***/ }),
 
-/***/ 28:
+/***/ 27:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualization-context/FeatureFlagContext");
 
 /***/ }),
 
-/***/ 29:
+/***/ 28:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/configUtils");
 
 /***/ }),
 
-/***/ 3:
+/***/ 29:
 /***/ (function(module, exports) {
 
-module.exports = require("lodash");
+module.exports = require("@splunk/themes/pick");
 
 /***/ }),
 
-/***/ 30:
+/***/ 3:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/themes/pick");
+module.exports = require("@splunk/ui-utils/i18n");
 
 /***/ }),
 
-/***/ 31:
+/***/ 30:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/ui-utils/id");
 
 /***/ }),
 
-/***/ 32:
+/***/ 31:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualization-context/TimezoneContext");
 
 /***/ }),
 
-/***/ 33:
+/***/ 32:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -3478,7 +3432,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var react_1 = __webpack_require__(0);
+var react_1 = __webpack_require__(1);
 
 function usePrevious(value) {
   var ref = (0, react_1.useRef)();
@@ -3492,28 +3446,28 @@ exports.default = usePrevious;
 
 /***/ }),
 
-/***/ 34:
+/***/ 33:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/hocUtils");
 
 /***/ }),
 
-/***/ 35:
+/***/ 34:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/JSONSchemaUtils");
 
 /***/ }),
 
-/***/ 36:
+/***/ 35:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/propUtils");
 
 /***/ }),
 
-/***/ 37:
+/***/ 36:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -3524,17 +3478,17 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.shouldShowIconPlaceholder = void 0;
 
-var React = __webpack_require__(0);
+var React = __webpack_require__(1);
 
-var T = __webpack_require__(1);
+var T = __webpack_require__(0);
 
-var lodash_1 = __webpack_require__(3);
+var lodash_1 = __webpack_require__(2);
 
-var i18n_1 = __webpack_require__(2);
+var i18n_1 = __webpack_require__(3);
 
-var Message_1 = __webpack_require__(12);
+var Message_1 = __webpack_require__(11);
 
-var FixedSizeContainer_1 = __webpack_require__(18);
+var FixedSizeContainer_1 = __webpack_require__(17);
 /**
  * @method shouldShowIconPlaceholder
  * @param {object} dataSources
@@ -3606,24 +3560,24 @@ exports.default = (0, FixedSizeContainer_1.default)(IconPlaceholder);
 
 /***/ }),
 
-/***/ 38:
+/***/ 37:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
-var _defineProperty = __webpack_require__(13);
+var _defineProperty = __webpack_require__(12);
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getSortingParams = exports.SortParamsPropTypes = void 0;
 
-var T = __webpack_require__(1);
+var T = __webpack_require__(0);
 
-var lodash_1 = __webpack_require__(3);
+var lodash_1 = __webpack_require__(2);
 
-var DataSource_1 = __webpack_require__(21);
+var DataSource_1 = __webpack_require__(20);
 
 exports.SortParamsPropTypes = T.shape({
   currentSortKey: T.string,
@@ -3677,7 +3631,7 @@ exports.getSortingParams = getSortingParams;
 
 /***/ }),
 
-/***/ 39:
+/***/ 38:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -3688,9 +3642,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getPaginationParams = exports.PaginatorParamsPropTypes = void 0;
 
-var T = __webpack_require__(1);
+var T = __webpack_require__(0);
 
-var lodash_1 = __webpack_require__(3);
+var lodash_1 = __webpack_require__(2);
 
 exports.PaginatorParamsPropTypes = T.shape({
   isPaging: T.bool,
@@ -3742,14 +3696,7 @@ exports.getPaginationParams = getPaginationParams;
 
 /***/ }),
 
-/***/ 4:
-/***/ (function(module, exports) {
-
-module.exports = require("styled-components");
-
-/***/ }),
-
-/***/ 40:
+/***/ 39:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -3784,11 +3731,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
+__exportStar(__webpack_require__(40), exports);
+
 __exportStar(__webpack_require__(41), exports);
 
-__exportStar(__webpack_require__(42), exports);
+__exportStar(__webpack_require__(20), exports);
 
-__exportStar(__webpack_require__(21), exports);
+__exportStar(__webpack_require__(42), exports);
 
 __exportStar(__webpack_require__(43), exports);
 
@@ -3800,13 +3749,13 @@ __exportStar(__webpack_require__(46), exports);
 
 __exportStar(__webpack_require__(47), exports);
 
-__exportStar(__webpack_require__(48), exports);
+__exportStar(__webpack_require__(21), exports);
 
-__exportStar(__webpack_require__(22), exports);
+__exportStar(__webpack_require__(7), exports);
 
-__exportStar(__webpack_require__(8), exports);
+__exportStar(__webpack_require__(22), exports);
 
-__exportStar(__webpack_require__(23), exports);
+__exportStar(__webpack_require__(48), exports);
 
 __exportStar(__webpack_require__(49), exports);
 
@@ -3818,11 +3767,16 @@ __exportStar(__webpack_require__(52), exports);
 
 __exportStar(__webpack_require__(53), exports);
 
-__exportStar(__webpack_require__(54), exports);
+/***/ }),
+
+/***/ 4:
+/***/ (function(module, exports) {
+
+module.exports = require("styled-components");
 
 /***/ }),
 
-/***/ 41:
+/***/ 40:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -3834,7 +3788,7 @@ Object.defineProperty(exports, "__esModule", {
 
 /***/ }),
 
-/***/ 42:
+/***/ 41:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -3843,6 +3797,18 @@ Object.defineProperty(exports, "__esModule", {
  *  A data structure used at runtime to wire up a visualization.
  */
 
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+/***/ }),
+
+/***/ 42:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -3921,7 +3887,7 @@ Object.defineProperty(exports, "__esModule", {
 
 /***/ }),
 
-/***/ 488:
+/***/ 480:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -3932,17 +3898,17 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.themes = exports.computeVizProps = exports.PureSingleValueIcon = exports.config = void 0;
 
-var React = __webpack_require__(0);
+var React = __webpack_require__(1);
 
-var RemoteIcon_1 = __webpack_require__(489);
+var RemoteIcon_1 = __webpack_require__(481);
 
-var iconUtils_1 = __webpack_require__(490);
+var iconUtils_1 = __webpack_require__(482);
 
-var SingleValueIcon_1 = __webpack_require__(511);
+var SingleValueIcon_1 = __webpack_require__(503);
 
-var withDashboardViz_1 = __webpack_require__(55);
+var withDashboardViz_1 = __webpack_require__(54);
 
-var config_1 = __webpack_require__(491);
+var config_1 = __webpack_require__(483);
 
 var withTrellis_1 = __webpack_require__(127);
 
@@ -3984,69 +3950,57 @@ exports.default = viz;
 
 /***/ }),
 
-/***/ 489:
+/***/ 481:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/RemoteIcon");
 
 /***/ }),
 
-/***/ 49:
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-
-/***/ }),
-
-/***/ 490:
+/***/ 482:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/iconUtils");
 
 /***/ }),
 
-/***/ 491:
+/***/ 483:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
-var _toConsumableArray = __webpack_require__(7);
+var _toConsumableArray = __webpack_require__(6);
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var i18n_1 = __webpack_require__(2);
+var i18n_1 = __webpack_require__(3);
 
-var visualization_schemas_1 = __webpack_require__(10);
+var visualization_schemas_1 = __webpack_require__(9);
 
-var PresetPalettes_1 = __webpack_require__(81);
+var PresetPalettes_1 = __webpack_require__(80);
 
-var pick_1 = __webpack_require__(30);
+var pick_1 = __webpack_require__(29);
 
-var variables_1 = __webpack_require__(14);
+var variables_1 = __webpack_require__(13);
 
-var configUtils_1 = __webpack_require__(29);
+var configUtils_1 = __webpack_require__(28);
 
-var singleValueContext_1 = __webpack_require__(155);
+var singleValueContext_1 = __webpack_require__(153);
 
 var StaticMajorAndTrendLayout_1 = __webpack_require__(123);
 
-var StaticBackgroundColorEditor_1 = __webpack_require__(112);
+var StaticBackgroundColorEditor_1 = __webpack_require__(111);
 
-var StaticIconColorEditor_1 = __webpack_require__(492);
+var StaticIconColorEditor_1 = __webpack_require__(484);
 
 var StaticMajorColorEditor_1 = __webpack_require__(124);
 
 var StaticTrendColorEditor_1 = __webpack_require__(125);
 
-var DynamicMajorColorEditor_1 = __webpack_require__(156);
+var DynamicMajorColorEditor_1 = __webpack_require__(154);
 
 var DynamicTrendColorEditor_1 = __webpack_require__(121);
 
@@ -4054,11 +4008,11 @@ var DynamicBackgroundColorEditor_1 = __webpack_require__(122);
 
 var TrellisEditors_1 = __webpack_require__(126);
 
-var VizBehavior_1 = __webpack_require__(8);
+var VizBehavior_1 = __webpack_require__(7);
 
-var configUtils_2 = __webpack_require__(27);
+var configUtils_2 = __webpack_require__(26);
 
-var VizCategory_1 = __webpack_require__(23);
+var VizCategory_1 = __webpack_require__(22);
 
 var dataContract = {
   requiredDataSources: [{
@@ -4333,6 +4287,14 @@ var editorConfig = [{
       var options = _ref7.options;
       return options.trendDisplay === 'off';
     }
+  }], [{
+    label: (0, i18n_1._)('Major value abbreviation'),
+    option: 'shouldAbbreviateMajorValue',
+    editor: 'editor.checkbox'
+  }], [{
+    label: (0, i18n_1._)('Trend value abbreviation'),
+    option: 'shouldAbbreviateTrendValue',
+    editor: 'editor.checkbox'
   }], [{
     label: (0, i18n_1._)('Alignment'),
     editor: 'editor.radioBar',
@@ -4393,18 +4355,18 @@ exports.default = (0, configUtils_2.enhanceConfig)(config);
 
 /***/ }),
 
-/***/ 492:
+/***/ 484:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony import */ var _babel_runtime_helpers_toConsumableArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+/* harmony import */ var _babel_runtime_helpers_toConsumableArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(6);
 /* harmony import */ var _babel_runtime_helpers_toConsumableArray__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_helpers_toConsumableArray__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(2);
+/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(3);
 /* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var _splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(70);
+/* harmony import */ var _splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(69);
 /* harmony import */ var _splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_colorConstants__WEBPACK_IMPORTED_MODULE_2__);
-/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(29);
+/* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(28);
 /* harmony import */ var _splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_3__);
 
 
@@ -4428,7 +4390,7 @@ var StaticIconColorEditor = [{
 
 /***/ }),
 
-/***/ 50:
+/***/ 49:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -4440,7 +4402,14 @@ Object.defineProperty(exports, "__esModule", {
 
 /***/ }),
 
-/***/ 51:
+/***/ 5:
+/***/ (function(module, exports) {
+
+module.exports = require("@babel/runtime/helpers/slicedToArray");
+
+/***/ }),
+
+/***/ 50:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -4452,7 +4421,7 @@ Object.defineProperty(exports, "__esModule", {
 
 /***/ }),
 
-/***/ 511:
+/***/ 503:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -4460,19 +4429,19 @@ Object.defineProperty(exports, "__esModule", {
 __webpack_require__.r(__webpack_exports__);
 
 // EXTERNAL MODULE: external "@babel/runtime/helpers/slicedToArray"
-var slicedToArray_ = __webpack_require__(6);
+var slicedToArray_ = __webpack_require__(5);
 var slicedToArray_default = /*#__PURE__*/__webpack_require__.n(slicedToArray_);
 
 // EXTERNAL MODULE: external "@babel/runtime/helpers/extends"
-var extends_ = __webpack_require__(69);
+var extends_ = __webpack_require__(68);
 var extends_default = /*#__PURE__*/__webpack_require__.n(extends_);
 
 // EXTERNAL MODULE: external "react"
-var external_react_ = __webpack_require__(0);
+var external_react_ = __webpack_require__(1);
 var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
 
 // EXTERNAL MODULE: external "prop-types"
-var external_prop_types_ = __webpack_require__(1);
+var external_prop_types_ = __webpack_require__(0);
 var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);
 
 // EXTERNAL MODULE: external "styled-components"
@@ -4488,62 +4457,62 @@ var isEmpty_ = __webpack_require__(130);
 var isEmpty_default = /*#__PURE__*/__webpack_require__.n(isEmpty_);
 
 // EXTERNAL MODULE: external "@splunk/visualization-context/FeatureFlagContext"
-var FeatureFlagContext_ = __webpack_require__(28);
+var FeatureFlagContext_ = __webpack_require__(27);
 var FeatureFlagContext_default = /*#__PURE__*/__webpack_require__.n(FeatureFlagContext_);
 
 // EXTERNAL MODULE: external "@splunk/visualization-schemas"
-var visualization_schemas_ = __webpack_require__(10);
+var visualization_schemas_ = __webpack_require__(9);
 
 // EXTERNAL MODULE: external "@splunk/visualizations-shared/style"
-var style_ = __webpack_require__(19);
+var style_ = __webpack_require__(18);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/i18n"
-var i18n_ = __webpack_require__(2);
+var i18n_ = __webpack_require__(3);
 
 // EXTERNAL MODULE: external "@splunk/visualizations-shared/SizeAwareWrapper"
-var SizeAwareWrapper_ = __webpack_require__(26);
+var SizeAwareWrapper_ = __webpack_require__(25);
 var SizeAwareWrapper_default = /*#__PURE__*/__webpack_require__.n(SizeAwareWrapper_);
 
 // EXTERNAL MODULE: external "@splunk/visualizations-shared/Message"
-var Message_ = __webpack_require__(12);
+var Message_ = __webpack_require__(11);
 var Message_default = /*#__PURE__*/__webpack_require__.n(Message_);
 
 // EXTERNAL MODULE: ./src/common/components/VizStyleWrapper.jsx
-var VizStyleWrapper = __webpack_require__(94);
+var VizStyleWrapper = __webpack_require__(93);
 
 // EXTERNAL MODULE: ./src/common/components/TrellisTitle.tsx
-var TrellisTitle = __webpack_require__(100);
+var TrellisTitle = __webpack_require__(99);
 
 // EXTERNAL MODULE: external "@babel/runtime/helpers/defineProperty"
-var defineProperty_ = __webpack_require__(13);
+var defineProperty_ = __webpack_require__(12);
 var defineProperty_default = /*#__PURE__*/__webpack_require__.n(defineProperty_);
 
 // EXTERNAL MODULE: external "@splunk/visualizations/SingleValueBasic"
-var SingleValueBasic_ = __webpack_require__(161);
+var SingleValueBasic_ = __webpack_require__(159);
 var SingleValueBasic_default = /*#__PURE__*/__webpack_require__.n(SingleValueBasic_);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/enterprise/Activity"
-var Activity_ = __webpack_require__(190);
+var Activity_ = __webpack_require__(188);
 var Activity_default = /*#__PURE__*/__webpack_require__.n(Activity_);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/enterprise/Clock"
-var Clock_ = __webpack_require__(191);
+var Clock_ = __webpack_require__(189);
 var Clock_default = /*#__PURE__*/__webpack_require__.n(Clock_);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/enterprise/Pencil"
-var Pencil_ = __webpack_require__(192);
+var Pencil_ = __webpack_require__(190);
 var Pencil_default = /*#__PURE__*/__webpack_require__.n(Pencil_);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/enterprise/Star"
-var Star_ = __webpack_require__(193);
+var Star_ = __webpack_require__(191);
 var Star_default = /*#__PURE__*/__webpack_require__.n(Star_);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/enterprise/Question"
-var Question_ = __webpack_require__(194);
+var Question_ = __webpack_require__(192);
 var Question_default = /*#__PURE__*/__webpack_require__.n(Question_);
 
 // EXTERNAL MODULE: ./src/common/utils/singleValueUtils.js
-var singleValueUtils = __webpack_require__(20);
+var singleValueUtils = __webpack_require__(19);
 
 // CONCATENATED MODULE: ./src/SingleValueIcon/PureSingleValueIcon/utils/iconUtils.js
 // Todo: this will be replaced by IconLibrary.Registry
@@ -4957,6 +4926,7 @@ var SingleValueIcon_SingleValueIcon = function SingleValueIcon(_ref) {
       numberPrecision = props.numberPrecision,
       shouldUseThousandSeparators = props.shouldUseThousandSeparators,
       shouldAbbreviateTrendValue = props.shouldAbbreviateTrendValue,
+      shouldAbbreviateMajorValue = props.shouldAbbreviateMajorValue,
       icon = props.icon,
       iconOpacity = props.iconOpacity,
       IconComponent = props.IconComponent,
@@ -5114,6 +5084,7 @@ var SingleValueIcon_SingleValueIcon = function SingleValueIcon(_ref) {
         numberPrecision: numberPrecision,
         shouldUseThousandSeparators: shouldUseThousandSeparators,
         shouldAbbreviateTrendValue: shouldAbbreviateTrendValue,
+        shouldAbbreviateMajorValue: shouldAbbreviateMajorValue,
         toRemoveList: toRemoveList
       }),
           majorText = _computeSingleValueCo.majorText,
@@ -5216,6 +5187,7 @@ SingleValueIcon_SingleValueIcon.propTypes = {
   trendFontSize: external_prop_types_default.a.number,
   trendDisplay: external_prop_types_default.a.oneOf(['absolute', 'percent', 'off']),
   shouldAbbreviateTrendValue: external_prop_types_default.a.bool,
+  shouldAbbreviateMajorValue: external_prop_types_default.a.bool,
   backgroundColor: external_prop_types_default.a.string,
   unit: external_prop_types_default.a.string,
   unitPosition: external_prop_types_default.a.string,
@@ -5245,6 +5217,7 @@ SingleValueIcon_SingleValueIcon.defaultProps = {
   majorValueField: '',
   trendDisplay: 'absolute',
   shouldAbbreviateTrendValue: false,
+  shouldAbbreviateMajorValue: false,
   numberPrecision: 0,
   shouldUseThousandSeparators: true,
   unitPosition: 'after',
@@ -5263,7 +5236,7 @@ SingleValueIcon_SingleValueIcon.defaultProps = {
 
 /***/ }),
 
-/***/ 52:
+/***/ 51:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -5275,7 +5248,7 @@ Object.defineProperty(exports, "__esModule", {
 
 /***/ }),
 
-/***/ 53:
+/***/ 52:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -5287,7 +5260,7 @@ Object.defineProperty(exports, "__esModule", {
 
 /***/ }),
 
-/***/ 54:
+/***/ 53:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -5299,65 +5272,65 @@ Object.defineProperty(exports, "__esModule", {
 
 /***/ }),
 
-/***/ 55:
+/***/ 54:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
-var _slicedToArray = __webpack_require__(6);
+var _slicedToArray = __webpack_require__(5);
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var React = __webpack_require__(0);
+var React = __webpack_require__(1);
 
-var lodash_1 = __webpack_require__(3);
+var lodash_1 = __webpack_require__(2);
 
-var getSettingsFromThemedProps_1 = __webpack_require__(56);
+var getSettingsFromThemedProps_1 = __webpack_require__(55);
 
-var Options_1 = __webpack_require__(17);
+var Options_1 = __webpack_require__(16);
 
-var SanitizeProps_1 = __webpack_require__(57);
+var SanitizeProps_1 = __webpack_require__(56);
 
-var TimezoneContext_1 = __webpack_require__(32);
+var TimezoneContext_1 = __webpack_require__(31);
 
-var moment_1 = __webpack_require__(58);
+var moment_1 = __webpack_require__(57);
 
-var FeatureFlagContext_1 = __webpack_require__(28);
+var FeatureFlagContext_1 = __webpack_require__(27);
 
 var styled_components_1 = __webpack_require__(4);
 
-var hocUtils_1 = __webpack_require__(34);
+var hocUtils_1 = __webpack_require__(33);
 
-var JSONSchemaUtils_1 = __webpack_require__(35);
+var JSONSchemaUtils_1 = __webpack_require__(34);
 
-var async_dynamic_options_evaluator_1 = __webpack_require__(59);
+var async_dynamic_options_evaluator_1 = __webpack_require__(58);
 
-var id_1 = __webpack_require__(31);
+var id_1 = __webpack_require__(30);
 
-var SplunkVisualization_1 = __webpack_require__(60);
+var SplunkVisualization_1 = __webpack_require__(59);
 
-var VizBehavior_1 = __webpack_require__(8);
+var VizBehavior_1 = __webpack_require__(7);
 
-var getSorting_1 = __webpack_require__(38);
+var getSorting_1 = __webpack_require__(37);
 
-var getPagination_1 = __webpack_require__(39);
+var getPagination_1 = __webpack_require__(38);
 
-var useDeepMemo_1 = __webpack_require__(61);
+var useDeepMemo_1 = __webpack_require__(60);
 
-var MissingPropsMessage_1 = __webpack_require__(62);
+var MissingPropsMessage_1 = __webpack_require__(61);
 
-var withEditModeCover_1 = __webpack_require__(63);
+var withEditModeCover_1 = __webpack_require__(62);
 
-var withPlaceholder_1 = __webpack_require__(64);
+var withPlaceholder_1 = __webpack_require__(63);
 
-var useDownsampleDataSources_1 = __webpack_require__(65);
+var useDownsampleDataSources_1 = __webpack_require__(64);
 
-var dataUtils_1 = __webpack_require__(15);
+var dataUtils_1 = __webpack_require__(14);
 
-var featureFlagUtils_1 = __webpack_require__(67);
+var featureFlagUtils_1 = __webpack_require__(66);
 /**
  * hoc that wraps a pure react visualization in a Dashboard visualization
  * @param {DashboardVizOpts} opts
@@ -5690,48 +5663,41 @@ exports.default = withDashboardViz;
 
 /***/ }),
 
-/***/ 56:
+/***/ 55:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/themes/getSettingsFromThemedProps");
 
 /***/ }),
 
-/***/ 57:
+/***/ 56:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/SanitizeProps");
 
 /***/ }),
 
-/***/ 58:
+/***/ 57:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/moment");
 
 /***/ }),
 
-/***/ 59:
+/***/ 58:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/async-dynamic-options-evaluator");
 
 /***/ }),
 
-/***/ 6:
-/***/ (function(module, exports) {
-
-module.exports = require("@babel/runtime/helpers/slicedToArray");
-
-/***/ }),
-
-/***/ 60:
+/***/ 59:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
-var _classCallCheck = __webpack_require__(9);
+var _classCallCheck = __webpack_require__(8);
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -5739,11 +5705,11 @@ Object.defineProperty(exports, "__esModule", {
 exports.INITIAL_HEIGHT = exports.INITIAL_WIDTH = void 0;
 /* eslint-disable react/no-unused-prop-types,react/prefer-stateless-function */
 
-var T = __webpack_require__(1);
+var T = __webpack_require__(0);
 
-var lodash_1 = __webpack_require__(3);
+var lodash_1 = __webpack_require__(2);
 
-var VizActionHandler_1 = __webpack_require__(22); // this is identical to the initial height and width we use in BaseVisualization in dashboard-visualizations
+var VizActionHandler_1 = __webpack_require__(21); // this is identical to the initial height and width we use in BaseVisualization in dashboard-visualizations
 
 
 exports.INITIAL_WIDTH = 250;
@@ -5877,7 +5843,14 @@ exports.default = SplunkVisualization;
 
 /***/ }),
 
-/***/ 61:
+/***/ 6:
+/***/ (function(module, exports) {
+
+module.exports = require("@babel/runtime/helpers/toConsumableArray");
+
+/***/ }),
+
+/***/ 60:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -5888,9 +5861,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useDeepMemo = void 0;
 
-var react_1 = __webpack_require__(0);
+var react_1 = __webpack_require__(1);
 
-var lodash_1 = __webpack_require__(3);
+var lodash_1 = __webpack_require__(2);
 /**
  * This hook evaluates and stores the result of a passed function and only
  * re-evaluates the function when passed dependencies change.
@@ -5923,7 +5896,7 @@ exports.useDeepMemo = useDeepMemo;
 
 /***/ }),
 
-/***/ 62:
+/***/ 61:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -5934,15 +5907,15 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.MissingPropsMessage = exports.missingKeys = exports.isMissing = void 0;
 
-var React = __webpack_require__(0);
+var React = __webpack_require__(1);
 
-var T = __webpack_require__(1);
+var T = __webpack_require__(0);
 
-var i18n_1 = __webpack_require__(2);
+var i18n_1 = __webpack_require__(3);
 
-var Message_1 = __webpack_require__(12);
+var Message_1 = __webpack_require__(11);
 
-var FixedSizeContainer_1 = __webpack_require__(18);
+var FixedSizeContainer_1 = __webpack_require__(17);
 /**
  * @method isMissing
  * @param {any} v
@@ -6004,7 +5977,7 @@ exports.default = (0, FixedSizeContainer_1.default)(exports.MissingPropsMessage)
 
 /***/ }),
 
-/***/ 63:
+/***/ 62:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -6014,18 +5987,18 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var React = __webpack_require__(0);
+var React = __webpack_require__(1);
 
 var styled_components_1 = __webpack_require__(4);
 
-var hocUtils_1 = __webpack_require__(24);
+var hocUtils_1 = __webpack_require__(23);
 
 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.attrs({
-  'data-splunk-visualization-version': "26.3.0 - a1ef240a6"
+  'data-splunk-visualization-version': "26.4.1 - 2b7482c08"
 }).withConfig({
   displayName: "withEditModeCover__Blocker",
   componentId: "sc-1gsbnxb-1"
@@ -6057,7 +6030,7 @@ exports.default = withEditModeCover;
 
 /***/ }),
 
-/***/ 64:
+/***/ 63:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -6067,17 +6040,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var React = __webpack_require__(0);
+var React = __webpack_require__(1);
 
-var colorUtils_1 = __webpack_require__(16);
+var colorUtils_1 = __webpack_require__(15);
 
-var variables_1 = __webpack_require__(14);
+var variables_1 = __webpack_require__(13);
 
-var IconPlaceholder_1 = __webpack_require__(37);
+var IconPlaceholder_1 = __webpack_require__(36);
 
-var VizBehavior_1 = __webpack_require__(8);
+var VizBehavior_1 = __webpack_require__(7);
 
-var hocUtils_1 = __webpack_require__(24);
+var hocUtils_1 = __webpack_require__(23);
 
 var withPlaceholder = function withPlaceholder(Visualization) {
   var useIconPlaceholder = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : IconPlaceholder_1.shouldShowIconPlaceholder;
@@ -6122,27 +6095,30 @@ exports.default = withPlaceholder;
 
 /***/ }),
 
-/***/ 65:
+/***/ 64:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
-var _slicedToArray = __webpack_require__(6);
+var _slicedToArray = __webpack_require__(5);
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var react_1 = __webpack_require__(0);
+var react_1 = __webpack_require__(1);
 
-var lodash_1 = __webpack_require__(3);
+var lodash_1 = __webpack_require__(2);
 
-var dataUtils_1 = __webpack_require__(15);
+var dataUtils_1 = __webpack_require__(14);
 
-var usePrevious_1 = __webpack_require__(33);
+var usePrevious_1 = __webpack_require__(32);
 
-var useGetXAndYFields_1 = __webpack_require__(66);
+var useGetXAndYFields_1 = __webpack_require__(65); // Options properties which impact/require re-downsample on change.
+
+
+var downsampleVizOptionProperties = ['nullValueDisplay'];
 
 var useDownsampleDataSources = function useDownsampleDataSources(_ref) {
   var dataSources = _ref.dataSources,
@@ -6156,8 +6132,15 @@ var useDownsampleDataSources = function useDownsampleDataSources(_ref) {
     options: options,
     context: context,
     dataSources: dataSources
-  });
-  var previousXAndYFieldsWithTypes = (0, usePrevious_1.default)(xAndYFieldsWithTypes);
+  }); // Extract viz options that impact downsampling.
+
+  var downsampleVizOptions = (0, react_1.useMemo)(function () {
+    return (0, lodash_1.pick)(options, downsampleVizOptionProperties);
+  }, [options]);
+  var downsampleDSOptions = (0, react_1.useMemo)(function () {
+    return Object.assign(Object.assign({}, downsampleVizOptions), xAndYFieldsWithTypes);
+  }, [xAndYFieldsWithTypes, downsampleVizOptions]);
+  var previousDownsampleDSOptions = (0, usePrevious_1.default)(downsampleDSOptions);
   var previousDataSources = (0, usePrevious_1.default)(dataSources);
   var previousThreshold = (0, usePrevious_1.default)(threshold);
 
@@ -6165,7 +6148,7 @@ var useDownsampleDataSources = function useDownsampleDataSources(_ref) {
     return isDownsamplingEnabled ? (0, dataUtils_1.downsampleDataSources)({
       dataSources: dataSources,
       threshold: threshold,
-      options: xAndYFieldsWithTypes
+      options: downsampleDSOptions
     }) : dataSources;
   }),
       _ref3 = _slicedToArray(_ref2, 2),
@@ -6193,7 +6176,7 @@ var useDownsampleDataSources = function useDownsampleDataSources(_ref) {
       return;
     }
 
-    if ((0, lodash_1.isEqual)(previousXAndYFieldsWithTypes, xAndYFieldsWithTypes) && previousDataSources === dataSources && previousThreshold === threshold) {
+    if ((0, lodash_1.isEqual)(previousDownsampleDSOptions, downsampleDSOptions) && previousDataSources === dataSources && previousThreshold === threshold) {
       return;
     } // Debounce the downsampling so we don't have to downsample and execute DSL multiple times
     // while the viz is being resized
@@ -6201,10 +6184,10 @@ var useDownsampleDataSources = function useDownsampleDataSources(_ref) {
 
     debouncedDownsampleDataSources({
       dataSources: dataSources,
-      options: xAndYFieldsWithTypes,
+      options: downsampleDSOptions,
       threshold: threshold
     }); // need to detect if this runs as part of the initial render
-  }, [dataSources, debouncedDownsampleDataSources, xAndYFieldsWithTypes, threshold, isDownsamplingEnabled, previousXAndYFieldsWithTypes, previousDataSources, previousThreshold]);
+  }, [dataSources, downsampleDSOptions, debouncedDownsampleDataSources, xAndYFieldsWithTypes, threshold, isDownsamplingEnabled, previousDataSources, previousThreshold, previousDownsampleDSOptions]);
   return downsampledDataSources;
 };
 
@@ -6212,21 +6195,21 @@ exports.default = useDownsampleDataSources;
 
 /***/ }),
 
-/***/ 66:
+/***/ 65:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
-var _toConsumableArray = __webpack_require__(7);
+var _toConsumableArray = __webpack_require__(6);
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var react_1 = __webpack_require__(0);
+var react_1 = __webpack_require__(1);
 
-var Options_1 = __webpack_require__(17);
+var Options_1 = __webpack_require__(16);
 /**
  * Hook that evaluates the DSL for subset of a viz's options needed to determine
  * its x and y fields as well as the types of all its fields.
@@ -6327,7 +6310,7 @@ exports.default = useGetXAndYFields;
 
 /***/ }),
 
-/***/ 67:
+/***/ 66:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -6338,7 +6321,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getFeatureFlag = void 0;
 
-var FeatureFlags_1 = __webpack_require__(68);
+var FeatureFlags_1 = __webpack_require__(67);
 
 var getFeatureFlag = function getFeatureFlag(context, flagName) {
   // look for feature flag in context first
@@ -6363,49 +6346,28 @@ exports.getFeatureFlag = getFeatureFlag;
 
 /***/ }),
 
-/***/ 68:
+/***/ 67:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualization-context/FeatureFlags");
 
 /***/ }),
 
-/***/ 69:
+/***/ 68:
 /***/ (function(module, exports) {
 
 module.exports = require("@babel/runtime/helpers/extends");
 
 /***/ }),
 
-/***/ 7:
-/***/ (function(module, exports) {
-
-module.exports = require("@babel/runtime/helpers/toConsumableArray");
-
-/***/ }),
-
-/***/ 70:
+/***/ 69:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualizations-shared/colorConstants");
 
 /***/ }),
 
-/***/ 74:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/visualizations-shared/domUtils");
-
-/***/ }),
-
-/***/ 77:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/themes/useSplunkTheme");
-
-/***/ }),
-
-/***/ 8:
+/***/ 7:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -6445,14 +6407,35 @@ var VizBehavior;
 
 /***/ }),
 
-/***/ 80:
+/***/ 73:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/visualizations-shared/domUtils");
+
+/***/ }),
+
+/***/ 76:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/themes/useSplunkTheme");
+
+/***/ }),
+
+/***/ 79:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/themes");
 
 /***/ }),
 
-/***/ 81:
+/***/ 8:
+/***/ (function(module, exports) {
+
+module.exports = require("@babel/runtime/helpers/classCallCheck");
+
+/***/ }),
+
+/***/ 80:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualization-color-palettes/editors/PresetPalettes");
@@ -6462,11 +6445,11 @@ module.exports = require("@splunk/visualization-color-palettes/editors/PresetPal
 /***/ 9:
 /***/ (function(module, exports) {
 
-module.exports = require("@babel/runtime/helpers/classCallCheck");
+module.exports = require("@splunk/visualization-schemas");
 
 /***/ }),
 
-/***/ 94:
+/***/ 93:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -6489,6 +6472,51 @@ var VizStyleWrapper = styled_components__WEBPACK_IMPORTED_MODULE_0___default.a.d
 VizStyleWrapper.displayName = 'VizStyleWrapper';
 /* harmony default export */ __webpack_exports__["default"] = (VizStyleWrapper);
 
+/***/ }),
+
+/***/ 99:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TrellisTitle = exports.TRELLIS_TITLE_HEIGHT = void 0;
+
+var React = __webpack_require__(1);
+
+var styled_components_1 = __webpack_require__(4);
+
+exports.TRELLIS_TITLE_HEIGHT = 28;
+var TrellisTitleText = styled_components_1.default.div.withConfig({
+  displayName: "TrellisTitle__TrellisTitleText",
+  componentId: "sc-2cu404-0"
+})(["margin-left:10px;margin-right:10px;padding-top:8px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;"]);
+var TrellisTitleDiv = styled_components_1.default.div.withConfig({
+  displayName: "TrellisTitle__TrellisTitleDiv",
+  componentId: "sc-2cu404-1"
+})(["height:", "px;font-size:14px;font-weight:700;color:", ";background-color:", ";box-shadow:0 1px ", ";"], exports.TRELLIS_TITLE_HEIGHT, function (props) {
+  return props.fontColor;
+}, function (props) {
+  return props.backgroundColor;
+}, function (props) {
+  return props.backgroundColor;
+});
+
+var TrellisTitle = function TrellisTitle(props) {
+  var titleText = String(props.trellisKey).toString();
+  return React.createElement(TrellisTitleDiv, {
+    fontColor: props.fontColor,
+    backgroundColor: props.backgroundColor,
+    "data-test": "trellis-title",
+    title: titleText
+  }, React.createElement(TrellisTitleText, null, titleText));
+};
+
+exports.TrellisTitle = TrellisTitle;
+
 /***/ })
 
 /******/ });