@splunk/visualizations 26.0.0 → 26.1.0

package/common/OptionsDoc.js

@@ -120,11 +120,14 @@ module.exports = require("@babel/runtime/helpers/slicedToArray");
 
 
 var _typeof = __webpack_require__(13);
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.componentStoriesToInclude = exports.getStoriesToInclude = exports.flattenVizOptions = exports.getOptionsFromArgTypes = exports.transformOptionType = exports.optionsSchemaToArgTypes = exports.platformOptionArgTypes = exports.getOptionControl = exports.getOptionDisplayType = exports.getPatternOptions = void 0;
+
 var lodash_1 = __webpack_require__(3);
+
 var configUtils_1 = __webpack_require__(53);
 /**
  * Returns type options from pattern
@@ -137,25 +140,30 @@ var configUtils_1 = __webpack_require__(53);
  * @param {string} patternString - visualization option type pattern
  * @return {string[]} array of type options
  */
+
+
 var getPatternOptions = function getPatternOptions(patternString) {
   return patternString.replace(/\$/g, '').split('|^').slice(1);
 };
+
 exports.getPatternOptions = getPatternOptions;
 /**
  * Returns Storybook display type for an option
  * @param {object} option - visualization option
  * @return {string} Storybook display type
  */
+
 var getOptionDisplayType = function getOptionDisplayType(option) {
   var oneOf = option.oneOf,
-    anyOf = option.anyOf,
-    type = option.type,
-    en = option.enum,
-    pattern = option.pattern,
-    items = option.items;
-  var displayTypes = [];
-  // wrap values in quotes only if enum or pattern is string
+      anyOf = option.anyOf,
+      type = option.type,
+      en = option.enum,
+      pattern = option.pattern,
+      items = option.items;
+  var displayTypes = []; // wrap values in quotes only if enum or pattern is string
+
   var conditionalQuote = type === 'string' ? '"' : '';
+
   if (en && Array.isArray(en)) {
     displayTypes = en.map(function (e) {
       var enumQuote = typeof e === 'string' ? '"' : '';
@@ -176,11 +184,14 @@ var getOptionDisplayType = function getOptionDisplayType(option) {
       return "".concat(conditionalQuote).concat(p).concat(conditionalQuote);
     });
   }
+
   if (displayTypes.length > 0) {
     return "(".concat(displayTypes.join(' | '), ")");
   }
+
   return type;
 };
+
 exports.getOptionDisplayType = getOptionDisplayType;
 /**
  * Returns Storybook control type for an option
@@ -188,14 +199,16 @@ exports.getOptionDisplayType = getOptionDisplayType;
  * @param {string} optionKey - visualization option key
  * @return {ArgTypeControl} Storybook control object
  */
+
 var getOptionControl = function getOptionControl(option, optionKey) {
   var anyOf = option.anyOf;
   var schema = Array.isArray(anyOf) && anyOf.length ? anyOf[0] : option;
   var type = Array.isArray(schema.type) ? schema.type[0] : schema.type;
   var maximum = schema.maximum,
-    minimum = schema.minimum,
-    en = schema.enum;
+      minimum = schema.minimum,
+      en = schema.enum;
   var isColorOption = new RegExp(/color/, 'i').test(optionKey) && type !== 'array';
+
   if (isColorOption) {
     return {
       type: 'color'
@@ -223,14 +236,17 @@ var getOptionControl = function getOptionControl(option, optionKey) {
       type: 'text'
     };
   }
+
   return {
     type: type
   };
 };
+
 exports.getOptionControl = getOptionControl;
 /**
  * platform specific visualization option argTypes
  */
+
 var objectTableControl = {
   control: {
     type: 'object'
@@ -259,19 +275,21 @@ exports.platformOptionArgTypes = {
  * @param {string} subcategory - nested property parent option name
  * @return {ArgTypes} Storybook argTypes
  */
+
 var optionsSchemaToArgTypes = function optionsSchemaToArgTypes(_ref) {
   var _ref$options = _ref.options,
-    options = _ref$options === void 0 ? {} : _ref$options,
-    _ref$requiredProps = _ref.requiredProps,
-    requiredProps = _ref$requiredProps === void 0 ? [] : _ref$requiredProps,
-    _ref$isPlatformViz = _ref.isPlatformViz,
-    isPlatformViz = _ref$isPlatformViz === void 0 ? false : _ref$isPlatformViz,
-    _ref$subcategory = _ref.subcategory,
-    subcategory = _ref$subcategory === void 0 ? null : _ref$subcategory;
+      options = _ref$options === void 0 ? {} : _ref$options,
+      _ref$requiredProps = _ref.requiredProps,
+      requiredProps = _ref$requiredProps === void 0 ? [] : _ref$requiredProps,
+      _ref$isPlatformViz = _ref.isPlatformViz,
+      isPlatformViz = _ref$isPlatformViz === void 0 ? false : _ref$isPlatformViz,
+      _ref$subcategory = _ref.subcategory,
+      subcategory = _ref$subcategory === void 0 ? null : _ref$subcategory;
   var validObjectTypeOptions = ['lineDashStylesByField', 'seriesColorsByField', 'fieldActions', 'highlightValuesByField'];
   var argTypes = {};
   Object.keys(options).forEach(function (optionKey) {
     var option = (0, lodash_1.get)(options, optionKey);
+
     if (option.type === 'object' && !validObjectTypeOptions.includes(optionKey)) {
       // do not support controls for patternProperties, only nested properties
       if (option.properties) {
@@ -284,16 +302,18 @@ var optionsSchemaToArgTypes = function optionsSchemaToArgTypes(_ref) {
       }
     } else {
       var description = option.description,
-        optionDefault = option.default;
+          optionDefault = option.default;
       var optionControl = (0, exports.getOptionControl)(option, optionKey);
       var control = isPlatformViz ? {
         type: 'text'
       } : optionControl;
       var required = requiredProps.includes(optionKey);
       var defaultValue = optionDefault;
+
       if (!isPlatformViz && (0, configUtils_1.isDynamicOption)(optionDefault)) {
         defaultValue = null;
       }
+
       argTypes[optionKey] = {
         description: description,
         control: control,
@@ -317,11 +337,14 @@ var optionsSchemaToArgTypes = function optionsSchemaToArgTypes(_ref) {
       };
     }
   });
+
   if (isPlatformViz) {
     Object.assign(argTypes, exports.platformOptionArgTypes);
   }
+
   return argTypes;
 };
+
 exports.optionsSchemaToArgTypes = optionsSchemaToArgTypes;
 /**
  * Helper which converts string visualization options to their required type
@@ -329,14 +352,16 @@ exports.optionsSchemaToArgTypes = optionsSchemaToArgTypes;
  * @param {string} expectedType - expected option type
  * @return {any} correctly typed option value
  */
+
 var transformOptionType = function transformOptionType(value) {
   var expectedType = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'string';
   var isStringValue = !(0, configUtils_1.isDynamicOption)(value) && (0, lodash_1.isString)(value);
   if (isStringValue && expectedType === 'boolean') return value == 'true';else if (isStringValue && expectedType === 'number') return (0, lodash_1.toNumber)(value);
   return value;
 };
-exports.transformOptionType = transformOptionType;
-// stringify these fields for storybook controls' support
+
+exports.transformOptionType = transformOptionType; // stringify these fields for storybook controls' support
+
 var FieldsToStringify = ['layers', 'center', 'eventActions', 'fieldActions', 'legendLabels', 'lineDashStylesByField', 'seriesColors', 'seriesColorsByField', 'footerFields', 'highlightValuesByField'];
 /**
  * Helper which returns platform visualization options from Storybook controls
@@ -345,14 +370,15 @@ var FieldsToStringify = ['layers', 'center', 'eventActions', 'fieldActions', 'le
  * @param {ArgTypes} argTypes - visualization argTypes
  * @return {object} visualization options
  */
+
 var getOptionsFromArgTypes = function getOptionsFromArgTypes(args, argTypes) {
   return (0, lodash_1.reduce)(argTypes, function (accum, val, option) {
     var subcategory = (0, lodash_1.get)(val, 'table.subcategory');
     var _argTypes$option = argTypes[option],
-      optionType = _argTypes$option.optionType,
-      defaultValue = _argTypes$option.defaultValue;
-    var controlledOption = (0, exports.transformOptionType)((0, lodash_1.get)(args, option), optionType);
-    // filter options from react & json if set to default value or is undefined
+        optionType = _argTypes$option.optionType,
+        defaultValue = _argTypes$option.defaultValue;
+    var controlledOption = (0, exports.transformOptionType)((0, lodash_1.get)(args, option), optionType); // filter options from react & json if set to default value or is undefined
+
     if (optionType && controlledOption != null && controlledOption !== defaultValue) {
       // parse the value if option is stringified as part of flattenVizOptions
       if (FieldsToStringify.includes(option)) {
@@ -362,29 +388,35 @@ var getOptionsFromArgTypes = function getOptionsFromArgTypes(args, argTypes) {
           controlledOption = null;
         }
       }
+
       if (subcategory) {
         if (!accum[subcategory]) accum[subcategory] = {};
         accum[subcategory][option] = controlledOption;
       } else accum[option] = controlledOption;
     }
+
     return accum;
   }, Object.assign({}, (0, lodash_1.omit)(args.options, Object.keys(argTypes))));
 };
+
 exports.getOptionsFromArgTypes = getOptionsFromArgTypes;
 /**
  * Helper which flattens objects single depth level
  * @param {object} options - visualization options object
  * @return {object} flattened visualization options
  */
+
 var flattenVizOptions = function flattenVizOptions(options) {
   var nonFlattenOptions = new Set(['y2Fields', 'overlayFields', 'gaugeRanges', 'fieldActions', 'highlightValuesByField']);
   return (0, lodash_1.reduce)(options, function (accum, val, option) {
     if (!exports.platformOptionArgTypes[option]) {
       if (_typeof(val) === 'object' && FieldsToStringify.includes(option)) accum[option] = JSON.stringify(val);else if (_typeof(val) === 'object' && !nonFlattenOptions.has(option)) accum = Object.assign(Object.assign({}, accum), val);else accum[option] = val;
     }
+
     return accum;
   }, {});
 };
+
 exports.flattenVizOptions = flattenVizOptions;
 /**
  * Returns value based on Storybook publishing status
@@ -392,20 +424,24 @@ exports.flattenVizOptions = flattenVizOptions;
  * @param {T} localStories - stories to include in local Storybook
  * @return {T} one of the two params
  */
+
 var getStoriesToInclude = function getStoriesToInclude(publishedStories, localStories) {
   return Object({"NODE_ENV":"production"}).STORYBOOK_PUBLISH ? publishedStories : localStories;
 };
+
 exports.getStoriesToInclude = getStoriesToInclude;
 /**
  * Returns component level stories to include, defaults to innclude all stories
  * @param {StoriesList} stories - stories to include in published Storybook
  * @return {object} CSF includeStories config
  */
+
 var componentStoriesToInclude = function componentStoriesToInclude(stories) {
   return (0, exports.getStoriesToInclude)({
     includeStories: stories
   }, {});
 };
+
 exports.componentStoriesToInclude = componentStoriesToInclude;
 
 /***/ }),
@@ -485,25 +521,38 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
+
   if (Object.getOwnPropertySymbols) {
     var symbols = Object.getOwnPropertySymbols(object);
-    enumerableOnly && (symbols = symbols.filter(function (sym) {
+    if (enumerableOnly) symbols = symbols.filter(function (sym) {
       return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-    })), keys.push.apply(keys, symbols);
+    });
+    keys.push.apply(keys, symbols);
   }
+
   return keys;
 }
+
 function _objectSpread(target) {
   for (var i = 1; i < arguments.length; i++) {
-    var source = null != arguments[i] ? arguments[i] : {};
-    i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
-      _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_1___default()(target, key, source[key]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
-      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-    });
+    var source = arguments[i] != null ? arguments[i] : {};
+
+    if (i % 2) {
+      ownKeys(Object(source), true).forEach(function (key) {
+        _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_1___default()(target, key, source[key]);
+      });
+    } else if (Object.getOwnPropertyDescriptors) {
+      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+      ownKeys(Object(source)).forEach(function (key) {
+        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+      });
+    }
   }
+
   return target;
 }
 
@@ -515,6 +564,7 @@ function _objectSpread(target) {
 
 
 
+
 var Option = styled_components__WEBPACK_IMPORTED_MODULE_9___default.a.div.withConfig({
   displayName: "OptionsDoc__Option",
   componentId: "sc-1eidk15-0"
@@ -557,16 +607,15 @@ var PropertiesContent = styled_components__WEBPACK_IMPORTED_MODULE_9___default.a
 })(["margin-left:", "px;"], function (props) {
   return props.isPatternProperty ? 40 : 0;
 });
-
 /**
  * @method isOneOfJsonSchema
  * @param {object} item
  * @returns {boolean}
  */
+
 var isOneOfJsonSchema = function isOneOfJsonSchema(item) {
   return item.oneOf && Array.isArray(item.oneOf);
 };
-
 /**
  * get Or type as string
  * @method getOrType
@@ -574,29 +623,34 @@ var isOneOfJsonSchema = function isOneOfJsonSchema(item) {
  * @param {string} res
  * @returns {string} res  eg: (string | number)
  */
+
+
 var getOrType = function getOrType(item) {
   var res = '';
+
   if (isOneOfJsonSchema(item)) {
     res = item.oneOf.map(function (one) {
       if (one.type !== 'array') {
         return one.type;
-      }
-      // eslint-disable-next-line no-use-before-define
+      } // eslint-disable-next-line no-use-before-define
+
+
       return getArrayType(one, '');
     }).join(' | ');
   } else if (Array.isArray(item.type)) {
     if (lodash_isEmpty__WEBPACK_IMPORTED_MODULE_5___default()(item.default)) {
       return item.type.join(' | ');
     }
+
     res = item.type.filter(function (itemType) {
       return itemType !== 'string';
     }).join(' | ');
     res += ' | ';
     res += "\"".concat(item.default, "\"");
   }
+
   return res;
 };
-
 /**
  * get the array type as string
  * @method getArrayType
@@ -604,103 +658,124 @@ var getOrType = function getOrType(item) {
  * @param {string} res
  * @returns {string} res  eg: arrayOf(arrayOf(string | number | arrayOf(string | number)))
  */
+
+
 var getArrayType = function getArrayType(item) {
   var res = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+
   if (item.type !== 'array') {
     if (Array.isArray(item.type) || isOneOfJsonSchema(item)) {
       return getOrType(item);
     }
+
     return item.type;
   }
+
   if (item.type === 'array') {
     res += 'arrayOf('; // eslint-disable-line no-param-reassign
   }
 
   res += getArrayType(item.items, ''); // eslint-disable-line no-param-reassign
+
   res += ')'; // eslint-disable-line no-param-reassign
+
   return res;
 };
-
 /**
  * get the type of this option item
  * @method getType
  * @param {ojbect} item option item
  * @returns {string} type
  */
+
+
 var getType = function getType(item) {
   if (isOneOfJsonSchema(item)) {
     return "oneOf(".concat(getOrType(item), ")");
   }
+
   if (item.enum && Array.isArray(item.enum)) {
     var values = !lodash_isEmpty__WEBPACK_IMPORTED_MODULE_5___default()(item.enum) && typeof item.enum[0] === 'string' ? item.enum.map(function (v) {
       return "\"".concat(v, "\"");
     }).join(', ') : item.enum.join(', ');
     return "oneOf([".concat(values, "])");
   }
+
   if (Array.isArray(item.type)) {
     return getOrType(item);
   }
+
   if (item.type === 'array') {
     if ('items' in item) {
       return "arrayOf(".concat(getType(item.items), ")");
     }
+
     return 'array';
   }
+
   return item.type;
 };
-
 /**
  * get the default value as string
  * @method getDefaultValue
  * @param {object | boolean | number | string} defaultValue
  * @returns {string | object[]} default value
  */
+
 var getDefaultValue = function getDefaultValue(defaultValue) {
   if (typeof defaultValue === 'boolean' || typeof defaultValue === 'number') {
     return defaultValue.toString();
   }
+
   if (Array.isArray(defaultValue)) {
     if (defaultValue.length > 1 && _babel_runtime_helpers_typeof__WEBPACK_IMPORTED_MODULE_2___default()(defaultValue[0]) === 'object') {
       // return the array only if the defaultValue is an object array
       return defaultValue;
     }
+
     var values = defaultValue.map(function (v) {
       return JSON.stringify(v);
     }).join(', ');
     return "[".concat(values, "]");
   }
+
   return defaultValue;
 };
+
 var Pair = function Pair(_ref) {
   var title = _ref.title,
-    content = _ref.content;
+      content = _ref.content;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(PairContainer, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(PairTitle, null, "".concat(title, ":")), Array.isArray(content) ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(PairValueJSON, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement("pre", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement("code", null, JSON.stringify(content, null, 2)))) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(PairValue, null, content));
 };
+
 Pair.propTypes = {
   title: prop_types__WEBPACK_IMPORTED_MODULE_4___default.a.string,
   content: prop_types__WEBPACK_IMPORTED_MODULE_4___default.a.oneOfType([prop_types__WEBPACK_IMPORTED_MODULE_4___default.a.string, prop_types__WEBPACK_IMPORTED_MODULE_4___default.a.arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_4___default.a.object)])
 };
+
 var PropertyItems = function PropertyItems(_ref2) {
   var _ref2$isPatternProper = _ref2.isPatternProperty,
-    isPatternProperty = _ref2$isPatternProper === void 0 ? false : _ref2$isPatternProper,
-    propsItems = _ref2.propsItems;
+      isPatternProperty = _ref2$isPatternProper === void 0 ? false : _ref2$isPatternProper,
+      propsItems = _ref2.propsItems;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(PropertiesContainer, {
     isPatternProperty: isPatternProperty
   }, isPatternProperty ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(PairTitle, null, Object(_splunk_ui_utils_i18n__WEBPACK_IMPORTED_MODULE_6__["_"])('[fieldName]:')) : null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(PropertiesContent, {
     isPatternProperty: isPatternProperty
   }, propsItems));
 };
+
 PropertyItems.propTypes = {
   isPatternProperty: prop_types__WEBPACK_IMPORTED_MODULE_4___default.a.bool,
   propsItems: prop_types__WEBPACK_IMPORTED_MODULE_4___default.a.array
 };
+
 var OptionItem = function OptionItem(_ref3) {
   var name = _ref3.name,
-    type = _ref3.type,
-    desc = _ref3.desc,
-    defaultValue = _ref3.defaultValue,
-    enumerable = _ref3.enumerable,
-    PropertiesSection = _ref3.PropertiesSection;
+      type = _ref3.type,
+      desc = _ref3.desc,
+      defaultValue = _ref3.defaultValue,
+      enumerable = _ref3.enumerable,
+      PropertiesSection = _ref3.PropertiesSection;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(Option, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(OptionName, null, name), desc ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(_splunk_react_ui_Markdown__WEBPACK_IMPORTED_MODULE_8___default.a, {
     style: {
       marginLeft: 40
@@ -719,6 +794,7 @@ var OptionItem = function OptionItem(_ref3) {
     content: defaultValue
   }), PropertiesSection);
 };
+
 OptionItem.propTypes = {
   name: prop_types__WEBPACK_IMPORTED_MODULE_4___default.a.string,
   type: prop_types__WEBPACK_IMPORTED_MODULE_4___default.a.string,
@@ -730,28 +806,31 @@ OptionItem.propTypes = {
 OptionItem.default = {
   PropertiesItem: null
 };
+
 var getPropertiesSection = function getPropertiesSection(properties, patternProperties) {
   var allProperties = [];
-  var isPatternProperty = false;
-
-  // the properties either comes from property field of the option schema item
+  var isPatternProperty = false; // the properties either comes from property field of the option schema item
   // or from the property field of each patternProperties of the option schema item
   // can check table tableFormat and columnFormat as examples
+
   if (!lodash_isEmpty__WEBPACK_IMPORTED_MODULE_5___default()(properties)) {
     allProperties = [properties];
   } else if (!lodash_isEmpty__WEBPACK_IMPORTED_MODULE_5___default()(patternProperties)) {
     Object.keys(patternProperties).forEach(function (patternKey) {
       var propsInPattern = patternProperties[patternKey].properties;
+
       if (propsInPattern) {
         allProperties.push(propsInPattern);
       }
     });
     isPatternProperty = true;
   }
+
   if (allProperties.length) {
     var allPropsItems = allProperties.map(function (props) {
       var propsItems = Object.keys(props).map(function (pKey) {
         var _p$anyOf, _p$anyOf2, _p$anyOf3, _p$anyOf3$, _p$anyOf4, _p$anyOf4$, _p$anyOf4$$items, _p$anyOf4$$items$enum, _p$anyOf5, _p$anyOf5$, _p$anyOf5$$items, _p$anyOf5$$items$item, _p$anyOf5$$items$item2, _pEnumerable;
+
         var p = props[pKey];
         var pType = (_p$anyOf = p.anyOf) !== null && _p$anyOf !== void 0 && _p$anyOf[0] ? Object(_storybook_utils_storybookUtils__WEBPACK_IMPORTED_MODULE_11__["getOptionDisplayType"])(_objectSpread(_objectSpread({}, (_p$anyOf2 = p.anyOf) === null || _p$anyOf2 === void 0 ? void 0 : _p$anyOf2[0]), {}, {
           enum: p.enum
@@ -759,8 +838,8 @@ var getPropertiesSection = function getPropertiesSection(properties, patternProp
           enum: p.enum
         }));
         var pDefault = getDefaultValue(p.default);
-        var pEnumerable;
-        // get nested oneOf property listing
+        var pEnumerable; // get nested oneOf property listing
+
         if (typeof ((_p$anyOf3 = p.anyOf) === null || _p$anyOf3 === void 0 ? void 0 : (_p$anyOf3$ = _p$anyOf3[0]) === null || _p$anyOf3$ === void 0 ? void 0 : _p$anyOf3$.pattern) === 'string') {
           pEnumerable = Object(_storybook_utils_storybookUtils__WEBPACK_IMPORTED_MODULE_11__["getPatternOptions"])(p.anyOf[0].pattern);
         } else if (((_p$anyOf4 = p.anyOf) === null || _p$anyOf4 === void 0 ? void 0 : (_p$anyOf4$ = _p$anyOf4[0]) === null || _p$anyOf4$ === void 0 ? void 0 : (_p$anyOf4$$items = _p$anyOf4$.items) === null || _p$anyOf4$$items === void 0 ? void 0 : (_p$anyOf4$$items$enum = _p$anyOf4$$items.enum) === null || _p$anyOf4$$items$enum === void 0 ? void 0 : _p$anyOf4$$items$enum.length) > 0) {
@@ -773,16 +852,19 @@ var getPropertiesSection = function getPropertiesSection(properties, patternProp
           pEnumerable = p.anyOf[0].items.items.enum;
         } else if (p.enum) {
           pEnumerable = p.enum;
-        }
+        } // use the JS types (e.g. string, number) of the nested property if the nested property is an enumerable
+
 
-        // use the JS types (e.g. string, number) of the nested property if the nested property is an enumerable
         if ((_pEnumerable = pEnumerable) !== null && _pEnumerable !== void 0 && _pEnumerable.length) {
           var _p$anyOf6, _p$anyOf6$, _p$anyOf7, _p$anyOf7$;
+
           pType = ((_p$anyOf6 = p.anyOf) === null || _p$anyOf6 === void 0 ? void 0 : (_p$anyOf6$ = _p$anyOf6[0]) === null || _p$anyOf6$ === void 0 ? void 0 : _p$anyOf6$.type) !== 'array' ? (_p$anyOf7 = p.anyOf) === null || _p$anyOf7 === void 0 ? void 0 : (_p$anyOf7$ = _p$anyOf7[0]) === null || _p$anyOf7$ === void 0 ? void 0 : _p$anyOf7$.type : pType;
+
           if (Array.isArray(pType)) {
             pType = pType.join(' | ');
           }
         }
+
         return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(OptionItem, {
           key: pKey,
           name: pKey,
@@ -802,39 +884,45 @@ var getPropertiesSection = function getPropertiesSection(properties, patternProp
       isPatternProperty: isPatternProperty
     }, allPropsItems);
   }
+
   return null;
 };
+
 var OptionsDoc = function OptionsDoc(_ref4) {
   var options = _ref4.options,
-    description = _ref4.description;
+      description = _ref4.description;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement("div", null, options.length === 0 ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(_splunk_react_ui_Heading__WEBPACK_IMPORTED_MODULE_7___default.a, {
     level: 4
   }, " No Options") : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(_splunk_react_ui_Heading__WEBPACK_IMPORTED_MODULE_7___default.a, {
     level: 4
   }, "Options"), description && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement("div", null, description), Object.entries(options).map(function (_ref5) {
     var _item$anyOf, _item$anyOf$, _item$anyOf2, _item$anyOf2$, _item$anyOf4, _item$anyOf4$, _item$anyOf5, _item$anyOf5$, _enumerable;
+
     var _ref6 = _babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_0___default()(_ref5, 2),
-      key = _ref6[0],
-      item = _ref6[1];
+        key = _ref6[0],
+        item = _ref6[1];
+
     var type;
     var enumerable = [];
-    var PropertiesSection = null;
+    var PropertiesSection = null; // get oneOf property listing
 
-    // get oneOf property listing
     if (typeof ((_item$anyOf = item.anyOf) === null || _item$anyOf === void 0 ? void 0 : (_item$anyOf$ = _item$anyOf[0]) === null || _item$anyOf$ === void 0 ? void 0 : _item$anyOf$.pattern) === 'string') {
       enumerable = Object(_storybook_utils_storybookUtils__WEBPACK_IMPORTED_MODULE_11__["getPatternOptions"])(item.anyOf[0].pattern);
     } else if ((_item$anyOf2 = item.anyOf) !== null && _item$anyOf2 !== void 0 && (_item$anyOf2$ = _item$anyOf2[0]) !== null && _item$anyOf2$ !== void 0 && _item$anyOf2$.enum) {
       var _item$anyOf3, _item$anyOf3$;
+
       enumerable = (_item$anyOf3 = item.anyOf) === null || _item$anyOf3 === void 0 ? void 0 : (_item$anyOf3$ = _item$anyOf3[0]) === null || _item$anyOf3$ === void 0 ? void 0 : _item$anyOf3$.enum;
     } else if (item.enum) {
       enumerable = item.enum;
-    }
+    } // get the nested options inside {option}.items.anyof. e.g. 'layers' in Map
+
 
-    // get the nested options inside {option}.items.anyof. e.g. 'layers' in Map
     if (((_item$anyOf4 = item.anyOf) === null || _item$anyOf4 === void 0 ? void 0 : (_item$anyOf4$ = _item$anyOf4[0]) === null || _item$anyOf4$ === void 0 ? void 0 : _item$anyOf4$.type) === 'array' && 'anyOf' in ((_item$anyOf5 = item.anyOf) === null || _item$anyOf5 === void 0 ? void 0 : (_item$anyOf5$ = _item$anyOf5[0]) === null || _item$anyOf5$ === void 0 ? void 0 : _item$anyOf5$.items)) {
       var _item$anyOf6, _item$anyOf6$, _item$anyOf6$$items;
+
       type = Object(_storybook_utils_storybookUtils__WEBPACK_IMPORTED_MODULE_11__["getOptionDisplayType"])(item);
       var patternProperties = item.patternProperties; // merge the 3 objects together instead of showing the longest options in the array
+
       var option = (_item$anyOf6 = item.anyOf) === null || _item$anyOf6 === void 0 ? void 0 : (_item$anyOf6$ = _item$anyOf6[0]) === null || _item$anyOf6$ === void 0 ? void 0 : (_item$anyOf6$$items = _item$anyOf6$.items) === null || _item$anyOf6$$items === void 0 ? void 0 : _item$anyOf6$$items.anyOf;
       var mergedOptions = option.reduce(function (prev, next) {
         return Object(lodash__WEBPACK_IMPORTED_MODULE_10__["merge"])(prev, next);
@@ -850,6 +938,7 @@ var OptionsDoc = function OptionsDoc(_ref4) {
         PropertiesSection: PropertiesSection
       });
     }
+
     if (item.type === 'object') {
       // get properties for object type
       type = item.type;
@@ -857,9 +946,11 @@ var OptionsDoc = function OptionsDoc(_ref4) {
       var _patternProperties = item.patternProperties;
       PropertiesSection = getPropertiesSection(_properties, _patternProperties);
     } else if ((_enumerable = enumerable) !== null && _enumerable !== void 0 && _enumerable.length) {
-      var _item$anyOf7, _item$anyOf7$;
-      // use the JS types (e.g. string, number) of the property if the property is an enumerable
+      var _item$anyOf7, _item$anyOf7$; // use the JS types (e.g. string, number) of the property if the property is an enumerable
+
+
       type = (_item$anyOf7 = item.anyOf) === null || _item$anyOf7 === void 0 ? void 0 : (_item$anyOf7$ = _item$anyOf7[0]) === null || _item$anyOf7$ === void 0 ? void 0 : _item$anyOf7$.type;
+
       if (Array.isArray(type)) {
         type = type.join(' | ');
       }
@@ -868,12 +959,11 @@ var OptionsDoc = function OptionsDoc(_ref4) {
         enum: item.enum
       }));
     }
+
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_3___default.a.createElement(OptionItem, {
       key: key,
-      name: key
-      // item.anyOf in the config.ts is a tuple which holds [{ type, pattern, items }, { type, pattern: DYNAMIC_OPTIONS_PATTERN }]
+      name: key // item.anyOf in the config.ts is a tuple which holds [{ type, pattern, items }, { type, pattern: DYNAMIC_OPTIONS_PATTERN }]
       ,
-
       type: type,
       enumerable: enumerable,
       desc: item.description,
@@ -882,6 +972,7 @@ var OptionsDoc = function OptionsDoc(_ref4) {
     });
   }));
 };
+
 OptionsDoc.propTypes = {
   options: prop_types__WEBPACK_IMPORTED_MODULE_4___default.a.object.isRequired,
   description: prop_types__WEBPACK_IMPORTED_MODULE_4___default.a.string