@elastic/eui 80.0.0 → 81.1.0

package/es/components/date_picker/date_picker_range.js

@@ -1,4 +1,4 @@
-var _excluded = ["children", "className", "startDateControl", "endDateControl", "iconType", "fullWidth", "isCustom", "readOnly", "isInvalid", "disabled", "onFocus", "onBlur", "append", "prepend"];
+var _excluded = ["children", "className", "startDateControl", "endDateControl", "iconType", "inline", "shadow", "fullWidth", "isCustom", "readOnly", "isLoading", "isInvalid", "disabled", "onFocus", "onBlur", "append", "prepend"];
 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; }
@@ -10,10 +10,12 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
  * Side Public License, v 1.
  */
 
-import React, { cloneElement } from 'react';
+import React, { useMemo, cloneElement } from 'react';
 import PropTypes from "prop-types";
 import classNames from 'classnames';
 import { EuiFormControlLayoutDelimited } from '../form';
+import { useEuiTheme } from '../../services';
+import { euiDatePickerRangeStyles, euiDatePickerRangeInlineStyles } from './date_picker_range.styles';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export var EuiDatePickerRange = function EuiDatePickerRange(_ref) {
   var children = _ref.children,
@@ -22,9 +24,13 @@ export var EuiDatePickerRange = function EuiDatePickerRange(_ref) {
     endDateControl = _ref.endDateControl,
     _ref$iconType = _ref.iconType,
     iconType = _ref$iconType === void 0 ? true : _ref$iconType,
-    fullWidth = _ref.fullWidth,
+    inline = _ref.inline,
+    _ref$shadow = _ref.shadow,
+    shadow = _ref$shadow === void 0 ? true : _ref$shadow,
+    _fullWidth = _ref.fullWidth,
     isCustom = _ref.isCustom,
     readOnly = _ref.readOnly,
+    isLoading = _ref.isLoading,
     isInvalid = _ref.isInvalid,
     disabled = _ref.disabled,
     _onFocus = _ref.onFocus,
@@ -32,18 +38,27 @@ export var EuiDatePickerRange = function EuiDatePickerRange(_ref) {
     append = _ref.append,
     prepend = _ref.prepend,
     rest = _objectWithoutProperties(_ref, _excluded);
-  var classes = classNames('euiDatePickerRange', {
-    'euiDatePickerRange--fullWidth': fullWidth,
-    'euiDatePickerRange--readOnly': readOnly,
-    'euiDatePickerRange--isInvalid': isInvalid,
-    'euiDatePickerRange--isDisabled': disabled
-  }, className);
+  // `fullWidth` should not affect inline datepickers (matches non-range behavior)
+  var fullWidth = _fullWidth && !inline;
+  var classes = classNames('euiDatePickerRange', className);
+  var euiTheme = useEuiTheme();
+  var styles = euiDatePickerRangeStyles(euiTheme);
+  var cssStyles = [styles.euiDatePickerRange];
+  if (inline) {
+    // Determine the inline container query to use based on the width of the react-datepicker
+    var hasTimeSelect = startDateControl.props.showTimeSelect || endDateControl.props.showTimeSelect;
+    var inlineStyles = euiDatePickerRangeInlineStyles(euiTheme);
+    cssStyles.push(inlineStyles.inline);
+    cssStyles.push(hasTimeSelect ? inlineStyles.responsiveWithTimeSelect : inlineStyles.responsive);
+    if (shadow) cssStyles.push(inlineStyles.shadow);
+  }
   var startControl = startDateControl;
   var endControl = endDateControl;
   if (!isCustom) {
     startControl = /*#__PURE__*/cloneElement(startDateControl, {
       controlOnly: true,
       showIcon: false,
+      inline: inline,
       fullWidth: fullWidth,
       readOnly: readOnly,
       disabled: disabled || startDateControl.props.disabled,
@@ -63,6 +78,7 @@ export var EuiDatePickerRange = function EuiDatePickerRange(_ref) {
     endControl = /*#__PURE__*/cloneElement(endDateControl, {
       controlOnly: true,
       showIcon: false,
+      inline: inline,
       fullWidth: fullWidth,
       readOnly: readOnly,
       disabled: disabled || endDateControl.props.disabled,
@@ -81,18 +97,27 @@ export var EuiDatePickerRange = function EuiDatePickerRange(_ref) {
       }
     });
   }
-  return ___EmotionJSX(EuiFormControlLayoutDelimited, _extends({
-    icon: iconType === true ? 'calendar' : iconType || undefined,
+  var icon = useMemo(function () {
+    if (inline) return undefined;
+    if (iconType === false) return undefined;
+    if (iconType === true) return 'calendar';
+    return iconType;
+  }, [iconType, inline]);
+  return ___EmotionJSX("span", _extends({
     className: classes,
+    css: cssStyles
+  }, rest), ___EmotionJSX(EuiFormControlLayoutDelimited, {
+    icon: icon,
     startControl: startControl,
     endControl: endControl,
     fullWidth: fullWidth,
     readOnly: readOnly,
     isDisabled: disabled,
     isInvalid: isInvalid,
-    append: append,
-    prepend: prepend
-  }, rest));
+    isLoading: isLoading,
+    append: inline ? undefined : append,
+    prepend: inline ? undefined : prepend
+  }));
 };
 EuiDatePickerRange.propTypes = {
   className: PropTypes.string,
@@ -123,6 +148,17 @@ EuiDatePickerRange.propTypes = {
        * Passes through to each control
        */
   disabled: PropTypes.bool,
+  /**
+       * Displays both date picker calendars directly on the page.
+       * Will not render `iconType`, `fullWidth`, `prepend`, or `append`.
+       *
+       * Passes through to each control if `isCustom` is not set.
+       */
+  inline: PropTypes.bool,
+  /**
+       * Allows turning the shadow off if using the `inline` prop
+       */
+  shadow: PropTypes.bool,
   /**
        * Triggered whenever the start or end controls are blurred
        */

package/es/components/date_picker/date_picker_range.styles.js

@@ -0,0 +1,36 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { css } from '@emotion/react';
+import { logicalCSS } from '../../global_styling';
+import { euiShadowMedium } from '../../themes/amsterdam/global_styling/mixins';
+import { euiFormVariables } from '../form/form.styles';
+export var euiDatePickerRangeStyles = function euiDatePickerRangeStyles(euiThemeContext) {
+  var _euiFormVariables = euiFormVariables(euiThemeContext),
+    controlLayoutGroupInputHeight = _euiFormVariables.controlLayoutGroupInputHeight;
+  return {
+    euiDatePickerRange: /*#__PURE__*/css(".euiFieldText.euiDatePicker{", logicalCSS('height', controlLayoutGroupInputHeight), ";};label:euiDatePickerRange;")
+  };
+};
+export var euiDatePickerRangeInlineStyles = function euiDatePickerRangeInlineStyles(euiThemeContext) {
+  var euiTheme = euiThemeContext.euiTheme;
+
+  // Use a container query to stack date pickers vertically if the container is
+  // not wide enough to fit both. We need a fn for this to render two width queries,
+  // depending on whether time selection is being rendered or not
+  var containerQuery = function containerQuery(datePickerWidth) {
+    var delimiterWidth = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 16;
+    return "\n    display: block;\n    container-type: inline-size;\n\n    .euiFormControlLayout__childrenWrapper {\n      // Use static px widths for now, since render behavior comes from a third party library\n      @container (max-width: ".concat(datePickerWidth * 2 + delimiterWidth, "px) {\n        // Unset grid display\n        display: block !important;\n\n        // Center and point the default delimiter arrow downwards\n        & > .euiText > [data-icon-type='sortRight'] {\n          transform: rotate(90deg);\n          margin-inline: auto;\n        }\n      }\n    }");
+  };
+  return {
+    inline: /*#__PURE__*/css(".euiFormControlLayoutDelimited{", logicalCSS('height', 'auto'), " ", logicalCSS('width', 'fit-content'), " ", logicalCSS('max-width', '100%'), " background-color:transparent;box-shadow:none;padding:0;.euiFormControlLayout__childrenWrapper{display:grid;grid-template-columns:1fr auto 1fr;grid-template-rows:auto;align-items:stretch;background-color:transparent;}&.euiFormControlLayout--group{&>*,.euiFormControlLayoutDelimited__delimiter{", logicalCSS('height', 'auto'), ";}}.euiFormControlLayoutIcons{justify-content:center;grid-column:1/span 3;", logicalCSS('height', 'auto'), " ", logicalCSS('padding-bottom', euiTheme.size.s), ";}}.react-datepicker{position:relative;}.react-datepicker__time-list{padding:0;};label:inline;"),
+    responsive: /*#__PURE__*/css(containerQuery(268), ";;label:responsive;"),
+    responsiveWithTimeSelect: /*#__PURE__*/css(containerQuery(350), ";;label:responsiveWithTimeSelect;"),
+    shadow: /*#__PURE__*/css(".euiFormControlLayoutDelimited{", euiShadowMedium(euiThemeContext), " .euiFormControlLayout__childrenWrapper{background-color:", euiTheme.colors.emptyShade, ";}};label:shadow;")
+  };
+};

package/es/components/date_picker/react-datepicker/src/calendar.js

@@ -246,7 +246,8 @@ var Calendar = /*#__PURE__*/function (_React$Component) {
       return ___EmotionJSX("button", {
         type: "button",
         className: classes.join(" "),
-        onClick: clickHandler
+        onClick: clickHandler,
+        disabled: !_this.props.accessibleMode
       }, _this.props.previousMonthButtonLabel);
     });
     _defineProperty(_assertThisInitialized(_this), "renderNextMonthButton", function () {
@@ -272,7 +273,8 @@ var Calendar = /*#__PURE__*/function (_React$Component) {
       return ___EmotionJSX("button", {
         type: "button",
         className: classes.join(" "),
-        onClick: clickHandler
+        onClick: clickHandler,
+        disabled: !_this.props.accessibleMode
       }, _this.props.nextMonthButtonLabel);
     });
     _defineProperty(_assertThisInitialized(_this), "renderCurrentMonth", function () {
@@ -514,13 +516,15 @@ var Calendar = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       var Container = this.props.container || CalendarContainer;
+      var classes = classnames("react-datepicker", this.props.className, {
+        "react-datepicker--time-only": this.props.showTimeSelectOnly,
+        "react-datepicker--non-interactive": !this.props.isCalendarInteractive
+      });
       var trapFocus = this.props.accessibleMode && !this.props.inline;
       var initialFocusTarget = this.props.showTimeSelectOnly ? ".react-datepicker__time-box--accessible" : ".react-datepicker__month--accessible";
       if (trapFocus) {
         return ___EmotionJSX(Container, {
-          className: classnames("react-datepicker", this.props.className, {
-            "react-datepicker--time-only": this.props.showTimeSelectOnly
-          })
+          className: classes
         }, ___EmotionJSX(EuiFocusTrap, {
           disabled: this.state.pauseFocusTrap || !this.props.enableFocusTrap,
           className: "react-datepicker__focusTrap",
@@ -529,9 +533,7 @@ var Calendar = /*#__PURE__*/function (_React$Component) {
         }, this.renderPreviousMonthButton(), this.renderNextMonthButton(), this.renderMonths(), this.renderTodayButton(), this.renderTimeSection(), this.props.children));
       } else {
         return ___EmotionJSX(Container, {
-          className: classnames("react-datepicker", this.props.className, {
-            "react-datepicker--time-only": this.props.showTimeSelectOnly
-          })
+          className: classes
         }, this.renderPreviousMonthButton(), this.renderNextMonthButton(), this.renderMonths(), this.renderTodayButton(), this.renderTimeSection(), this.props.children);
       }
     }

package/es/components/date_picker/react-datepicker/src/index.js

@@ -512,7 +512,8 @@ var DatePicker = /*#__PURE__*/function (_React$Component) {
         renderDayContents: _this.props.renderDayContents,
         updateSelection: _this.updateSelection,
         accessibleMode: _this.props.accessibleMode,
-        enableFocusTrap: _this.state.enableFocusTrap
+        enableFocusTrap: _this.state.enableFocusTrap,
+        isCalendarInteractive: !(_this.props.disabled || _this.props.readOnly)
       }, _this.props.children);
       return calendar;
     });

package/es/components/date_picker/super_date_picker/date_popover/date_popover_button.js

@@ -13,6 +13,8 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import React from 'react';
 import PropTypes from "prop-types";
 import classNames from 'classnames';
+// eslint-disable-line import/named
+
 import { useEuiI18n } from '../../../i18n';
 import { EuiPopover } from '../../../popover';
 import { useFormatTimeString } from '../pretty_duration';

package/es/components/date_picker/super_date_picker/date_popover/date_popover_content.js

@@ -15,6 +15,7 @@ import { EuiButton } from '../../../button';
 import { EuiAbsoluteTab } from './absolute_tab';
 import { EuiRelativeTab } from './relative_tab';
 import { getDateMode, DATE_MODES, toAbsoluteString, toRelativeString } from '../date_modes';
+// eslint-disable-line import/named
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export var EuiDatePopoverContent = function EuiDatePopoverContent(_ref) {
   var value = _ref.value,

package/es/components/date_picker/super_date_picker/date_popover/relative_tab.js

@@ -38,6 +38,9 @@ import { EuiSpacer } from '../../../spacer';
 import { parseRelativeParts, toRelativeStringFromParts } from '../relative_utils';
 import { EuiScreenReaderOnly } from '../../../accessibility';
 import { EuiI18n } from '../../../i18n';
+
+// eslint-disable-line import/named
+
 import { INVALID_DATE } from '../date_modes';
 import { EuiPopoverFooter } from '../../../popover';
 import { jsx as ___EmotionJSX } from "@emotion/react";

package/es/components/error_boundary/error_boundary.js

@@ -42,37 +42,44 @@ export var EuiErrorBoundary = /*#__PURE__*/function (_Component) {
     _this = _super.call(this, props);
     var errorState = {
       hasError: false,
-      error: undefined
+      errorMessage: undefined
     };
     _this.state = errorState;
     return _this;
   }
   _createClass(EuiErrorBoundary, [{
     key: "componentDidCatch",
-    value: function componentDidCatch(_ref) {
-      var message = _ref.message,
-        stack = _ref.stack;
+    value: function componentDidCatch(error) {
+      var _this$props$onError, _this$props;
       // Display fallback UI
       // Only Chrome includes the `message` property as part of `stack`.
       // For consistency, rebuild the full error text from the Error subparts.
+      var message = error.message,
+        stack = error.stack;
       var idx = (stack === null || stack === void 0 ? void 0 : stack.indexOf(message)) || -1;
       var stackStr = idx > -1 ? stack === null || stack === void 0 ? void 0 : stack.substr(idx + message.length + 1) : stack;
-      var error = "Error: ".concat(message, "\n").concat(stackStr);
+      var errorMessage = "Error: ".concat(message, "\n").concat(stackStr);
       this.setState({
         hasError: true,
-        error: error
+        errorMessage: errorMessage
       });
+
+      // Pass back the error to the consumer
+      (_this$props$onError = (_this$props = this.props).onError) === null || _this$props$onError === void 0 ? void 0 : _this$props$onError.call(_this$props, error);
     }
   }, {
     key: "render",
     value: function render() {
-      var _this$props = this.props,
-        children = _this$props.children,
-        rest = _objectWithoutProperties(_this$props, _excluded);
-      if (this.state.hasError) {
+      var _this$props2 = this.props,
+        children = _this$props2.children,
+        rest = _objectWithoutProperties(_this$props2, _excluded);
+      var _this$state = this.state,
+        hasError = _this$state.hasError,
+        errorMessage = _this$state.errorMessage;
+      if (hasError) {
         // You can render any custom fallback UI
         return ___EmotionJSX(EuiErrorMessage, _extends({}, rest, {
-          errorMessage: this.state.error
+          errorMessage: errorMessage
         }));
       }
       return children;
@@ -93,13 +100,17 @@ EuiErrorBoundary.propTypes = {
   /**
        * ReactNode to render as this component's content
        */
-  children: PropTypes.node.isRequired
+  children: PropTypes.node.isRequired,
+  /**
+       * Callback that fires when an error is caught. Passes back the full error
+       */
+  onError: PropTypes.func
 };
-export var EuiErrorMessage = function EuiErrorMessage(_ref2) {
-  var errorMessage = _ref2.errorMessage,
-    className = _ref2.className,
-    dataTestSubj = _ref2['data-test-subj'],
-    rest = _objectWithoutProperties(_ref2, _excluded2);
+export var EuiErrorMessage = function EuiErrorMessage(_ref) {
+  var errorMessage = _ref.errorMessage,
+    className = _ref.className,
+    dataTestSubj = _ref['data-test-subj'],
+    rest = _objectWithoutProperties(_ref, _excluded2);
   var euiTheme = useEuiTheme();
   var styles = euiErrorBoundaryStyles(euiTheme);
   return ___EmotionJSX("div", _extends({

package/es/components/filter_group/filter_group.a11y.js

@@ -238,10 +238,10 @@ describe('EuiFilterGroup multiselect example', function () {
       cy.realPress('Tab');
       cy.repeatRealPress('ArrowDown', 3);
       cy.realPress('Enter');
-      cy.get('li[aria-selected="true"]').find('span.euiSelectableListItem__text').should('have.text', 'Dmitri Shostakovich - Selected option. To exclude this option, press enter.');
+      cy.get('li[aria-selected="true"]').find('span.euiSelectableListItem__text').should('have.text', 'Dmitri Shostakovich - Checked option. To exclude this option, press Enter.');
       cy.realPress('ArrowDown');
       cy.repeatRealPress('Enter');
-      cy.get('li[aria-selected="true"]').find('span.euiSelectableListItem__text').should('have.text', 'Felix Mendelssohn-Bartholdy - Excluded option. To uncheck this option, press enter.');
+      cy.get('li[aria-selected="true"]').find('span.euiSelectableListItem__text').should('have.text', 'Felix Mendelssohn-Bartholdy - Excluded option. To uncheck this option, press Enter.');
       cy.checkAxe();
     });
     it('has zero violations when filtering by searchbox', function () {

package/es/components/focus_trap/focus_trap.js

@@ -96,7 +96,6 @@ export var EuiFocusTrap = /*#__PURE__*/function (_Component) {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps) {
       if (prevProps.disabled === true && this.props.disabled === false) {
-        // eslint-disable-next-line react/no-did-update-set-state
         this.setState({
           hasBeenDisabledByClick: false
         });

package/es/components/form/checkbox/checkbox_group.js

@@ -16,6 +16,8 @@ import PropTypes from "prop-types";
 import classNames from 'classnames';
 import { EuiFormFieldset } from '../form_fieldset';
 import { EuiCheckbox } from './checkbox';
+
+// Must omit inherit `onChange` properties or else TS complains when applying to the EuiRadio
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export var EuiCheckboxGroup = function EuiCheckboxGroup(_ref) {
   var _ref$options = _ref.options,

package/es/components/form/file_picker/file_picker.js

@@ -203,9 +203,7 @@ export var EuiFilePicker = /*#__PURE__*/function (_Component) {
           id: promptId
         }, ___EmotionJSX(EuiIcon, {
           className: "euiFilePicker__icon",
-          color: isInvalid ? 'danger' : disabled ? 'subdued' : 'primary' // eslint-disable-line no-nested-ternary
-          ,
-
+          color: isInvalid ? 'danger' : disabled ? 'subdued' : 'primary',
           type: isInvalid ? 'alert' : 'importAction',
           size: normalFormControl ? 'm' : 'l',
           "aria-hidden": "true"

package/es/components/form/form_control_layout/form_control_layout_delimited.js

@@ -41,17 +41,17 @@ export var EuiFormControlLayoutDelimited = function EuiFormControlLayoutDelimite
 };
 EuiFormControlLayoutDelimited.propTypes = {
   /**
-     * Left side control
-     */
+       * Left side control
+       */
   startControl: PropTypes.element.isRequired,
   /**
-     * Right side control
-     */
+       * Right side control
+       */
   endControl: PropTypes.element.isRequired,
   /**
-     * The center content. Accepts a string to be wrapped in a subdued EuiText
-     * or a single ReactElement
-     */
+       * The center content. Accepts a string to be wrapped in a subdued EuiText
+       * or a single ReactElement
+       */
   delimiter: PropTypes.node,
   className: PropTypes.string
 };

package/es/components/form/radio/radio_group.js

@@ -16,6 +16,8 @@ import PropTypes from "prop-types";
 import classNames from 'classnames';
 import { EuiFormFieldset } from '../form_fieldset';
 import { EuiRadio } from './radio';
+
+// Must omit inherit `onChange` properties or else TS complains when applying to the EuiRadio
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export var EuiRadioGroup = function EuiRadioGroup(_ref) {
   var _ref$options = _ref.options,

package/es/components/form/range/dual_range.js

@@ -334,9 +334,6 @@ export var EuiDualRangeClass = /*#__PURE__*/function (_Component) {
     key: "componentDidMount",
     value: function componentDidMount() {
       if (this.rangeSliderRef && this.rangeSliderRef.clientWidth === 0) {
-        // Safe to call `setState` inside conditional
-        // https://reactjs.org/docs/react-component.html#componentdidmount
-        // eslint-disable-next-line react/no-did-mount-set-state
         this.setState({
           isVisible: false
         });
@@ -347,9 +344,6 @@ export var EuiDualRangeClass = /*#__PURE__*/function (_Component) {
     value: function componentDidUpdate() {
       var _this$rangeSliderRef;
       if ((_this$rangeSliderRef = this.rangeSliderRef) !== null && _this$rangeSliderRef !== void 0 && _this$rangeSliderRef.clientWidth && !this.state.isVisible) {
-        // Safe to call `setState` inside conditional
-        // https://reactjs.org/docs/react-component.html#componentdidupdate
-        // eslint-disable-next-line  react/no-did-update-set-state
         this.setState({
           isVisible: true
         });

package/es/components/i18n/i18n.js

@@ -97,6 +97,8 @@ var EuiI18n = function EuiI18n(props) {
 
 // A single default could be a string, react child, or render function
 
+// An array with multiple defaults can only be an array of strings or elements
+
 function useEuiI18n() {
   var i18nConfig = useContext(I18nContext);
   var mapping = i18nConfig.mapping,

package/es/components/icon/icon.js

@@ -45,6 +45,9 @@ var getIsAppIcon = function getIsAppIcon(iconType) {
   return iconType.endsWith('App') || iconType.endsWith('Job');
 };
 export var TYPES = keysOf(typeToPathMap);
+
+// We accept arbitrary color strings, which are impossible to type.
+
 export var SIZES = ['original', 's', 'm', 'l', 'xl', 'xxl'];
 function isEuiIconType(x) {
   return typeof x === 'string' && typeToPathMap.hasOwnProperty(x);
@@ -136,7 +139,6 @@ export var EuiIconClass = /*#__PURE__*/function (_PureComponent) {
       this.isMounted = true;
       var type = this.props.type;
       if (isEuiIconType(type) && this.state.icon == null) {
-        //eslint-disable-next-line react/no-did-mount-set-state
         this.setState({
           neededLoading: true,
           isLoading: true
@@ -152,14 +154,12 @@ export var EuiIconClass = /*#__PURE__*/function (_PureComponent) {
       var type = this.props.type;
       if (type !== prevProps.type) {
         if (isEuiIconType(type)) {
-          // eslint-disable-next-line react/no-did-update-set-state
           this.setState({
             neededLoading: iconComponentCache.hasOwnProperty(type),
             isLoading: true
           });
           this.loadIconComponent(type);
         } else {
-          // eslint-disable-next-line react/no-did-update-set-state
           this.setState({
             icon: type,
             neededLoading: true,

package/es/components/index.js

@@ -49,6 +49,7 @@ export * from './horizontal_rule';
 export * from './icon';
 export * from './image';
 export * from './inner_text';
+export * from './inline_edit';
 export * from './i18n';
 export * from './loading';
 export * from './key_pad_menu';

package/es/components/inline_edit/index.js

@@ -0,0 +1,10 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+export { EuiInlineEditText } from './inline_edit_text';
+export { EuiInlineEditTitle } from './inline_edit_title';