@jetbrains/ring-ui 5.0.156 → 5.0.157

package/dist/_helpers/title.js

@@ -1,3 +1,5 @@
+import { c as _defineProperty, j as _inherits, k as _createSuper, b as _classCallCheck, m as _assertThisInitialized, _ as _createClass } from './_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.array.concat.js';
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
@@ -8,66 +10,78 @@ import { refObject } from '../global/prop-types.js';
 
 var modules_09d014b4 = {"unit":"i__const_unit_0","height":"i__const_height_1","compensate":"i__const_compensate_2","light":"light_rui_2ac4","dataListWrapper":"dataListWrapper_rui_9f76","dataList":"dataList_rui_9f76","itemContent":"itemContent_rui_9f76","title":"title_rui_9f76","disabledHover":"disabledHover_rui_9f76","titleSelected":"titleSelected_rui_9f76","titleFocused":"titleFocused_rui_9f76","showMore":"showMore_rui_9f76","boxes":"boxes_rui_9f76","checkboxBox":"checkboxBox_rui_9f76","collapseButton":"collapseButton_rui_9f76","collapseIcon":"collapseIcon_rui_9f76","loadingOverlay":"loadingOverlay_rui_9f76","showMoreLoader":"showMoreLoader_rui_9f76"};
 
-class Title extends PureComponent {
-  static defaultProps = {
-    selectable: false,
-    selected: false,
-    showFocus: false
-  };
-  id = getUID('data-list-title');
-  onCheckboxFocus = () => {
-    this.props.onFocusRestore();
-  };
-  onCheckboxChange = () => {
-    this.toggleSelection();
-  };
-  toggleSelection() {
-    const {
-      selectable,
-      selected,
-      onSelect
-    } = this.props;
-    if (selectable) {
-      onSelect(!selected);
+var Title = /*#__PURE__*/function (_PureComponent) {
+  _inherits(Title, _PureComponent);
+  var _super = _createSuper(Title);
+  function Title() {
+    var _this;
+    _classCallCheck(this, Title);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
     }
-  }
-  render() {
-    const {
-      className,
-      title,
-      offset,
-      showFocus,
-      innerRef,
-      selectable,
-      selected,
-      collapserExpander
-    } = this.props;
-    const classes = classNames(className, {
-      [modules_09d014b4.title]: true,
-      [modules_09d014b4.titleFocused]: showFocus,
-      [modules_09d014b4.titleSelected]: selected
+    _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "id", getUID('data-list-title'));
+    _defineProperty(_assertThisInitialized(_this), "onCheckboxFocus", function () {
+      _this.props.onFocusRestore();
+    });
+    _defineProperty(_assertThisInitialized(_this), "onCheckboxChange", function () {
+      _this.toggleSelection();
     });
-    return /*#__PURE__*/React.createElement("div", {
-      id: this.id,
-      className: classes,
-      style: {
-        paddingLeft: offset
-      },
-      ref: innerRef
-    }, /*#__PURE__*/React.createElement("div", {
-      className: modules_09d014b4.boxes
-    }, selectable && /*#__PURE__*/React.createElement("div", {
-      className: modules_09d014b4.checkboxBox
-    }, /*#__PURE__*/React.createElement(Checkbox, {
-      "aria-labelledby": this.id,
-      className: showFocus ? 'ring-checkbox_focus' : '',
-      checked: selected,
-      onFocus: this.onCheckboxFocus,
-      onChange: this.onCheckboxChange,
-      tabIndex: -1
-    })), collapserExpander), title);
+    return _this;
   }
-}
+  _createClass(Title, [{
+    key: "toggleSelection",
+    value: function toggleSelection() {
+      var _this$props = this.props,
+        selectable = _this$props.selectable,
+        selected = _this$props.selected,
+        onSelect = _this$props.onSelect;
+      if (selectable) {
+        onSelect(!selected);
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _classNames;
+      var _this$props2 = this.props,
+        className = _this$props2.className,
+        title = _this$props2.title,
+        offset = _this$props2.offset,
+        showFocus = _this$props2.showFocus,
+        innerRef = _this$props2.innerRef,
+        selectable = _this$props2.selectable,
+        selected = _this$props2.selected,
+        collapserExpander = _this$props2.collapserExpander;
+      var classes = classNames(className, (_classNames = {}, _defineProperty(_classNames, modules_09d014b4.title, true), _defineProperty(_classNames, modules_09d014b4.titleFocused, showFocus), _defineProperty(_classNames, modules_09d014b4.titleSelected, selected), _classNames));
+      return /*#__PURE__*/React.createElement("div", {
+        id: this.id,
+        className: classes,
+        style: {
+          paddingLeft: offset
+        },
+        ref: innerRef
+      }, /*#__PURE__*/React.createElement("div", {
+        className: modules_09d014b4.boxes
+      }, selectable && /*#__PURE__*/React.createElement("div", {
+        className: modules_09d014b4.checkboxBox
+      }, /*#__PURE__*/React.createElement(Checkbox, {
+        "aria-labelledby": this.id,
+        className: showFocus ? 'ring-checkbox_focus' : '',
+        checked: selected,
+        onFocus: this.onCheckboxFocus,
+        onChange: this.onCheckboxChange,
+        tabIndex: -1
+      })), collapserExpander), title);
+    }
+  }]);
+  return Title;
+}(PureComponent);
+_defineProperty(Title, "defaultProps", {
+  selectable: false,
+  selected: false,
+  showFocus: false
+});
 Title.propTypes = {
   className: PropTypes.string,
   title: PropTypes.node,

package/dist/alert/alert.js

@@ -1,3 +1,6 @@
+import { c as _defineProperty, j as _inherits, k as _createSuper, b as _classCallCheck, m as _assertThisInitialized, _ as _createClass } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.array.concat.js';
+import 'core-js/modules/es.object.values.js';
 import React, { PureComponent } from 'react';
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
@@ -13,12 +16,28 @@ import { Button } from '../button/button.js';
 import { T as Theme, a as ThemeProvider } from '../_helpers/theme.js';
 export { default as Container } from './container.js';
 import { Color } from '../icon/icon__constants.js';
-import '../_helpers/_rollupPluginBabelHelpers.js';
 import 'util-deprecate';
 import '../_helpers/icon.js';
 import '../icon/icon__svg.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.replace.js';
+import 'core-js/modules/es.string.starts-with.js';
 import '../global/memoize.js';
+import 'core-js/modules/es.array.iterator.js';
+import 'core-js/modules/es.map.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/es.string.iterator.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/es.weak-map.js';
 import '../_helpers/loader-inline.js';
+import 'core-js/modules/es.array.reduce.js';
+import 'core-js/modules/es.object.entries.js';
+import 'core-js/modules/es.object.assign.js';
+import 'core-js/modules/web.dom-collections.for-each.js';
+import 'core-js/modules/es.array.filter.js';
+import 'core-js/modules/es.string.split.js';
+import 'core-js/modules/es.object.keys.js';
+import 'core-js/modules/es.set.js';
 import '@jetbrains/icons/chevron-10px';
 import '../link/clickableLink.js';
 import '../global/controls-height.js';
@@ -26,20 +45,30 @@ import '../_helpers/button__classes.js';
 import 'react-dom';
 import '../popup/popup.target.js';
 import '../popup/popup.js';
+import 'core-js/modules/es.regexp.to-string.js';
 import '../global/get-uid.js';
 import '../global/schedule-raf.js';
 import '../shortcuts/shortcuts.js';
+import 'core-js/modules/es.array.map.js';
 import '../shortcuts/core.js';
+import 'core-js/modules/es.array.includes.js';
+import 'core-js/modules/es.string.includes.js';
+import 'core-js/modules/es.array.slice.js';
+import 'core-js/modules/es.array.splice.js';
+import 'core-js/modules/es.string.match.js';
+import 'core-js/modules/es.array.find-index.js';
 import 'combokeys';
 import '../global/sniffer.js';
 import 'sniffr';
 import '../tab-trap/tab-trap.js';
 import '../popup/position.js';
+import 'core-js/modules/es.array.sort.js';
 import '../popup/popup.consts.js';
 
 var modules_e02b3280 = {"link":"link_rui_d382","unit":"i__const_unit_1","animation-duration":"300ms","animation-easing":"ease-out","light":"light_rui_2ac4","alert":"alert_rui_2b32","alertInline":"alertInline_rui_2b32","error":"error_rui_2b32","icon":"icon_rui_2b32","caption":"caption_rui_2b32","withCloseButton":"withCloseButton_rui_2b32","badge":"badge_rui_2b32","loader":"loader_rui_2b32","close":"close_rui_2b32","animationOpen":"animationOpen_rui_2b32","show":"show_rui_2b32","animationClosing":"animationClosing_rui_2b32","animationShaking":"animationShaking_rui_2b32","shaking":"shaking_rui_2b32"};
 
-const ANIMATION_TIME = 500;
+var _TypeToIcon, _TypeToIconColor;
+var ANIMATION_TIME = 500;
 /**
  * @name Alert
  */
@@ -59,20 +88,12 @@ var AlertType;
  * Lookup table of alert type to icon modifier.
  * @type {Object.<AlertType, string>}
  */
-const TypeToIcon = {
-  [AlertType.ERROR]: exceptionIcon,
-  [AlertType.SUCCESS]: checkmarkIcon,
-  [AlertType.WARNING]: warningIcon
-};
+var TypeToIcon = (_TypeToIcon = {}, _defineProperty(_TypeToIcon, AlertType.ERROR, exceptionIcon), _defineProperty(_TypeToIcon, AlertType.SUCCESS, checkmarkIcon), _defineProperty(_TypeToIcon, AlertType.WARNING, warningIcon), _TypeToIcon);
 /**
  * Lookup table of alert type to icon color.
  * @type {Object.<AlertType, Icon.Color>}
  */
-const TypeToIconColor = {
-  [AlertType.ERROR]: Color.RED,
-  [AlertType.SUCCESS]: Color.GREEN,
-  [AlertType.WARNING]: Color.WHITE
-};
+var TypeToIconColor = (_TypeToIconColor = {}, _defineProperty(_TypeToIconColor, AlertType.ERROR, Color.RED), _defineProperty(_TypeToIconColor, AlertType.SUCCESS, Color.GREEN), _defineProperty(_TypeToIconColor, AlertType.WARNING, Color.WHITE), _TypeToIconColor);
 /**
  * @constructor
  * @name Alert
@@ -81,162 +102,182 @@ const TypeToIconColor = {
 /**
  * **Alert** is a component for displaying contextual notifications. If you want to display a stack of notifications, use **Alerts** instead.
  */
-class Alert extends PureComponent {
-  static propTypes = {
-    timeout: PropTypes.number,
+var Alert = /*#__PURE__*/function (_PureComponent) {
+  _inherits(Alert, _PureComponent);
+  var _super = _createSuper(Alert);
+  function Alert() {
+    var _this;
+    _classCallCheck(this, Alert);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "state", {
+      height: null
+    });
+    _defineProperty(_assertThisInitialized(_this), "node", void 0);
+    _defineProperty(_assertThisInitialized(_this), "hideTimeout", void 0);
+    _defineProperty(_assertThisInitialized(_this), "closeRequest", function (event) {
+      _this.startCloseAnimation();
+      return _this.props.onCloseRequest(event);
+    });
+    _defineProperty(_assertThisInitialized(_this), "startCloseAnimation", function () {
+      var height = getRect(_this.node).height;
+      _this.setState({
+        height: height
+      });
+    });
     /**
-     * Fires when alert starts closing if timeout is out or user clicks "Close" button
+     * @param {SyntheticEvent} evt
+     * @private
      */
-    onCloseRequest: PropTypes.func,
-    onClose: PropTypes.func,
-    isShaking: PropTypes.bool,
-    isClosing: PropTypes.bool,
+    _defineProperty(_assertThisInitialized(_this), "_handleCaptionsLinksClick", function (evt) {
+      if (evt.target instanceof Element && evt.target.matches('a')) {
+        _this.closeRequest(evt);
+      }
+    });
+    _defineProperty(_assertThisInitialized(_this), "storeAlertRef", function (node) {
+      _this.node = node;
+    });
+    return _this;
+  }
+  _createClass(Alert, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      if (this.props.timeout > 0) {
+        this.hideTimeout = window.setTimeout(this.closeRequest, this.props.timeout);
+      }
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate() {
+      if (this.props.isClosing) {
+        this._close();
+      }
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      clearTimeout(this.hideTimeout);
+    }
+  }, {
+    key: "_close",
+    value: function _close() {
+      var _this2 = this;
+      this.startCloseAnimation();
+      setTimeout(function () {
+        _this2.props.onClose();
+      }, ANIMATION_TIME);
+    }
+  }, {
+    key: "_getCaption",
+    value:
     /**
-     * Whether an alert is rendered inside an **Alerts** container
-     * or standalone.
+     * @private
      */
-    inline: PropTypes.bool,
-    showWithAnimation: PropTypes.bool,
-    closeable: PropTypes.bool,
-    type: PropTypes.oneOf(Object.values(AlertType)),
-    children: PropTypes.node,
-    className: PropTypes.string,
-    captionClassName: PropTypes.string,
-    closeButtonClassName: PropTypes.string,
-    'data-test': PropTypes.string
-  };
-  /** @override */
-  static defaultProps = {
-    theme: Theme.DARK,
-    closeable: true,
-    showWithAnimation: true,
-    type: AlertType.MESSAGE,
-    inline: true,
-    isClosing: false,
-    isShaking: false,
-    timeout: 0,
-    onClose: () => {},
-    onCloseRequest: () => {}
-  };
-  state = {
-    height: null
-  };
-  componentDidMount() {
-    if (this.props.timeout > 0) {
-      this.hideTimeout = window.setTimeout(this.closeRequest, this.props.timeout);
+    function _getCaption() {
+      return /*#__PURE__*/React.createElement("span", {
+        className: classNames(modules_e02b3280.caption, this.props.captionClassName, _defineProperty({}, modules_e02b3280.withCloseButton, this.props.closeable)),
+        onClick: this._handleCaptionsLinksClick
+        // We only process clicks on `a` elements, see above
+        ,
+        role: "presentation"
+      }, this.props.children);
     }
-  }
-  componentDidUpdate() {
-    if (this.props.isClosing) {
-      this._close();
+    /**
+     * @private
+     * @return {XML|string}
+     */
+  }, {
+    key: "_getIcon",
+    value: function _getIcon() {
+      var glyph = TypeToIcon[this.props.type];
+      if (glyph) {
+        return /*#__PURE__*/React.createElement(Icon, {
+          glyph: glyph,
+          className: modules_e02b3280.icon,
+          color: TypeToIconColor[this.props.type] || Color.DEFAULT
+        });
+      } else if (this.props.type === AlertType.LOADING) {
+        return /*#__PURE__*/React.createElement(LoaderInline, {
+          className: modules_e02b3280.loader
+        });
+      }
+      return '';
     }
-  }
-  componentWillUnmount() {
-    clearTimeout(this.hideTimeout);
-  }
-  node;
-  hideTimeout;
-  static Type = AlertType;
-  closeRequest = event => {
-    this.startCloseAnimation();
-    return this.props.onCloseRequest(event);
-  };
-  startCloseAnimation = () => {
-    const height = getRect(this.node).height;
-    this.setState({
-      height
-    });
-  };
-  _close() {
-    this.startCloseAnimation();
-    setTimeout(() => {
-      this.props.onClose();
-    }, ANIMATION_TIME);
-  }
-  /**
-   * @param {SyntheticEvent} evt
-   * @private
-   */
-  _handleCaptionsLinksClick = evt => {
-    if (evt.target instanceof Element && evt.target.matches('a')) {
-      this.closeRequest(evt);
+  }, {
+    key: "render",
+    value: function render() {
+      var _classNames2;
+      var _this$props = this.props,
+        type = _this$props.type,
+        inline = _this$props.inline,
+        isClosing = _this$props.isClosing,
+        isShaking = _this$props.isShaking,
+        closeButtonClassName = _this$props.closeButtonClassName,
+        showWithAnimation = _this$props.showWithAnimation,
+        className = _this$props.className,
+        dataTest = _this$props['data-test'],
+        theme = _this$props.theme;
+      var classes = classNames(className, (_classNames2 = {}, _defineProperty(_classNames2, modules_e02b3280.alert, true), _defineProperty(_classNames2, modules_e02b3280.animationOpen, showWithAnimation), _defineProperty(_classNames2, modules_e02b3280.error, type === 'error'), _defineProperty(_classNames2, modules_e02b3280.alertInline, inline), _defineProperty(_classNames2, modules_e02b3280.animationClosing, isClosing), _defineProperty(_classNames2, modules_e02b3280.animationShaking, isShaking), _classNames2));
+      var height = this.state.height;
+      var style = height ? {
+        marginBottom: -height
+      } : undefined;
+      return /*#__PURE__*/React.createElement(ThemeProvider, {
+        theme: theme,
+        className: classes,
+        "data-test": joinDataTestAttributes('alert', dataTest),
+        "data-test-type": type,
+        style: style,
+        ref: this.storeAlertRef
+      }, this._getIcon(), this._getCaption(), this.props.closeable ? /*#__PURE__*/React.createElement(Button, {
+        icon: closeIcon,
+        className: classNames(modules_e02b3280.close, closeButtonClassName),
+        "data-test": "alert-close",
+        "aria-label": "close alert",
+        onClick: this.closeRequest
+      }) : '');
     }
-  };
+  }]);
+  return Alert;
+}(PureComponent);
+_defineProperty(Alert, "propTypes", {
+  timeout: PropTypes.number,
   /**
-   * @private
+   * Fires when alert starts closing if timeout is out or user clicks "Close" button
    */
-  _getCaption() {
-    return /*#__PURE__*/React.createElement("span", {
-      className: classNames(modules_e02b3280.caption, this.props.captionClassName, {
-        [modules_e02b3280.withCloseButton]: this.props.closeable
-      }),
-      onClick: this._handleCaptionsLinksClick
-      // We only process clicks on `a` elements, see above
-      ,
-      role: "presentation"
-    }, this.props.children);
-  }
+  onCloseRequest: PropTypes.func,
+  onClose: PropTypes.func,
+  isShaking: PropTypes.bool,
+  isClosing: PropTypes.bool,
   /**
-   * @private
-   * @return {XML|string}
+   * Whether an alert is rendered inside an **Alerts** container
+   * or standalone.
    */
-  _getIcon() {
-    const glyph = TypeToIcon[this.props.type];
-    if (glyph) {
-      return /*#__PURE__*/React.createElement(Icon, {
-        glyph: glyph,
-        className: modules_e02b3280.icon,
-        color: TypeToIconColor[this.props.type] || Color.DEFAULT
-      });
-    } else if (this.props.type === AlertType.LOADING) {
-      return /*#__PURE__*/React.createElement(LoaderInline, {
-        className: modules_e02b3280.loader
-      });
-    }
-    return '';
-  }
-  storeAlertRef = node => {
-    this.node = node;
-  };
-  render() {
-    const {
-      type,
-      inline,
-      isClosing,
-      isShaking,
-      closeButtonClassName,
-      showWithAnimation,
-      className,
-      'data-test': dataTest,
-      theme
-    } = this.props;
-    const classes = classNames(className, {
-      [modules_e02b3280.alert]: true,
-      [modules_e02b3280.animationOpen]: showWithAnimation,
-      [modules_e02b3280.error]: type === 'error',
-      [modules_e02b3280.alertInline]: inline,
-      [modules_e02b3280.animationClosing]: isClosing,
-      [modules_e02b3280.animationShaking]: isShaking
-    });
-    const height = this.state.height;
-    const style = height ? {
-      marginBottom: -height
-    } : undefined;
-    return /*#__PURE__*/React.createElement(ThemeProvider, {
-      theme: theme,
-      className: classes,
-      "data-test": joinDataTestAttributes('alert', dataTest),
-      "data-test-type": type,
-      style: style,
-      ref: this.storeAlertRef
-    }, this._getIcon(), this._getCaption(), this.props.closeable ? /*#__PURE__*/React.createElement(Button, {
-      icon: closeIcon,
-      className: classNames(modules_e02b3280.close, closeButtonClassName),
-      "data-test": "alert-close",
-      "aria-label": "close alert",
-      onClick: this.closeRequest
-    }) : '');
-  }
-}
+  inline: PropTypes.bool,
+  showWithAnimation: PropTypes.bool,
+  closeable: PropTypes.bool,
+  type: PropTypes.oneOf(Object.values(AlertType)),
+  children: PropTypes.node,
+  className: PropTypes.string,
+  captionClassName: PropTypes.string,
+  closeButtonClassName: PropTypes.string,
+  'data-test': PropTypes.string
+});
+/** @override */
+_defineProperty(Alert, "defaultProps", {
+  theme: Theme.DARK,
+  closeable: true,
+  showWithAnimation: true,
+  type: AlertType.MESSAGE,
+  inline: true,
+  isClosing: false,
+  isShaking: false,
+  timeout: 0,
+  onClose: function onClose() {},
+  onCloseRequest: function onCloseRequest() {}
+});
+_defineProperty(Alert, "Type", AlertType);
 
 export { ANIMATION_TIME, AlertType, Alert as default };

package/dist/alert/container.js

@@ -1,41 +1,52 @@
-import { _ as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
-import React, { PureComponent, Children, isValidElement, cloneElement } from 'react';
+import { c as _defineProperty, j as _inherits, k as _createSuper, b as _classCallCheck, _ as _createClass, h as _objectWithoutProperties, i as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.array.map.js';
+import React, { Children, isValidElement, cloneElement, PureComponent } from 'react';
 import { createPortal } from 'react-dom';
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
 
 var modules_fc8df42d = {"unit":"i__const_unit_0","light":"light_rui_2ac4","alertContainer":"alertContainer_rui_a9a3","alertInContainer":"alertInContainer_rui_a9a3 alert_rui_2b32"};
 
-class Alerts extends PureComponent {
-  static propTypes = {
-    children: PropTypes.node,
-    className: PropTypes.string
-  };
-  render() {
-    const {
-      children,
-      className,
-      ...restProps
-    } = this.props;
-    const classes = classNames(modules_fc8df42d.alertContainer, className);
-    const show = Children.count(children) > 0;
-    if (!show) {
-      return null;
-    }
-    return /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement("div", _extends({
-      "data-test": "alert-container",
-      className: classes,
-      "aria-live": "polite"
-    }, restProps), Children.map(children, child => {
-      if (! /*#__PURE__*/isValidElement(child)) {
-        return child;
-      }
-      const alertClassNames = classNames(modules_fc8df42d.alertInContainer, child.props.className);
-      return /*#__PURE__*/cloneElement(child, {
-        className: alertClassNames
-      });
-    })), document.body);
+var _excluded = ["children", "className"];
+var Alerts = /*#__PURE__*/function (_PureComponent) {
+  _inherits(Alerts, _PureComponent);
+  var _super = _createSuper(Alerts);
+  function Alerts() {
+    _classCallCheck(this, Alerts);
+    return _super.apply(this, arguments);
   }
-}
+  _createClass(Alerts, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        children = _this$props.children,
+        className = _this$props.className,
+        restProps = _objectWithoutProperties(_this$props, _excluded);
+      var classes = classNames(modules_fc8df42d.alertContainer, className);
+      var show = Children.count(children) > 0;
+      if (!show) {
+        return null;
+      }
+      return /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement("div", _extends({
+        "data-test": "alert-container",
+        className: classes,
+        "aria-live": "polite"
+      }, restProps), Children.map(children, function (child) {
+        if (! /*#__PURE__*/isValidElement(child)) {
+          return child;
+        }
+        var alertClassNames = classNames(modules_fc8df42d.alertInContainer, child.props.className);
+        return /*#__PURE__*/cloneElement(child, {
+          className: alertClassNames
+        });
+      })), document.body);
+    }
+  }]);
+  return Alerts;
+}(PureComponent);
+_defineProperty(Alerts, "propTypes", {
+  children: PropTypes.node,
+  className: PropTypes.string
+});
 
 export { Alerts as default };