@elastic/eui 92.2.1 → 93.1.0

package/lib/components/date_picker/super_date_picker/pretty_duration.js

@@ -148,9 +148,15 @@ var useRelativeDurationRoundedI18n = function useRelativeDurationRoundedI18n(pre
  */
 
 var ISO_FORMAT = 'YYYY-MM-DDTHH:mm:ss.SSSZ';
-var useFormatTimeString = function useFormatTimeString(timeString, dateFormat) {
-  var roundUp = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
-  var locale = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'en';
+var useFormatTimeString = function useFormatTimeString(timeString, dateFormat, options) {
+  var _ref15 = options || {},
+    _ref15$locale = _ref15.locale,
+    locale = _ref15$locale === void 0 ? 'en' : _ref15$locale,
+    _ref15$roundUp = _ref15.roundUp,
+    roundUp = _ref15$roundUp === void 0 ? false : _ref15$roundUp,
+    _ref15$canRoundRelati = _ref15.canRoundRelativeUnits,
+    canRoundRelativeUnits = _ref15$canRoundRelati === void 0 ? true : _ref15$canRoundRelati;
+
   // i18n'd strings
   var nowDisplay = (0, _i18n.useEuiI18n)('euiPrettyDuration.now', 'now');
   var invalidDateDisplay = (0, _i18n.useEuiI18n)('euiPrettyDuration.invalid', 'Invalid date');
@@ -168,8 +174,27 @@ var useFormatTimeString = function useFormatTimeString(timeString, dateFormat) {
     return invalidDateDisplay;
   }
   if (_moment.default.isMoment(tryParse)) {
-    return "~ ".concat(tryParse.locale(locale).fromNow());
+    if (canRoundRelativeUnits) {
+      return "~ ".concat(tryParse.locale(locale).fromNow());
+    } else {
+      // To force a specific unit to be used, we need to skip moment.fromNow()
+      // entirely and write our own custom moment formatted output.
+      var _parseRelativeParts = (0, _relative_utils.parseRelativeParts)(timeString),
+        count = _parseRelativeParts.count,
+        _unit = _parseRelativeParts.unit;
+      var isFuture = _unit.endsWith('+');
+      var unit = isFuture ? _unit.slice(0, -1) : _unit; // We want just the unit letter without the trailing +
+
+      // @see https://momentjs.com/docs/#/customization/relative-time/
+      var relativeUnitKey = count === 1 ? unit : unit + unit;
+
+      // @see https://momentjs.com/docs/#/i18n/locale-data/
+      return _moment.default.localeData().pastFuture(isFuture ? count : count * -1, _moment.default.localeData().relativeTime(count, false, relativeUnitKey, false)
+      // Booleans don't seem to actually matter for output, .pastFuture() handles that
+      );
+    }
   }
+
   return timeString;
 };
 
@@ -177,11 +202,11 @@ var useFormatTimeString = function useFormatTimeString(timeString, dateFormat) {
  * Pretty duration hook+component
  */
 exports.useFormatTimeString = useFormatTimeString;
-var usePrettyDuration = function usePrettyDuration(_ref15) {
-  var timeFrom = _ref15.timeFrom,
-    timeTo = _ref15.timeTo,
-    quickRanges = _ref15.quickRanges,
-    dateFormat = _ref15.dateFormat;
+var usePrettyDuration = function usePrettyDuration(_ref16) {
+  var timeFrom = _ref16.timeFrom,
+    timeTo = _ref16.timeTo,
+    quickRanges = _ref16.quickRanges,
+    dateFormat = _ref16.dateFormat;
   var prettyDuration = '';
 
   /**
@@ -220,7 +245,9 @@ var usePrettyDuration = function usePrettyDuration(_ref15) {
    * If it's none of the above, display basic fallback copy
    */
   var displayFrom = useFormatTimeString(timeFrom, dateFormat);
-  var displayTo = useFormatTimeString(timeTo, dateFormat, true);
+  var displayTo = useFormatTimeString(timeTo, dateFormat, {
+    roundUp: true
+  });
   var fallbackDuration = (0, _i18n.useEuiI18n)('euiPrettyDuration.fallbackDuration', '{displayFrom} to {displayTo}', {
     displayFrom: displayFrom,
     displayTo: displayTo
@@ -231,11 +258,11 @@ var usePrettyDuration = function usePrettyDuration(_ref15) {
   return prettyDuration;
 };
 exports.usePrettyDuration = usePrettyDuration;
-var PrettyDuration = function PrettyDuration(_ref16) {
-  var timeFrom = _ref16.timeFrom,
-    timeTo = _ref16.timeTo,
-    quickRanges = _ref16.quickRanges,
-    dateFormat = _ref16.dateFormat;
+var PrettyDuration = function PrettyDuration(_ref17) {
+  var timeFrom = _ref17.timeFrom,
+    timeTo = _ref17.timeTo,
+    quickRanges = _ref17.quickRanges,
+    dateFormat = _ref17.dateFormat;
   var prettyDuration = usePrettyDuration({
     timeFrom: timeFrom,
     timeTo: timeTo,
@@ -250,9 +277,9 @@ var PrettyDuration = function PrettyDuration(_ref16) {
  */
 exports.PrettyDuration = PrettyDuration;
 var hasRangeMatch = function hasRangeMatch(timeFrom, timeTo, ranges) {
-  return ranges.find(function (_ref17) {
-    var start = _ref17.start,
-      end = _ref17.end;
+  return ranges.find(function (_ref18) {
+    var start = _ref18.start,
+      end = _ref18.end;
     return timeFrom === start && timeTo === end;
   });
 };

package/lib/components/date_picker/super_date_picker/pretty_interval.js

@@ -13,10 +13,18 @@ var _i18n = require("../../i18n");
  * Side Public License, v 1.
  */
 
-var MS_IN_SECOND = 1000;
-var MS_IN_MINUTE = 60 * MS_IN_SECOND;
-var MS_IN_HOUR = 60 * MS_IN_MINUTE;
-var MS_IN_DAY = 24 * MS_IN_HOUR;
+var MS_INTERVALS = {
+  s: 1000,
+  get m() {
+    return 60 * this.s;
+  },
+  get h() {
+    return 60 * this.m;
+  },
+  get d() {
+    return 24 * this.h;
+  }
+};
 /**
  * Pretty interval i18n strings
  *
@@ -65,23 +73,31 @@ var usePrettyIntervalI18n = function usePrettyIntervalI18n(interval) {
     }
   };
 };
-var usePrettyInterval = function usePrettyInterval(isPaused, intervalInMs) {
-  var shortHand = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+var usePrettyInterval = function usePrettyInterval(isPaused, intervalInMs, options) {
+  var _ref5 = options || {},
+    _ref5$shortHand = _ref5.shortHand,
+    shortHand = _ref5$shortHand === void 0 ? false : _ref5$shortHand,
+    unit = _ref5.unit;
   var prettyInterval = '';
   var interval;
   var unitId;
-  if (intervalInMs < MS_IN_MINUTE) {
-    interval = Math.round(intervalInMs / MS_IN_SECOND);
-    unitId = 's';
-  } else if (intervalInMs < MS_IN_HOUR) {
-    interval = Math.round(intervalInMs / MS_IN_MINUTE);
-    unitId = 'm';
-  } else if (intervalInMs < MS_IN_DAY) {
-    interval = Math.round(intervalInMs / MS_IN_HOUR);
-    unitId = 'h';
+  if (unit) {
+    unitId = unit;
+    interval = Math.round(intervalInMs / MS_INTERVALS[unit]);
   } else {
-    interval = Math.round(intervalInMs / MS_IN_DAY);
-    unitId = 'd';
+    if (intervalInMs < MS_INTERVALS.m) {
+      interval = Math.round(intervalInMs / MS_INTERVALS.s);
+      unitId = 's';
+    } else if (intervalInMs < MS_INTERVALS.h) {
+      interval = Math.round(intervalInMs / MS_INTERVALS.m);
+      unitId = 'm';
+    } else if (intervalInMs < MS_INTERVALS.d) {
+      interval = Math.round(intervalInMs / MS_INTERVALS.h);
+      unitId = 'h';
+    } else {
+      interval = Math.round(intervalInMs / MS_INTERVALS.d);
+      unitId = 'd';
+    }
   }
   var prettyIntervalI18n = usePrettyIntervalI18n(interval);
   prettyInterval = shortHand ? prettyIntervalI18n.shorthand[unitId] : prettyIntervalI18n[unitId];

package/lib/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover.js

@@ -125,6 +125,7 @@ EuiQuickSelectPopover.propTypes = {
     start: _propTypes.default.oneOfType([_propTypes.default.oneOf(["now"]), _propTypes.default.string.isRequired]).isRequired
   }).isRequired).isRequired,
   refreshInterval: _propTypes.default.number.isRequired,
+  intervalUnits: _propTypes.default.oneOf(["s", "m", "h"]),
   start: _propTypes.default.string.isRequired,
   timeOptions: _propTypes.default.shape({
     timeTenseOptions: _propTypes.default.arrayOf(_propTypes.default.any.isRequired).isRequired,
@@ -153,6 +154,7 @@ var EuiQuickSelectPanels = function EuiQuickSelectPanels(_ref3) {
     customQuickSelectRender = _ref3.customQuickSelectRender,
     isPaused = _ref3.isPaused,
     refreshInterval = _ref3.refreshInterval,
+    intervalUnits = _ref3.intervalUnits,
     applyRefreshInterval = _ref3.applyRefreshInterval,
     applyTime = _ref3.applyTime,
     prevQuickSelect = _ref3.prevQuickSelect;
@@ -176,7 +178,8 @@ var EuiQuickSelectPanels = function EuiQuickSelectPanels(_ref3) {
   var refreshIntervalElement = applyRefreshInterval && (0, _react2.jsx)(_refresh_interval.EuiRefreshInterval, {
     onRefreshChange: applyRefreshInterval,
     isPaused: isPaused,
-    refreshInterval: refreshInterval
+    refreshInterval: refreshInterval,
+    intervalUnits: intervalUnits
   });
   var customQuickSelectPanelsElement = (0, _react.useMemo)(function () {
     if (!customQuickSelectPanels) {

package/lib/components/date_picker/super_date_picker/super_date_picker.js

@@ -178,6 +178,7 @@ var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
     });
     _defineProperty(_assertThisInitialized(_this), "onRefreshChange", function (_ref3) {
       var refreshInterval = _ref3.refreshInterval,
+        intervalUnits = _ref3.intervalUnits,
         isPaused = _ref3.isPaused;
       _this.stopInterval();
       if (!isPaused) {
@@ -186,7 +187,8 @@ var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
       if (_this.props.onRefreshChange) {
         _this.props.onRefreshChange({
           refreshInterval: refreshInterval,
-          isPaused: isPaused
+          isPaused: isPaused,
+          intervalUnits: intervalUnits
         });
       }
     });
@@ -223,6 +225,7 @@ var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
         onRefreshChange = _this$props2.onRefreshChange,
         recentlyUsedRanges = _this$props2.recentlyUsedRanges,
         refreshInterval = _this$props2.refreshInterval,
+        refreshIntervalUnits = _this$props2.refreshIntervalUnits,
         isPaused = _this$props2.isPaused,
         isDisabled = _this$props2.isDisabled;
       return (0, _react2.jsx)(_quick_select_popover.EuiQuickSelectPopover, {
@@ -237,6 +240,7 @@ var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
         isPaused: isPaused,
         recentlyUsedRanges: recentlyUsedRanges,
         refreshInterval: refreshInterval,
+        intervalUnits: refreshIntervalUnits,
         start: start,
         timeOptions: timeOptions
       });
@@ -254,9 +258,12 @@ var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
         isQuickSelectOnly = _this$props3.isQuickSelectOnly,
         showUpdateButton = _this$props3.showUpdateButton,
         commonlyUsedRanges = _this$props3.commonlyUsedRanges,
+        canRoundRelativeUnits = _this$props3.canRoundRelativeUnits,
         timeOptions = _this$props3.timeOptions,
         dateFormat = _this$props3.dateFormat,
         refreshInterval = _this$props3.refreshInterval,
+        refreshMinInterval = _this$props3.refreshMinInterval,
+        refreshIntervalUnits = _this$props3.refreshIntervalUnits,
         isPaused = _this$props3.isPaused,
         isDisabled = _this$props3.isDisabled,
         isLoading = _this$props3.isLoading,
@@ -267,6 +274,8 @@ var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
         onFocus = _this$props3.onFocus;
       var autoRefreshAppend = !isPaused ? (0, _react2.jsx)(_auto_refresh.EuiAutoRefreshButton, {
         refreshInterval: refreshInterval,
+        minInterval: refreshMinInterval,
+        intervalUnits: refreshIntervalUnits,
         isDisabled: !!isDisabled,
         isPaused: isPaused,
         onRefreshChange: _this.onRefreshChange,
@@ -288,6 +297,7 @@ var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
       var isDisabledDisplay = (0, _predicate.isObject)(isDisabled) && (isDisabled === null || isDisabled === void 0 ? void 0 : isDisabled.display);
       if (isDisabledDisplay || showPrettyDuration && !isStartDatePopoverOpen && !isEndDatePopoverOpen) {
         return (0, _react2.jsx)(_form.EuiFormControlLayout, formControlLayoutProps, (0, _react2.jsx)("button", {
+          type: "button",
           className: (0, _classnames.default)('euiSuperDatePicker__prettyFormat', {
             'euiSuperDatePicker__prettyFormat--disabled': isDisabled
           }),
@@ -320,6 +330,7 @@ var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
             utcOffset: utcOffset,
             timeFormat: timeFormat,
             locale: locale || contextLocale,
+            canRoundRelativeUnits: canRoundRelativeUnits,
             isOpen: _this.state.isStartDatePopoverOpen,
             onPopoverToggle: _this.onStartDatePopoverToggle,
             onPopoverClose: _this.onStartDatePopoverClose,
@@ -340,6 +351,7 @@ var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
             utcOffset: utcOffset,
             timeFormat: timeFormat,
             locale: locale || contextLocale,
+            canRoundRelativeUnits: canRoundRelativeUnits,
             roundUp: true,
             isOpen: _this.state.isEndDatePopoverOpen,
             onPopoverToggle: _this.onEndDatePopoverToggle,
@@ -397,6 +409,8 @@ var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
         isPaused = _this$props6.isPaused,
         onRefreshChange = _this$props6.onRefreshChange,
         refreshInterval = _this$props6.refreshInterval,
+        refreshMinInterval = _this$props6.refreshMinInterval,
+        refreshIntervalUnits = _this$props6.refreshIntervalUnits,
         showUpdateButton = _this$props6.showUpdateButton,
         dataTestSubj = _this$props6['data-test-subj'],
         _width = _this$props6.width,
@@ -423,7 +437,9 @@ var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
       }, isAutoRefreshOnly && onRefreshChange ? (0, _react2.jsx)(_auto_refresh.EuiAutoRefresh, {
         isPaused: isPaused,
         refreshInterval: refreshInterval,
-        onRefreshChange: onRefreshChange,
+        minInterval: refreshMinInterval,
+        intervalUnits: refreshIntervalUnits,
+        onRefreshChange: this.onRefreshChange,
         fullWidth: width === 'full',
         compressed: compressed,
         isDisabled: !!isDisabled,
@@ -464,6 +480,7 @@ _defineProperty(EuiSuperDatePickerInternal, "defaultProps", {
   recentlyUsedRanges: [],
   refreshInterval: 1000,
   showUpdateButton: true,
+  canRoundRelativeUnits: true,
   start: 'now-15m',
   timeFormat: 'HH:mm',
   width: 'restricted'
@@ -561,11 +578,16 @@ EuiSuperDatePickerInternal.propTypes = {
     label: _propTypes.default.string,
     start: _propTypes.default.oneOfType([_propTypes.default.oneOf(["now"]), _propTypes.default.string.isRequired]).isRequired
   }).isRequired).isRequired]),
+  refreshInterval: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.number.isRequired]),
+  refreshMinInterval: _propTypes.default.number,
   /**
-     * Refresh interval in milliseconds
-     * @default 1000
+     * By default, refresh interval units will be rounded up to next largest unit of time
+     * (for example, 90 seconds will become 2m).
+     *
+     * If you do not want this behavior, you will need to store the user-set `intervalUnits`
+     * (passed by `onRefreshChange`) and manually control it via this prop.
      */
-  refreshInterval: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.number.isRequired]),
+  refreshIntervalUnits: _propTypes.default.oneOf(["s", "m", "h"]),
   start: _propTypes.default.oneOfType([_propTypes.default.oneOfType([_propTypes.default.oneOf(["now"]), _propTypes.default.string.isRequired]), _propTypes.default.oneOfType([_propTypes.default.oneOf(["now"]), _propTypes.default.string.isRequired]).isRequired]),
   end: _propTypes.default.oneOfType([_propTypes.default.oneOfType([_propTypes.default.oneOf(["now"]), _propTypes.default.string.isRequired]), _propTypes.default.oneOfType([_propTypes.default.oneOf(["now"]), _propTypes.default.string.isRequired]).isRequired]),
   /**
@@ -666,6 +688,14 @@ EuiSuperDatePickerInternal.propTypes = {
        */
     responsive: _propTypes.default.oneOfType([_propTypes.default.oneOf([false]), _propTypes.default.arrayOf(_propTypes.default.any.isRequired).isRequired])
   }),
+  /**
+     * By default, relative units will be rounded up to next largest unit of time
+     * (for example, 90 minutes will become ~ 2 hours).
+     *
+     * If you do not want this behavior and instead wish to keep the exact units
+     * input by the user, set this flag to `false`.
+     */
+  canRoundRelativeUnits: _propTypes.default.bool,
   timeOptions: _propTypes.default.shape({
     timeTenseOptions: _propTypes.default.arrayOf(_propTypes.default.any.isRequired).isRequired,
     timeUnitsOptions: _propTypes.default.arrayOf(_propTypes.default.any.isRequired).isRequired,
@@ -776,10 +806,19 @@ EuiSuperDatePicker.propTypes = {
     start: _propTypes.default.oneOfType([_propTypes.default.oneOf(["now"]), _propTypes.default.string.isRequired]).isRequired
   }).isRequired),
   /**
-     * Refresh interval in milliseconds
-     * @default 1000
+     * Minimum refresh interval in milliseconds
+     * @default 0
      */
   refreshInterval: _propTypes.default.number,
+  refreshMinInterval: _propTypes.default.number,
+  /**
+     * By default, refresh interval units will be rounded up to next largest unit of time
+     * (for example, 90 seconds will become 2m).
+     *
+     * If you do not want this behavior, you will need to store the user-set `intervalUnits`
+     * (passed by `onRefreshChange`) and manually control it via this prop.
+     */
+  refreshIntervalUnits: _propTypes.default.oneOf(["s", "m", "h"]),
   /**
      * @default 'now'
      */
@@ -829,5 +868,13 @@ EuiSuperDatePicker.propTypes = {
     }),
     iconOnly: _propTypes.default.bool,
     responsive: _propTypes.default.oneOfType([_propTypes.default.oneOf([false]), _propTypes.default.arrayOf(_propTypes.default.any.isRequired).isRequired])
-  })
+  }),
+  /**
+     * By default, relative units will be rounded up to next largest unit of time
+     * (for example, 90 minutes will become ~ 2 hours).
+     *
+     * If you do not want this behavior and instead wish to keep the exact units
+     * input by the user, set this flag to `false`.
+     */
+  canRoundRelativeUnits: _propTypes.default.bool
 };

package/lib/components/empty_prompt/empty_prompt.js

@@ -5,10 +5,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.PADDING_SIZES = exports.EuiEmptyPrompt = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _classnames = _interopRequireDefault(require("classnames"));
-var _common = require("../common");
+var _services = require("../../services");
 var _title = require("../title");
 var _flex = require("../flex");
 var _spacer = require("../spacer");
@@ -16,6 +16,7 @@ var _icon = require("../icon");
 var _named_colors = require("../icon/named_colors");
 var _text = require("../text");
 var _panel = require("../panel/panel");
+var _empty_prompt = require("./empty_prompt.styles");
 var _react2 = require("@emotion/react");
 var _excluded = ["icon", "iconType", "iconColor", "title", "titleSize", "paddingSize", "body", "actions", "className", "layout", "hasBorder", "color", "footer"];
 /*
@@ -26,20 +27,12 @@ var _excluded = ["icon", "iconType", "iconColor", "title", "titleSize", "padding
  * Side Public License, v 1.
  */
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), 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) { _defineProperty(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)); }); } return target; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-var paddingSizeToClassNameMap = {
-  none: null,
-  s: 'euiEmptyPrompt--paddingSmall',
-  m: 'euiEmptyPrompt--paddingMedium',
-  l: 'euiEmptyPrompt--paddingLarge'
-};
-var PADDING_SIZES = (0, _common.keysOf)(paddingSizeToClassNameMap);
+var PADDING_SIZES = ['none', 's', 'm', 'l'];
 exports.PADDING_SIZES = PADDING_SIZES;
 var EuiEmptyPrompt = function EuiEmptyPrompt(_ref) {
   var icon = _ref.icon,
@@ -60,41 +53,41 @@ var EuiEmptyPrompt = function EuiEmptyPrompt(_ref) {
     color = _ref$color === void 0 ? 'transparent' : _ref$color,
     footer = _ref.footer,
     rest = _objectWithoutProperties(_ref, _excluded);
-  var isVerticalLayout = layout === 'vertical';
+  var classes = (0, _classnames.default)('euiEmptyPrompt', className);
+  var euiTheme = (0, _services.useEuiTheme)();
+  var styles = (0, _react.useMemo)(function () {
+    return (0, _empty_prompt.euiEmptyPromptStyles)(euiTheme);
+  }, [euiTheme]);
+  var cssStyles = [styles.euiEmptyPrompt, styles[layout]];
+  var mainStyles = [styles.main.euiEmptyPrompt__main, styles.main[layout], styles.main[paddingSize], layout === 'horizontal' && styles.main.horizontalPadding[paddingSize]];
+  var contentStyles = [styles.content.euiEmptyPrompt__content, styles.content[layout]];
+
   // Default the iconColor to `subdued`,
   // otherwise try to match the iconColor with the panel color unless iconColor is specified
   var iconColor = _iconColor !== null && _iconColor !== void 0 ? _iconColor : (0, _named_colors.isNamedColor)(color) ? color : 'subdued';
-  var iconNode = iconType ? (0, _react2.jsx)(_icon.EuiIcon, {
-    type: iconType,
-    size: "xxl",
-    color: iconColor
-  }) : icon;
-  var titleNode;
-  var bodyNode;
-  if (body || title) {
-    if (title) {
-      titleNode = (0, _react2.jsx)(_title.EuiTitle, {
-        size: titleSize
-      }, title);
-    }
-    if (body) {
-      bodyNode = (0, _react2.jsx)(_react.default.Fragment, null, title && (0, _react2.jsx)(_spacer.EuiSpacer, {
-        size: "m"
-      }), (0, _react2.jsx)(_text.EuiText, {
-        color: "subdued"
-      }, body));
-    }
-  }
-  var actionsNode;
-  if (actions) {
-    var actionsRow;
+  var iconNode = (0, _react.useMemo)(function () {
+    if (!iconType && !icon) return null;
+    var iconStyles = [styles.icon.euiEmptyPrompt__icon, styles.icon[layout]];
+    return (0, _react2.jsx)("div", {
+      className: "euiEmptyPrompt__icon",
+      css: iconStyles
+    }, iconType ? (0, _react2.jsx)(_icon.EuiIcon, {
+      type: iconType,
+      size: "xxl",
+      color: iconColor
+    }) : icon);
+  }, [icon, iconType, iconColor, layout, styles.icon]);
+  var actionsNode = (0, _react.useMemo)(function () {
+    if (!actions) return null;
     if (Array.isArray(actions)) {
-      actionsRow = (0, _react2.jsx)(_flex.EuiFlexGroup, {
+      var actionStyles = [styles.actions.euiEmptyPrompt__actions, styles.actions[layout]];
+      return (0, _react2.jsx)(_flex.EuiFlexGroup, {
         className: "euiEmptyPrompt__actions",
+        css: actionStyles,
         gutterSize: "m",
         alignItems: "center",
         justifyContent: "center",
-        direction: isVerticalLayout ? 'column' : 'row'
+        direction: layout === 'vertical' ? 'column' : 'row'
       }, actions.map(function (action, index) {
         return (0, _react2.jsx)(_flex.EuiFlexItem, {
           key: index,
@@ -102,32 +95,39 @@ var EuiEmptyPrompt = function EuiEmptyPrompt(_ref) {
         }, action);
       }));
     } else {
-      actionsRow = actions;
+      return actions;
     }
-    actionsNode = (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(_spacer.EuiSpacer, {
-      size: "l"
-    }), actionsRow);
-  }
-  var contentNodes = (0, _react2.jsx)(_react.default.Fragment, null, titleNode, bodyNode, actionsNode);
-  var classes = (0, _classnames.default)('euiEmptyPrompt', ["euiEmptyPrompt--".concat(layout)], paddingSizeToClassNameMap[paddingSize], className);
-  var panelProps = _objectSpread({
+  }, [actions, layout, styles.actions]);
+  var footerNode = (0, _react.useMemo)(function () {
+    if (!footer) return null;
+    var footerStyles = [styles.footer.euiEmptyPrompt__footer, styles.footer[paddingSize], styles.footer[color], color === 'transparent' && !hasBorder && styles.footer.roundedBorders];
+    return (0, _react2.jsx)("div", {
+      className: "euiEmptyPrompt__footer",
+      css: footerStyles
+    }, footer);
+  }, [footer, paddingSize, color, hasBorder, styles.footer]);
+  return (0, _react2.jsx)(_panel.EuiPanel, _extends({
+    css: cssStyles,
     className: classes,
     color: color,
-    paddingSize: 'none',
-    hasBorder: hasBorder,
-    grow: false
-  }, rest);
-  return (0, _react2.jsx)(_panel.EuiPanel, panelProps, (0, _react2.jsx)("div", {
-    className: "euiEmptyPrompt__main"
-  }, iconNode && (0, _react2.jsx)("div", {
-    className: "euiEmptyPrompt__icon"
-  }, iconNode), (0, _react2.jsx)("div", {
-    className: "euiEmptyPrompt__content"
-  }, (0, _react2.jsx)("div", {
-    className: "euiEmptyPrompt__contentInner"
-  }, contentNodes))), footer && (0, _react2.jsx)("div", {
-    className: "euiEmptyPrompt__footer"
-  }, footer));
+    paddingSize: "none",
+    grow: false,
+    hasBorder: hasBorder
+  }, rest), (0, _react2.jsx)("div", {
+    className: "euiEmptyPrompt__main",
+    css: mainStyles
+  }, iconNode, (0, _react2.jsx)("div", {
+    className: "euiEmptyPrompt__content",
+    css: contentStyles
+  }, title && (0, _react2.jsx)(_title.EuiTitle, {
+    size: titleSize
+  }, title), title && body && (0, _react2.jsx)(_spacer.EuiSpacer, {
+    size: "m"
+  }), body && (0, _react2.jsx)(_text.EuiText, {
+    color: "subdued"
+  }, body), actionsNode && (body || title) && (0, _react2.jsx)(_spacer.EuiSpacer, {
+    size: "l"
+  }), actionsNode)), footerNode);
 };
 exports.EuiEmptyPrompt = EuiEmptyPrompt;
 EuiEmptyPrompt.propTypes = {
@@ -153,7 +153,7 @@ EuiEmptyPrompt.propTypes = {
   /*
        * Accepts any [EuiIcon.type](#/display/icons)
        */
-  iconType: _propTypes.default.oneOfType([_propTypes.default.oneOf(["accessibility", "addDataApp", "advancedSettingsApp", "agentApp", "aggregate", "analyzeEvent", "annotation", "apmApp", "apmTrace", "appSearchApp", "apps", "arrowDown", "arrowLeft", "arrowRight", "arrowUp", "arrowStart", "arrowEnd", "article", "asterisk", "at", "auditbeatApp", "beaker", "bell", "bellSlash", "beta", "bolt", "boxesHorizontal", "boxesVertical", "branch", "branchUser", "broom", "brush", "bug", "bullseye", "calendar", "canvasApp", "casesApp", "check", "checkInCircleFilled", "cheer", "classificationJob", "clock", "cloudDrizzle", "cloudStormy", "cloudSunny", "cluster", "codeApp", "color", "compute", "console", "consoleApp", "container", "continuityAbove", "continuityAboveBelow", "continuityBelow", "continuityWithin", "controlsHorizontal", "controlsVertical", "copy", "copyClipboard", "createAdvancedJob", "createMultiMetricJob", "createPopulationJob", "createSingleMetricJob", "cross", "crossClusterReplicationApp", "crosshairs", "currency", "cut", "dashboardApp", "dataVisualizer", "database", "desktop", "devToolsApp", "discoverApp", "discuss", "document", "documentEdit", "documentation", "documents", "dot", "dotInCircle", "doubleArrowLeft", "doubleArrowRight", "download", "editorAlignCenter", "editorAlignLeft", "editorAlignRight", "editorBold", "editorChecklist", "editorCodeBlock", "editorComment", "editorDistributeHorizontal", "editorDistributeVertical", "editorHeading", "editorItalic", "editorItemAlignBottom", "editorItemAlignCenter", "editorItemAlignLeft", "editorItemAlignMiddle", "editorItemAlignRight", "editorItemAlignTop", "editorLink", "editorOrderedList", "editorPositionBottomLeft", "editorPositionBottomRight", "editorPositionTopLeft", "editorPositionTopRight", "editorRedo", "editorStrike", "editorTable", "editorUnderline", "editorUndo", "editorUnorderedList", "email", "empty", "emsApp", "endpoint", "eql", "eraser", "error", "esqlVis", "exit", "expand", "expandMini", "exportAction", "eye", "eyeClosed", "faceHappy", "faceNeutral", "faceSad", "filebeatApp", "filter", "filterExclude", "filterIgnore", "filterInclude", "filterInCircle", "flag", "fleetApp", "fold", "folderCheck", "folderClosed", "folderExclamation", "folderOpen", "frameNext", "framePrevious", "fullScreen", "fullScreenExit", "function", "gear", "gisApp", "glasses", "globe", "grab", "grabHorizontal", "grabOmnidirectional", "gradient", "graphApp", "grid", "grokApp", "heart", "heartbeatApp", "heatmap", "help", "home", "iInCircle", "image", "importAction", "indexClose", "indexEdit", "indexFlush", "indexManagementApp", "indexMapping", "indexOpen", "indexPatternApp", "indexRollupApp", "indexRuntime", "indexSettings", "indexTemporary", "infinity", "inputOutput", "inspect", "invert", "ip", "key", "keyboard", "kqlField", "kqlFunction", "kqlOperand", "kqlSelector", "kqlValue", "kubernetesNode", "kubernetesPod", "launch", "layers", "lensApp", "lettering", "lineDashed", "lineDotted", "lineSolid", "link", "list", "listAdd", "lock", "lockOpen", "logoAWS", "logoAWSMono", "logoAerospike", "logoApache", "logoAppSearch", "logoAzure", "logoAzureMono", "logoBeats", "logoBusinessAnalytics", "logoCeph", "logoCloud", "logoCloudEnterprise", "logoCode", "logoCodesandbox", "logoCouchbase", "logoDocker", "logoDropwizard", "logoElastic", "logoElasticStack", "logoElasticsearch", "logoEnterpriseSearch", "logoEtcd", "logoGCP", "logoGCPMono", "logoGithub", "logoGmail", "logoGolang", "logoGoogleG", "logoHAproxy", "logoIBM", "logoIBMMono", "logoKafka", "logoKibana", "logoKubernetes", "logoLogging", "logoLogstash", "logoMaps", "logoMemcached", "logoMetrics", "logoMongodb", "logoMySQL", "logoNginx", "logoObservability", "logoOsquery", "logoPhp", "logoPostgres", "logoPrometheus", "logoRabbitmq", "logoRedis", "logoSecurity", "logoSiteSearch", "logoSketch", "logoSlack", "logoUptime", "logoVulnerabilityManagement", "logoWebhook", "logoWindows", "logoWorkplaceSearch", "logsApp", "logstashFilter", "logstashIf", "logstashInput", "logstashOutput", "logstashQueue", "machineLearningApp", "magnet", "magnifyWithExclamation", "magnifyWithMinus", "magnifyWithPlus", "managementApp", "mapMarker", "memory", "menu", "menuDown", "menuLeft", "menuRight", "menuUp", "merge", "metricbeatApp", "metricsApp", "minimize", "minus", "minusInCircle", "minusInCircleFilled", "mobile", "monitoringApp", "moon", "namespace", "nested", "node", "notebookApp", "number", "offline", "online", "outlierDetectionJob", "package", "packetbeatApp", "pageSelect", "pagesSelect", "palette", "paperClip", "partial", "pause", "payment", "pencil", "percent", "pin", "pinFilled", "pipeBreaks", "pipelineApp", "pipeNoBreaks", "pivot", "play", "playFilled", "plus", "plusInCircle", "plusInCircleFilled", "popout", "push", "questionInCircle", "quote", "recentlyViewedApp", "refresh", "regressionJob", "reporter", "reportingApp", "returnKey", "save", "savedObjectsApp", "scale", "search", "searchProfilerApp", "securityAnalyticsApp", "securityApp", "securitySignal", "securitySignalDetected", "securitySignalResolved", "sessionViewer", "shard", "share", "snowflake", "sortAscending", "sortDescending", "sortDown", "sortLeft", "sortRight", "sortUp", "sortable", "spaces", "spacesApp", "sparkles", "sqlApp", "starEmpty", "starEmptySpace", "starFilled", "starFilledSpace", "starMinusEmpty", "starMinusFilled", "starPlusEmpty", "starPlusFilled", "stats", "stop", "stopFilled", "stopSlash", "storage", "string", "submodule", "sun", "swatchInput", "symlink", "tableDensityCompact", "tableDensityExpanded", "tableDensityNormal", "tableOfContents", "tag", "tear", "temperature", "timeline", "timelineWithArrow", "timelionApp", "timeRefresh", "timeslider", "training", "transitionLeftIn", "transitionLeftOut", "transitionTopIn", "transitionTopOut", "trash", "unfold", "unlink", "upgradeAssistantApp", "uptimeApp", "user", "userAvatar", "users", "usersRolesApp", "vector", "videoPlayer", "visArea", "visAreaStacked", "visBarHorizontal", "visBarHorizontalStacked", "visBarVertical", "visBarVerticalStacked", "visGauge", "visGoal", "visLine", "visMapCoordinate", "visMapRegion", "visMetric", "visPie", "visTable", "visTagCloud", "visText", "visTimelion", "visVega", "visVisualBuilder", "visualizeApp", "vulnerabilityManagementApp", "warning", "alert", "watchesApp", "wordWrap", "wordWrapDisabled", "workplaceSearchApp", "wrench", "tokenAlias", "tokenAnnotation", "tokenArray", "tokenBinary", "tokenBoolean", "tokenClass", "tokenCompletionSuggester", "tokenConstant", "tokenDate", "tokenElement", "tokenEnum", "tokenEnumMember", "tokenEvent", "tokenException", "tokenField", "tokenFile", "tokenFlattened", "tokenFunction", "tokenGeo", "tokenHistogram", "tokenInterface", "tokenIP", "tokenJoin", "tokenKey", "tokenKeyword", "tokenMethod", "tokenMetricCounter", "tokenMetricGauge", "tokenModule", "tokenNamespace", "tokenNested", "tokenNull", "tokenNumber", "tokenObject", "tokenOperator", "tokenPackage", "tokenParameter", "tokenPercolator", "tokenProperty", "tokenRange", "tokenRankFeature", "tokenRankFeatures", "tokenRepo", "tokenSearchType", "tokenShape", "tokenString", "tokenStruct", "tokenSymbol", "tokenTag", "tokenText", "tokenTokenCount", "tokenVariable", "tokenVectorDense", "tokenDenseVector", "tokenVectorSparse"]).isRequired, _propTypes.default.string.isRequired, _propTypes.default.elementType.isRequired]),
+  iconType: _propTypes.default.oneOfType([_propTypes.default.oneOf(["accessibility", "addDataApp", "advancedSettingsApp", "agentApp", "aggregate", "analyzeEvent", "annotation", "apmApp", "apmTrace", "appSearchApp", "apps", "arrowDown", "arrowLeft", "arrowRight", "arrowUp", "arrowStart", "arrowEnd", "article", "asterisk", "at", "auditbeatApp", "beaker", "bell", "bellSlash", "beta", "bolt", "boxesHorizontal", "boxesVertical", "branch", "branchUser", "broom", "brush", "bug", "bullseye", "calendar", "canvasApp", "casesApp", "check", "checkInCircleFilled", "cheer", "classificationJob", "clock", "cloudDrizzle", "cloudStormy", "cloudSunny", "cluster", "codeApp", "color", "compute", "console", "consoleApp", "container", "continuityAbove", "continuityAboveBelow", "continuityBelow", "continuityWithin", "controlsHorizontal", "controlsVertical", "copy", "copyClipboard", "createAdvancedJob", "createMultiMetricJob", "createPopulationJob", "createSingleMetricJob", "cross", "crossClusterReplicationApp", "crosshairs", "currency", "cut", "dashboardApp", "dataVisualizer", "database", "desktop", "devToolsApp", "discoverApp", "discuss", "document", "documentEdit", "documentation", "documents", "dot", "dotInCircle", "doubleArrowLeft", "doubleArrowRight", "download", "editorAlignCenter", "editorAlignLeft", "editorAlignRight", "editorBold", "editorChecklist", "editorCodeBlock", "editorComment", "editorDistributeHorizontal", "editorDistributeVertical", "editorHeading", "editorItalic", "editorItemAlignBottom", "editorItemAlignCenter", "editorItemAlignLeft", "editorItemAlignMiddle", "editorItemAlignRight", "editorItemAlignTop", "editorLink", "editorOrderedList", "editorPositionBottomLeft", "editorPositionBottomRight", "editorPositionTopLeft", "editorPositionTopRight", "editorRedo", "editorStrike", "editorTable", "editorUnderline", "editorUndo", "editorUnorderedList", "email", "empty", "emsApp", "endpoint", "eql", "eraser", "error", "esqlVis", "exit", "expand", "expandMini", "exportAction", "eye", "eyeClosed", "faceHappy", "faceNeutral", "faceSad", "filebeatApp", "filter", "filterExclude", "filterIgnore", "filterInclude", "filterInCircle", "flag", "fleetApp", "fold", "folderCheck", "folderClosed", "folderExclamation", "folderOpen", "frameNext", "framePrevious", "fullScreen", "fullScreenExit", "function", "gear", "gisApp", "glasses", "globe", "grab", "grabHorizontal", "grabOmnidirectional", "gradient", "graphApp", "grid", "grokApp", "heart", "heartbeatApp", "heatmap", "help", "home", "iInCircle", "image", "importAction", "index", "indexClose", "indexEdit", "indexFlush", "indexManagementApp", "indexMapping", "indexOpen", "indexPatternApp", "indexRollupApp", "indexRuntime", "indexSettings", "indexTemporary", "infinity", "inputOutput", "inspect", "invert", "ip", "key", "keyboard", "kqlField", "kqlFunction", "kqlOperand", "kqlSelector", "kqlValue", "kubernetesNode", "kubernetesPod", "launch", "layers", "lensApp", "lettering", "lineDashed", "lineDotted", "lineSolid", "link", "list", "listAdd", "lock", "lockOpen", "logoAWS", "logoAWSMono", "logoAerospike", "logoApache", "logoAppSearch", "logoAzure", "logoAzureMono", "logoBeats", "logoBusinessAnalytics", "logoCeph", "logoCloud", "logoCloudEnterprise", "logoCode", "logoCodesandbox", "logoCouchbase", "logoDocker", "logoDropwizard", "logoElastic", "logoElasticStack", "logoElasticsearch", "logoEnterpriseSearch", "logoEtcd", "logoGCP", "logoGCPMono", "logoGithub", "logoGmail", "logoGolang", "logoGoogleG", "logoHAproxy", "logoIBM", "logoIBMMono", "logoKafka", "logoKibana", "logoKubernetes", "logoLogging", "logoLogstash", "logoMaps", "logoMemcached", "logoMetrics", "logoMongodb", "logoMySQL", "logoNginx", "logoObservability", "logoOsquery", "logoPhp", "logoPostgres", "logoPrometheus", "logoRabbitmq", "logoRedis", "logoSecurity", "logoSiteSearch", "logoSketch", "logoSlack", "logoUptime", "logoVulnerabilityManagement", "logoWebhook", "logoWindows", "logoWorkplaceSearch", "logsApp", "logstashFilter", "logstashIf", "logstashInput", "logstashOutput", "logstashQueue", "machineLearningApp", "magnet", "magnifyWithExclamation", "magnifyWithMinus", "magnifyWithPlus", "managementApp", "mapMarker", "memory", "menu", "menuDown", "menuLeft", "menuRight", "menuUp", "merge", "metricbeatApp", "metricsApp", "minimize", "minus", "minusInCircle", "minusInCircleFilled", "mobile", "monitoringApp", "moon", "namespace", "nested", "node", "notebookApp", "number", "offline", "online", "outlierDetectionJob", "package", "packetbeatApp", "pageSelect", "pagesSelect", "palette", "paperClip", "partial", "pause", "payment", "pencil", "percent", "pin", "pinFilled", "pipeBreaks", "pipelineApp", "pipeNoBreaks", "pivot", "play", "playFilled", "plus", "plusInCircle", "plusInCircleFilled", "popout", "push", "questionInCircle", "quote", "recentlyViewedApp", "refresh", "regressionJob", "reporter", "reportingApp", "returnKey", "save", "savedObjectsApp", "scale", "search", "searchProfilerApp", "securityAnalyticsApp", "securityApp", "securitySignal", "securitySignalDetected", "securitySignalResolved", "sessionViewer", "shard", "share", "snowflake", "sortAscending", "sortDescending", "sortDown", "sortLeft", "sortRight", "sortUp", "sortable", "spaces", "spacesApp", "sparkles", "sqlApp", "starEmpty", "starEmptySpace", "starFilled", "starFilledSpace", "starMinusEmpty", "starMinusFilled", "starPlusEmpty", "starPlusFilled", "stats", "stop", "stopFilled", "stopSlash", "storage", "string", "submodule", "sun", "swatchInput", "symlink", "tableDensityCompact", "tableDensityExpanded", "tableDensityNormal", "tableOfContents", "tag", "tear", "temperature", "timeline", "timelineWithArrow", "timelionApp", "timeRefresh", "timeslider", "training", "transitionLeftIn", "transitionLeftOut", "transitionTopIn", "transitionTopOut", "trash", "unfold", "unlink", "upgradeAssistantApp", "uptimeApp", "user", "userAvatar", "users", "usersRolesApp", "vector", "videoPlayer", "visArea", "visAreaStacked", "visBarHorizontal", "visBarHorizontalStacked", "visBarVertical", "visBarVerticalStacked", "visGauge", "visGoal", "visLine", "visMapCoordinate", "visMapRegion", "visMetric", "visPie", "visTable", "visTagCloud", "visText", "visTimelion", "visVega", "visVisualBuilder", "visualizeApp", "vulnerabilityManagementApp", "warning", "alert", "watchesApp", "wordWrap", "wordWrapDisabled", "workplaceSearchApp", "wrench", "tokenAlias", "tokenAnnotation", "tokenArray", "tokenBinary", "tokenBoolean", "tokenClass", "tokenCompletionSuggester", "tokenConstant", "tokenDate", "tokenElement", "tokenEnum", "tokenEnumMember", "tokenEvent", "tokenException", "tokenField", "tokenFile", "tokenFlattened", "tokenFunction", "tokenGeo", "tokenHistogram", "tokenInterface", "tokenIP", "tokenJoin", "tokenKey", "tokenKeyword", "tokenMethod", "tokenMetricCounter", "tokenMetricGauge", "tokenModule", "tokenNamespace", "tokenNested", "tokenNull", "tokenNumber", "tokenObject", "tokenOperator", "tokenPackage", "tokenParameter", "tokenPercolator", "tokenProperty", "tokenRange", "tokenRankFeature", "tokenRankFeatures", "tokenRepo", "tokenSearchType", "tokenShape", "tokenString", "tokenStruct", "tokenSymbol", "tokenTag", "tokenText", "tokenTokenCount", "tokenVariable", "tokenVectorDense", "tokenDenseVector", "tokenVectorSparse"]).isRequired, _propTypes.default.string.isRequired, _propTypes.default.elementType.isRequired]),
   /**
        * Color for `iconType` when passed as an `IconType`
        */