@splunk/visualizations 25.13.0 → 26.0.0

package/SingleValueRadial.config.js

@@ -305,8 +305,8 @@ function hasCompatibleOptions(vizOptions, presetOptions) {
  */
 function getInitialPreset(vizContext, vizOptions, presets) {
   return presets.find(function (preset) {
-    var presetContext = lodash_1.get(preset, ['value', 'context'], {});
-    var presetOptions = lodash_1.get(preset, ['value', 'options'], {});
+    var presetContext = (0, lodash_1.get)(preset, ['value', 'context'], {});
+    var presetOptions = (0, lodash_1.get)(preset, ['value', 'options'], {});
     var presetContextKeys = Object.keys(presetContext);
     var presetOptionKeys = Object.keys(presetOptions);
     // all presets have to explicitly specify which options to reset (i.e. need explicitly undefined keys)
@@ -323,7 +323,7 @@ exports.getInitialPreset = getInitialPreset;
  * @returns {{ label: string; value; string  }[]} array of { label, value } tuples
  */
 function generatePrecisionValues(numPrecisionValues) {
-  return lodash_1.range(0, numPrecisionValues + 1).map(function (i) {
+  return (0, lodash_1.range)(0, numPrecisionValues + 1).map(function (i) {
     return {
       label: "".concat(i, " (0").concat(i > 0 ? '.' : '').concat('0'.repeat(i), ")"),
       value: i
@@ -477,56 +477,6 @@ var StaticBackgroundColorEditor = {
 /* 27 */
 /***/ (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__(0);
-/* 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__(5);
-/* 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 getDynamicMajorColorEditor = function getDynamicMajorColorEditor(_ref) {
-  var defaultContext = _ref.defaultContext,
-    defaultPalettesConfig = _ref.defaultPalettesConfig;
-  return {
-    label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Major value'),
-    option: 'majorColor',
-    context: 'majorColorEditorConfig',
-    editor: 'editor.dynamicColor',
-    showEditor: function showEditor(_ref2) {
-      var options = _ref2.options;
-      return Object(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__["isDynamicOption"])(options.majorColor);
-    },
-    editorProps: {
-      labelPosition: 'top',
-      flyoutTitle: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Dynamic coloring: major value'),
-      formatters: [{
-        label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Ranges'),
-        value: 'rangeValue',
-        defaults: {
-          majorValue: defaultContext.majorColorConfig
-        }
-      }, {
-        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'
-      }],
-      defaultPalettesConfig: defaultPalettesConfig
-    }
-  };
-};
-
-/***/ }),
-/* 28 */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDynamicTrendColorEditor", function() { return getDynamicTrendColorEditor; });
@@ -568,7 +518,7 @@ var getDynamicTrendColorEditor = function getDynamicTrendColorEditor(_ref) {
 };
 
 /***/ }),
-/* 29 */
+/* 28 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -622,7 +572,7 @@ var getDynamicBackgroundColorEditor = function getDynamicBackgroundColorEditor(_
 };
 
 /***/ }),
-/* 30 */
+/* 29 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -672,7 +622,7 @@ var StaticMajorAndTrendLayout = [[{
 /* harmony default export */ __webpack_exports__["default"] = (StaticMajorAndTrendLayout);
 
 /***/ }),
-/* 31 */
+/* 30 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -695,7 +645,7 @@ var StaticMajorColorEditor = {
 /* harmony default export */ __webpack_exports__["default"] = (StaticMajorColorEditor);
 
 /***/ }),
-/* 32 */
+/* 31 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -722,7 +672,7 @@ var StaticTrendColorEditor = {
 /* harmony default export */ __webpack_exports__["default"] = (StaticTrendColorEditor);
 
 /***/ }),
-/* 33 */
+/* 32 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -732,13 +682,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.TrellisBackgroundColorEditor = exports.TrellisEditorConfig = void 0;
-var React = __webpack_require__(34);
+var React = __webpack_require__(33);
 var i18n_1 = __webpack_require__(0);
-var FeatureFlagContext_1 = __webpack_require__(35);
+var FeatureFlagContext_1 = __webpack_require__(34);
 var layoutUtils_1 = __webpack_require__(22);
 /* eslint-disable react-hooks/rules-of-hooks */
 exports.TrellisEditorConfig = [[{
-  label: i18n_1._('Trellis layout'),
+  label: (0, i18n_1._)('Trellis layout'),
   option: 'splitByLayout',
   editor: 'editor.toggle',
   showEditor: function showEditor() {
@@ -747,7 +697,7 @@ exports.TrellisEditorConfig = [[{
     return isTrellisFeatureFlagOn;
   }
 }], [{
-  label: i18n_1._('Split by'),
+  label: (0, i18n_1._)('Split by'),
   option: 'trellisSplitBy',
   editor: 'editor.trellisSplitBy',
   editorProps: {
@@ -760,13 +710,13 @@ exports.TrellisEditorConfig = [[{
     return isTrellisFeatureFlagOn && options.splitByLayout === layoutUtils_1.LAYOUT_TYPE.Trellis;
   }
 }], [{
-  label: i18n_1._('Number of columns'),
+  label: (0, i18n_1._)('Number of columns'),
   option: 'trellisColumns',
   editor: 'editor.number',
   editorProps: {
     min: 1
   },
-  placeholder: i18n_1._('Auto'),
+  placeholder: (0, i18n_1._)('Auto'),
   showEditor: function showEditor(_ref2) {
     var options = _ref2.options;
     var featureFlagContext = React.useContext(FeatureFlagContext_1.default);
@@ -774,7 +724,7 @@ exports.TrellisEditorConfig = [[{
     return isTrellisFeatureFlagOn && options.splitByLayout === layoutUtils_1.LAYOUT_TYPE.Trellis;
   }
 }], [{
-  label: i18n_1._('Min column width'),
+  label: (0, i18n_1._)('Min column width'),
   option: 'trellisMinColumnWidth',
   editor: 'editor.number',
   editorProps: {
@@ -787,7 +737,7 @@ exports.TrellisEditorConfig = [[{
     return isTrellisFeatureFlagOn && options.splitByLayout === layoutUtils_1.LAYOUT_TYPE.Trellis;
   }
 }, {
-  label: i18n_1._('Row height'),
+  label: (0, i18n_1._)('Row height'),
   option: 'trellisRowHeight',
   editor: 'editor.number',
   editorProps: {
@@ -800,7 +750,7 @@ exports.TrellisEditorConfig = [[{
     return isTrellisFeatureFlagOn && options.splitByLayout === layoutUtils_1.LAYOUT_TYPE.Trellis;
   }
 }], [{
-  label: i18n_1._('Max number of components per page'),
+  label: (0, i18n_1._)('Max number of components per page'),
   option: 'trellisPageCount',
   editor: 'editor.number',
   editorProps: {
@@ -814,7 +764,7 @@ exports.TrellisEditorConfig = [[{
   }
 }]];
 exports.TrellisBackgroundColorEditor = {
-  label: i18n_1._('Trellis background'),
+  label: (0, i18n_1._)('Trellis background'),
   option: 'trellisBackgroundColor',
   editor: 'editor.color',
   showEditor: function showEditor(_ref6) {
@@ -826,18 +776,19 @@ exports.TrellisBackgroundColorEditor = {
 };
 
 /***/ }),
-/* 34 */
+/* 33 */
 /***/ (function(module, exports) {
 
 module.exports = require("react");
 
 /***/ }),
-/* 35 */
+/* 34 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/visualization-context/FeatureFlagContext");
 
 /***/ }),
+/* 35 */,
 /* 36 */,
 /* 37 */,
 /* 38 */,
@@ -897,18 +848,19 @@ var variables_1 = __webpack_require__(10);
 var PresetPalettes_1 = __webpack_require__(15);
 var visualization_icons_1 = __webpack_require__(12);
 var placeholders_1 = __webpack_require__(11);
-var StaticMajorAndTrendLayout_1 = __webpack_require__(30);
+var configUtils_1 = __webpack_require__(5);
+var StaticMajorAndTrendLayout_1 = __webpack_require__(29);
 var VizBehavior_1 = __webpack_require__(2);
-var configUtils_1 = __webpack_require__(4);
+var configUtils_2 = __webpack_require__(4);
 var VizCategory_1 = __webpack_require__(8);
-var DynamicMajorColorEditor_1 = __webpack_require__(27);
-var DynamicTrendColorEditor_1 = __webpack_require__(28);
-var DynamicBackgroundColorEditor_1 = __webpack_require__(29);
-var StaticMajorColorEditor_1 = __webpack_require__(31);
-var StaticTrendColorEditor_1 = __webpack_require__(32);
+var DynamicMajorColorAndGaugeEditor_1 = __webpack_require__(79);
+var DynamicTrendColorEditor_1 = __webpack_require__(27);
+var DynamicBackgroundColorEditor_1 = __webpack_require__(28);
+var StaticMajorColorEditor_1 = __webpack_require__(30);
+var StaticTrendColorEditor_1 = __webpack_require__(31);
 var StaticBackgroundColorEditor_1 = __webpack_require__(25);
-var RadialBackgroundColor_1 = __webpack_require__(79);
-var TrellisEditors_1 = __webpack_require__(33);
+var RadialBackgroundColor_1 = __webpack_require__(80);
+var TrellisEditors_1 = __webpack_require__(32);
 var layoutUtils_1 = __webpack_require__(22);
 var dataContract = {
   requiredDataSources: [{
@@ -928,13 +880,6 @@ var size = {
   initialHeight: 250
 };
 var defaultContext = {
-  trendColorConfig: [{
-    to: 0,
-    value: '#9E2520'
-  }, {
-    from: 0,
-    value: '#1C6B2D'
-  }],
   majorColorConfig: [{
     to: 20,
     value: '#D41F1F'
@@ -957,6 +902,13 @@ var defaultContext = {
   majorColorMatchConfig: [{
     match: '',
     value: '#5C33FF'
+  }],
+  trendColorConfig: [{
+    to: 0,
+    value: '#9E2520'
+  }, {
+    from: 0,
+    value: '#1C6B2D'
   }]
 };
 var optionsSchema = {
@@ -966,6 +918,31 @@ var optionsSchema = {
     pattern: schemaUtils_1.COLOR_OR_TOKEN_PATTERN_WITH_RGBA,
     type: 'string'
   },
+  gaugeRanges: {
+    default: '> majorColorEditorConfig',
+    description: 'Specify the overall range of the gauge as a series of continuous, color-coded subranges. For example, [{"to": 20, "value": "#4BEBA8"}, {"from": 20, "to": 50, "value": "#D41F1F"}, {"from": 50, "value": "#F4DF7A"}]. Must be unbounded, open ranges. Ranges are bound by a separate minValue/maxValue option. Only configured if isGaugeOn is true.',
+    type: 'array',
+    items: {
+      type: 'object',
+      properties: {
+        from: {
+          type: 'number'
+        },
+        to: {
+          type: 'number'
+        },
+        value: {
+          type: 'string',
+          pattern: schemaUtils_1.COLOR_OR_TOKEN_PATTERN_WITH_RGBA
+        }
+      }
+    }
+  },
+  isGaugeOn: {
+    default: false,
+    description: 'Specify if gauge is on.',
+    type: 'boolean'
+  },
   majorColor: {
     default: '> themes.defaultFontColor',
     description: 'Specify the color for the major value. You may use a dataSource to apply the color. The hex value format should be “#ffffff”. The default for enterprise light is "#000000". The default for enterprise dark is "#ffffff". The default for prisma dark is "rgba(255, 255, 255, 0.98)".',
@@ -982,6 +959,11 @@ var optionsSchema = {
     description: 'Specify the field that should be mapped to the major value.',
     type: 'string'
   },
+  minValue: {
+    default: 0,
+    description: 'Specify the min value of the radial.',
+    type: 'number'
+  },
   maxValue: {
     default: 100,
     description: 'Specify the value the radial fills up to.',
@@ -1020,7 +1002,7 @@ var optionsSchema = {
     default: 'off',
     description: 'Specify the layout method by which to display the visualization, which splits the data into individual visualizations based on a certain category.',
     type: 'string',
-    pattern: schemaUtils_1.getPattern([layoutUtils_1.LAYOUT_TYPE.Off, layoutUtils_1.LAYOUT_TYPE.Trellis]),
+    pattern: (0, schemaUtils_1.getPattern)([layoutUtils_1.LAYOUT_TYPE.Off, layoutUtils_1.LAYOUT_TYPE.Trellis]),
     enum: [layoutUtils_1.LAYOUT_TYPE.Off, layoutUtils_1.LAYOUT_TYPE.Trellis]
   },
   trendColor: {
@@ -1032,7 +1014,7 @@ var optionsSchema = {
   trendDisplay: {
     default: 'absolute',
     description: 'Specify how to display the trend value.',
-    pattern: schemaUtils_1.getPattern(['percent', 'absolute', 'off']),
+    pattern: (0, schemaUtils_1.getPattern)(['percent', 'absolute', 'off']),
     type: 'string'
   },
   trendValue: {
@@ -1084,7 +1066,7 @@ var optionsSchema = {
   unitPosition: {
     default: 'after',
     description: 'Specify whether the unit text should appear before or after the major value.',
-    pattern: schemaUtils_1.getPattern(['before', 'after']),
+    pattern: (0, schemaUtils_1.getPattern)(['before', 'after']),
     type: 'string'
   }
 };
@@ -1100,14 +1082,14 @@ var basePresetOptions = {
 };
 var presets = [{
   // dummy context variables to allow for resetting of unused context states
-  label: i18n_1._('None'),
+  label: (0, i18n_1._)('None'),
   name: 'singleValueRadial.none',
   value: {
     context: Object.assign({}, basePresetContext),
     options: Object.assign({}, basePresetOptions)
   }
 }, {
-  label: i18n_1._('Major value'),
+  label: (0, i18n_1._)('Major value and gauge'),
   name: 'singleValueRadial.majorValue',
   value: {
     context: Object.assign(Object.assign({}, basePresetContext), {
@@ -1118,7 +1100,7 @@ var presets = [{
     })
   }
 }, {
-  label: i18n_1._('Major value and Trend value'),
+  label: (0, i18n_1._)('Major value, trend value, and gauge'),
   name: 'singleValueRadial.majorValueAndTrend',
   value: {
     context: Object.assign(Object.assign({}, basePresetContext), {
@@ -1131,7 +1113,7 @@ var presets = [{
     })
   }
 }, {
-  label: i18n_1._('Trend value'),
+  label: (0, i18n_1._)('Trend value'),
   name: 'singleValueRadial.trend',
   value: {
     context: Object.assign(Object.assign({}, basePresetContext), {
@@ -1142,7 +1124,7 @@ var presets = [{
     })
   }
 }, {
-  label: i18n_1._('Background'),
+  label: (0, i18n_1._)('Background'),
   name: 'singleValueRadial.background',
   value: {
     context: Object.assign(Object.assign({}, basePresetContext), {
@@ -1155,7 +1137,7 @@ var presets = [{
 }];
 var themes = {
   defaultFontColor: function defaultFontColor(props) {
-    return pick_1.default({
+    return (0, pick_1.default)({
       enterprise: {
         dark: variables_1.default.white(props),
         light: variables_1.default.black(props)
@@ -1164,7 +1146,7 @@ var themes = {
     })(props);
   },
   defaultBackgroundColor: function defaultBackgroundColor(props) {
-    return pick_1.default({
+    return (0, pick_1.default)({
       enterprise: {
         dark: variables_1.default.black(props),
         light: variables_1.default.white(props)
@@ -1173,7 +1155,7 @@ var themes = {
     })(props);
   },
   defaultRadialBackgroundColor: function defaultRadialBackgroundColor(props) {
-    return pick_1.default({
+    return (0, pick_1.default)({
       enterprise: {
         dark: 'rgba(255, 255, 255, 0.15)',
         light: 'rgba(0, 0, 0, 0.1)'
@@ -1183,9 +1165,9 @@ var themes = {
   }
 };
 var editorConfig = [{
-  label: i18n_1._('Data configurations'),
+  label: (0, i18n_1._)('Data configurations'),
   layout: [[{
-    label: i18n_1._('Value'),
+    label: (0, i18n_1._)('Value'),
     editor: 'editor.columnSelector',
     option: 'majorValue',
     context: 'valuesContext',
@@ -1208,20 +1190,20 @@ var editorConfig = [{
     }
   }]]
 }, {
-  label: i18n_1._('Data display'),
+  label: (0, i18n_1._)('Data display'),
   layout: [].concat(_toConsumableArray(StaticMajorAndTrendLayout_1.default), [[{
-    label: i18n_1._('Trend display'),
+    label: (0, i18n_1._)('Trend display'),
     option: 'trendDisplay',
     editor: 'editor.select',
     editorProps: {
       values: [{
-        label: i18n_1._('Percent'),
+        label: (0, i18n_1._)('Percent'),
         value: 'percent'
       }, {
-        label: i18n_1._('Absolute'),
+        label: (0, i18n_1._)('Absolute'),
         value: 'absolute'
       }, {
-        label: i18n_1._('Off'),
+        label: (0, i18n_1._)('Off'),
         value: 'off'
       }]
     },
@@ -1229,11 +1211,19 @@ var editorConfig = [{
       var options = _ref2.options;
       return options.showValue || options.showValue === undefined;
     }
+  }], [{
+    label: (0, i18n_1._)('Min'),
+    option: 'minValue',
+    editor: 'editor.number'
+  }, {
+    label: (0, i18n_1._)('Max'),
+    option: 'maxValue',
+    editor: 'editor.number'
   }]], _toConsumableArray(TrellisEditors_1.TrellisEditorConfig))
 }, {
-  label: i18n_1._('Color and style'),
+  label: (0, i18n_1._)('Color and style'),
   layout: [[{
-    label: i18n_1._('Dynamic elements'),
+    label: (0, i18n_1._)('Dynamic elements'),
     key: 'presetSelector',
     editor: 'editor.presetSelector',
     editorProps: {
@@ -1241,7 +1231,7 @@ var editorConfig = [{
       value: function value(_ref3) {
         var context = _ref3.context,
           options = _ref3.options;
-        var initialPreset = configUtils_1.getInitialPreset(context, options, presets);
+        var initialPreset = (0, configUtils_2.getInitialPreset)(context, options, presets);
         return initialPreset && initialPreset.label || null;
       }
     }
@@ -1249,17 +1239,17 @@ var editorConfig = [{
     editorProps: {
       themes: themes
     }
-  })], [DynamicMajorColorEditor_1.getDynamicMajorColorEditor({
+  })], [(0, DynamicMajorColorAndGaugeEditor_1.getDynamicMajorColorAndGaugeEditor)({
     defaultContext: defaultContext,
     defaultPalettesConfig: PresetPalettes_1.defaultPalettesConfig
   })], [Object.assign(Object.assign({}, StaticTrendColorEditor_1.default), {
     editorProps: {
       themes: themes
     }
-  })], [DynamicTrendColorEditor_1.getDynamicTrendColorEditor({
+  })], [(0, DynamicTrendColorEditor_1.getDynamicTrendColorEditor)({
     defaultContext: defaultContext,
     defaultPalettesConfig: PresetPalettes_1.defaultPalettesConfig
-  })], RadialBackgroundColor_1.default({
+  })], (0, RadialBackgroundColor_1.default)({
     themes: themes
   }), [Object.assign(Object.assign({}, StaticBackgroundColorEditor_1.default), {
     editorProps: {
@@ -1269,10 +1259,18 @@ var editorConfig = [{
     editorProps: {
       themes: themes
     }
-  })], [DynamicBackgroundColorEditor_1.getDynamicBackgroundColorEditor({
+  })], [(0, DynamicBackgroundColorEditor_1.getDynamicBackgroundColorEditor)({
     defaultContext: defaultContext,
     defaultPalettesConfig: PresetPalettes_1.defaultPalettesConfig
-  })]]
+  })], [{
+    label: (0, i18n_1._)('Show gauge ranges'),
+    option: 'isGaugeOn',
+    editor: 'editor.toggle',
+    showEditor: function showEditor(_ref4) {
+      var options = _ref4.options;
+      return (0, configUtils_1.isDynamicOption)(options.majorColor);
+    }
+  }]]
 }];
 /**
  * visualization configuration
@@ -1285,7 +1283,7 @@ var config = {
   /**
    * viz name
    */
-  name: i18n_1._('Single value radial'),
+  name: (0, i18n_1._)('Single value radial'),
   category: VizCategory_1.VizCategory.SINGLE_VALUE,
   /**
    * viz icon
@@ -1306,10 +1304,54 @@ var config = {
   supports: [VizBehavior_1.VizBehavior.DYNAMIC_OPTIONS, VizBehavior_1.VizBehavior.EVENTS, VizBehavior_1.VizBehavior.PLACEHOLDER, VizBehavior_1.VizBehavior.TRELLIS],
   themes: themes
 };
-exports.default = configUtils_1.enhanceConfig(config);
+exports.default = (0, configUtils_2.enhanceConfig)(config);
 
 /***/ }),
 /* 79 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDynamicMajorColorAndGaugeEditor", function() { return getDynamicMajorColorAndGaugeEditor; });
+/* harmony import */ var _splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
+/* 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__(5);
+/* 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 getDynamicMajorColorAndGaugeEditor = function getDynamicMajorColorAndGaugeEditor(_ref) {
+  var defaultContext = _ref.defaultContext,
+    defaultPalettesConfig = _ref.defaultPalettesConfig;
+  return {
+    label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Major value and gauge'),
+    option: 'majorColor',
+    context: 'majorColorEditorConfig',
+    editor: 'editor.dynamicColor',
+    showEditor: function showEditor(_ref2) {
+      var options = _ref2.options;
+      return Object(_splunk_visualizations_shared_configUtils__WEBPACK_IMPORTED_MODULE_1__["isDynamicOption"])(options.majorColor);
+    },
+    editorProps: {
+      labelPosition: 'top',
+      flyoutTitle: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Dynamic coloring: major value'),
+      formatters: [{
+        label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Ranges'),
+        value: 'rangeValue',
+        defaults: {
+          majorValue: defaultContext.majorColorConfig
+        }
+      }],
+      dataSelectors: [{
+        label: Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_0__["_"])('Major value'),
+        value: 'majorValue'
+      }],
+      defaultPalettesConfig: defaultPalettesConfig
+    }
+  };
+};
+
+/***/ }),
+/* 80 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -1324,7 +1366,7 @@ var radialBackground = function radialBackground(_ref) {
     themes = _ref.themes,
     labelPosition = _ref.labelPosition;
   return [{
-    label: i18n_1._(label || 'Radial background'),
+    label: (0, i18n_1._)(label || 'Radial background'),
     option: 'radialBackgroundColor',
     editor: 'editor.color',
     editorProps: {