@jetbrains/ring-ui-built 6.0.32 → 6.0.33

package/components/_helpers/select__filter.js

@@ -1,4 +1,7 @@
-import { _ as _extends } from './_rollupPluginBabelHelpers.js';
+import { _ as _defineProperty, a as _inherits, b as _createClass, c as _objectWithoutProperties, e as _extends, f as _classCallCheck, g as _callSuper } from './_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.array.concat.js';
+import 'core-js/modules/es.array.filter.js';
+import 'core-js/modules/es.object.to-string.js';
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
@@ -9,57 +12,75 @@ import { I18nContext } from '../i18n/i18n-context.js';
 
 var modules_b607bec2 = {"filterWithTagsFocused":"filterWithTagsFocused_rui_4b23","light":"light_rui_2ac4","filterWithTags":"filterWithTags_rui_4b23","filterWrapper":"filterWrapper_rui_4b23","filterWithTagsInput":"filterWithTagsInput_rui_4b23","filter":"filter_rui_4b23","popup":"popup_rui_4b23","filterIcon":"filterIcon_rui_4b23","bottomLine":"bottomLine_rui_4b23","bottomLineOverItem":"bottomLineOverItem_rui_4b23","message":"message_rui_4b23","selectAll":"selectAll_rui_4b23"};
 
+var _excluded = ["className", "listId"];
 function noop() {}
-class SelectFilter extends Component {
-  static defaultProps = {
-    inputRef: noop
-  };
-  componentWillUnmount() {
-    this.blur();
-  }
-  focus() {
-    const {
-      input
-    } = this;
-    if (input && input !== document.activeElement) {
-      sniffr.browser.name === 'firefox' ? input.select() : input.focus();
+var SelectFilter = /*#__PURE__*/function (_Component) {
+  function SelectFilter() {
+    var _this;
+    _classCallCheck(this, SelectFilter);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
     }
+    _this = _callSuper(this, SelectFilter, [].concat(args));
+    _defineProperty(_this, "input", void 0);
+    _defineProperty(_this, "inputRef", function (el) {
+      _this.input = el;
+      _this.props.inputRef(el);
+    });
+    return _this;
   }
-  blur() {
-    if (this.input && this.input === document.activeElement) {
-      this.input.blur();
+  _inherits(SelectFilter, _Component);
+  return _createClass(SelectFilter, [{
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      this.blur();
     }
-  }
-  input;
-  inputRef = el => {
-    this.input = el;
-    this.props.inputRef(el);
-  };
-  render() {
-    const {
-      className,
-      listId,
-      ...restProps
-    } = this.props;
-    const classes = classNames(modules_b607bec2.filter, className);
-    return /*#__PURE__*/React.createElement(ActiveItemContext.ValueContext.Consumer, null, activeItemId => /*#__PURE__*/React.createElement(I18nContext.Consumer, null, _ref => {
-      var _restProps$placeholde;
-      let {
-        translate
-      } = _ref;
-      return /*#__PURE__*/React.createElement(Input, _extends({}, restProps, {
-        placeholder: (_restProps$placeholde = restProps.placeholder) !== null && _restProps$placeholde !== void 0 ? _restProps$placeholde : translate('filterItems'),
-        "aria-owns": listId,
-        "aria-activedescendant": activeItemId,
-        autoComplete: "off",
-        autoFocus: true,
-        borderless: true,
-        inputRef: this.inputRef,
-        className: classes
-      }));
-    }));
-  }
-}
+  }, {
+    key: "focus",
+    value: function focus() {
+      var input = this.input;
+      if (input && input !== document.activeElement) {
+        sniffr.browser.name === 'firefox' ? input.select() : input.focus();
+      }
+    }
+  }, {
+    key: "blur",
+    value: function blur() {
+      if (this.input && this.input === document.activeElement) {
+        this.input.blur();
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+      var _this$props = this.props,
+        className = _this$props.className,
+        listId = _this$props.listId,
+        restProps = _objectWithoutProperties(_this$props, _excluded);
+      var classes = classNames(modules_b607bec2.filter, className);
+      return /*#__PURE__*/React.createElement(ActiveItemContext.ValueContext.Consumer, null, function (activeItemId) {
+        return /*#__PURE__*/React.createElement(I18nContext.Consumer, null, function (_ref) {
+          var _restProps$placeholde;
+          var translate = _ref.translate;
+          return /*#__PURE__*/React.createElement(Input, _extends({}, restProps, {
+            placeholder: (_restProps$placeholde = restProps.placeholder) !== null && _restProps$placeholde !== void 0 ? _restProps$placeholde : translate('filterItems'),
+            "aria-owns": listId,
+            "aria-activedescendant": activeItemId,
+            autoComplete: "off",
+            autoFocus: true,
+            borderless: true,
+            inputRef: _this2.inputRef,
+            className: classes
+          }));
+        });
+      });
+    }
+  }]);
+}(Component);
+_defineProperty(SelectFilter, "defaultProps", {
+  inputRef: noop
+});
 SelectFilter.propTypes = {
   placeholder: PropTypes.string,
   className: PropTypes.string,

package/components/_helpers/services-link.js

@@ -1,38 +1,46 @@
-import { _ as _extends } from './_rollupPluginBabelHelpers.js';
+import { _ as _defineProperty, a as _inherits, b as _createClass, c as _objectWithoutProperties, e as _extends, f as _classCallCheck, g as _callSuper } from './_rollupPluginBabelHelpers.js';
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 import Link from '../link/link.js';
 
 var modules_74a7bf8b = {"light":"light_rui_2ac4","services":"services_rui_27f4","active":"active_rui_27f4","item":"item_rui_27f4","itemLogo":"itemLogo_rui_27f4","activeItem":"activeItem_rui_27f4 item_rui_27f4 active_rui_27f4","line":"line_rui_27f4","itemStacked":"itemStacked_rui_27f4","activeItemStacked":"activeItemStacked_rui_27f4 itemStacked_rui_27f4 active_rui_27f4"};
 
-class ServicesLink extends PureComponent {
-  static propTypes = {
-    isActive: PropTypes.bool,
-    service: PropTypes.shape({
-      applicationName: PropTypes.string,
-      iconUrl: PropTypes.string,
-      homeUrl: PropTypes.string,
-      name: PropTypes.string
-    })
-  };
-  render() {
-    const {
-      service,
-      ...props
-    } = this.props;
-    return /*#__PURE__*/React.createElement(Link, _extends({
-      target: "_self",
-      href: service.homeUrl
-    }, props), service.iconUrl ? [/*#__PURE__*/React.createElement("span", {
-      key: "icon",
-      className: modules_74a7bf8b.itemLogo,
-      style: {
-        backgroundImage: `url(${service.iconUrl})`
-      }
-    }), /*#__PURE__*/React.createElement("div", {
-      key: "text"
-    }, service.name)] : service.name);
+var _excluded = ["service"];
+var ServicesLink = /*#__PURE__*/function (_PureComponent) {
+  function ServicesLink() {
+    _classCallCheck(this, ServicesLink);
+    return _callSuper(this, ServicesLink, arguments);
   }
-}
+  _inherits(ServicesLink, _PureComponent);
+  return _createClass(ServicesLink, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        service = _this$props.service,
+        props = _objectWithoutProperties(_this$props, _excluded);
+      return /*#__PURE__*/React.createElement(Link, _extends({
+        target: "_self",
+        href: service.homeUrl
+      }, props), service.iconUrl ? [/*#__PURE__*/React.createElement("span", {
+        key: "icon",
+        className: modules_74a7bf8b.itemLogo,
+        style: {
+          backgroundImage: "url(".concat(service.iconUrl, ")")
+        }
+      }), /*#__PURE__*/React.createElement("div", {
+        key: "text"
+      }, service.name)] : service.name);
+    }
+  }]);
+}(PureComponent);
+_defineProperty(ServicesLink, "propTypes", {
+  isActive: PropTypes.bool,
+  service: PropTypes.shape({
+    applicationName: PropTypes.string,
+    iconUrl: PropTypes.string,
+    homeUrl: PropTypes.string,
+    name: PropTypes.string
+  })
+});
 
 export { ServicesLink as S, modules_74a7bf8b as m };

package/components/_helpers/sidebar.js

@@ -1,4 +1,5 @@
-import { _ as _extends } from './_rollupPluginBabelHelpers.js';
+import { _ as _defineProperty, a as _inherits, b as _createClass, c as _objectWithoutProperties, e as _extends, f as _classCallCheck, g as _callSuper } from './_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.array.concat.js';
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
@@ -6,108 +7,115 @@ import { Waypoint } from 'react-waypoint';
 
 var modules_b8a9dd4f = {"extra-small-screen-media":"i__const_extra_small_screen_media_0","small-screen-media":"i__const_small_screen_media_1","sidebarWidth":"calc(var(--ring-unit)*30)","light":"light_rui_2ac4","contentLayout":"contentLayout_rui_6166","contentLayoutContent":"contentLayoutContent_rui_6166","sidebarContainer":"sidebarContainer_rui_6166","sidebarContainerRight":"sidebarContainerRight_rui_6166","sidebar":"sidebar_rui_6166","sidebarRight":"sidebarRight_rui_6166","sidebarFixedTop":"sidebarFixedTop_rui_6166","sidebarFixedBottom":"sidebarFixedBottom_rui_6166","bottomMarker":"bottomMarker_rui_6166","contentLayoutResponsive":"contentLayoutResponsive_rui_6166"};
 
-const ABOVE = 'above';
-const INSIDE = 'inside';
-class Sidebar extends Component {
-  static propTypes = {
-    right: PropTypes.bool,
-    children: PropTypes.node,
-    className: PropTypes.string,
-    containerClassName: PropTypes.string,
-    fixedClassName: PropTypes.string,
-    contentNode: PropTypes.object
-  };
-  state = {
-    topIsOutside: true,
-    bottomIsOutside: true,
-    sidebarVisibleHeight: undefined
-  };
-  sidebarNode;
-  handleTopWaypoint = _ref => {
-    let {
-      currentPosition
-    } = _ref;
-    this.setState({
-      topIsOutside: currentPosition === ABOVE
+var _excluded = ["right", "children", "className", "containerClassName", "fixedClassName", "contentNode"];
+var ABOVE = 'above';
+var INSIDE = 'inside';
+var Sidebar = /*#__PURE__*/function (_Component) {
+  function Sidebar() {
+    var _this;
+    _classCallCheck(this, Sidebar);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _callSuper(this, Sidebar, [].concat(args));
+    _defineProperty(_this, "state", {
+      topIsOutside: true,
+      bottomIsOutside: true,
+      sidebarVisibleHeight: undefined
     });
-  };
-  handleBottomWaypoint = _ref2 => {
-    let {
-      currentPosition,
-      waypointTop
-    } = _ref2;
-    this.setState({
-      sidebarVisibleHeight: waypointTop,
-      bottomIsOutside: currentPosition !== INSIDE
+    _defineProperty(_this, "sidebarNode", void 0);
+    _defineProperty(_this, "handleTopWaypoint", function (_ref) {
+      var currentPosition = _ref.currentPosition;
+      _this.setState({
+        topIsOutside: currentPosition === ABOVE
+      });
     });
-  };
-  shouldUseFixation() {
-    const {
-      contentNode
-    } = this.props;
-    const {
-      sidebarNode
-    } = this;
-    if (!contentNode || !sidebarNode) {
-      return false;
-    }
-    return contentNode.offsetHeight >= sidebarNode.offsetHeight;
-  }
-  shouldFixateBottom() {
-    const {
-      topIsOutside,
-      bottomIsOutside
-    } = this.state;
-    return !bottomIsOutside && topIsOutside && this.shouldUseFixation();
-  }
-  sidebarRef = node => {
-    this.sidebarNode = node;
-  };
-  render() {
-    const {
-      right,
-      children,
-      className,
-      containerClassName,
-      fixedClassName,
-      contentNode,
-      ...restProps
-    } = this.props;
-    const {
-      topIsOutside,
-      bottomIsOutside,
-      sidebarVisibleHeight
-    } = this.state;
-    const shouldFixateTop = bottomIsOutside && topIsOutside && this.shouldUseFixation();
-    const shouldFixateBottom = this.shouldFixateBottom();
-    const containerClasses = classNames(modules_b8a9dd4f.sidebarContainer, containerClassName, {
-      [modules_b8a9dd4f.sidebarContainerRight]: right
+    _defineProperty(_this, "handleBottomWaypoint", function (_ref2) {
+      var currentPosition = _ref2.currentPosition,
+        waypointTop = _ref2.waypointTop;
+      _this.setState({
+        sidebarVisibleHeight: waypointTop,
+        bottomIsOutside: currentPosition !== INSIDE
+      });
     });
-    const classes = classNames(modules_b8a9dd4f.sidebar, className, {
-      [modules_b8a9dd4f.sidebarRight]: right,
-      [modules_b8a9dd4f.sidebarFixedTop]: shouldFixateTop,
-      [modules_b8a9dd4f.sidebarFixedBottom]: shouldFixateBottom,
-      [fixedClassName !== null && fixedClassName !== void 0 ? fixedClassName : '']: shouldFixateTop || shouldFixateBottom
+    _defineProperty(_this, "sidebarRef", function (node) {
+      _this.sidebarNode = node;
     });
-    const style = {
-      maxHeight: shouldFixateBottom && sidebarVisibleHeight ? `${sidebarVisibleHeight}px` : undefined
-    };
-    return /*#__PURE__*/React.createElement("aside", {
-      className: containerClasses,
-      ref: this.sidebarRef
-    }, /*#__PURE__*/React.createElement(Waypoint, {
-      onEnter: this.handleTopWaypoint,
-      onLeave: this.handleTopWaypoint
-    }), /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-      style: style,
-      className: classes
-    }), children), /*#__PURE__*/React.createElement("div", {
-      className: modules_b8a9dd4f.bottomMarker
-    }, /*#__PURE__*/React.createElement(Waypoint, {
-      onEnter: this.handleBottomWaypoint,
-      onLeave: this.handleBottomWaypoint
-    })));
+    return _this;
   }
-}
+  _inherits(Sidebar, _Component);
+  return _createClass(Sidebar, [{
+    key: "shouldUseFixation",
+    value: function shouldUseFixation() {
+      var contentNode = this.props.contentNode;
+      var sidebarNode = this.sidebarNode;
+      if (!contentNode || !sidebarNode) {
+        return false;
+      }
+      return contentNode.offsetHeight >= sidebarNode.offsetHeight;
+    }
+  }, {
+    key: "shouldFixateBottom",
+    value: function shouldFixateBottom() {
+      var _this$state = this.state,
+        topIsOutside = _this$state.topIsOutside,
+        bottomIsOutside = _this$state.bottomIsOutside;
+      return !bottomIsOutside && topIsOutside && this.shouldUseFixation();
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        right = _this$props.right,
+        children = _this$props.children,
+        className = _this$props.className,
+        containerClassName = _this$props.containerClassName,
+        fixedClassName = _this$props.fixedClassName;
+        _this$props.contentNode;
+        var restProps = _objectWithoutProperties(_this$props, _excluded);
+      var _this$state2 = this.state,
+        topIsOutside = _this$state2.topIsOutside,
+        bottomIsOutside = _this$state2.bottomIsOutside,
+        sidebarVisibleHeight = _this$state2.sidebarVisibleHeight;
+      var shouldFixateTop = bottomIsOutside && topIsOutside && this.shouldUseFixation();
+      var shouldFixateBottom = this.shouldFixateBottom();
+      var containerClasses = classNames(modules_b8a9dd4f.sidebarContainer, containerClassName, {
+        [modules_b8a9dd4f.sidebarContainerRight]: right
+      });
+      var classes = classNames(modules_b8a9dd4f.sidebar, className, {
+        [modules_b8a9dd4f.sidebarRight]: right,
+        [modules_b8a9dd4f.sidebarFixedTop]: shouldFixateTop,
+        [modules_b8a9dd4f.sidebarFixedBottom]: shouldFixateBottom,
+        [fixedClassName !== null && fixedClassName !== void 0 ? fixedClassName : '']: shouldFixateTop || shouldFixateBottom
+      });
+      var style = {
+        maxHeight: shouldFixateBottom && sidebarVisibleHeight ? "".concat(sidebarVisibleHeight, "px") : undefined
+      };
+      return /*#__PURE__*/React.createElement("aside", {
+        className: containerClasses,
+        ref: this.sidebarRef
+      }, /*#__PURE__*/React.createElement(Waypoint, {
+        onEnter: this.handleTopWaypoint,
+        onLeave: this.handleTopWaypoint
+      }), /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
+        style: style,
+        className: classes
+      }), children), /*#__PURE__*/React.createElement("div", {
+        className: modules_b8a9dd4f.bottomMarker
+      }, /*#__PURE__*/React.createElement(Waypoint, {
+        onEnter: this.handleBottomWaypoint,
+        onLeave: this.handleBottomWaypoint
+      })));
+    }
+  }]);
+}(Component);
+_defineProperty(Sidebar, "propTypes", {
+  right: PropTypes.bool,
+  children: PropTypes.node,
+  className: PropTypes.string,
+  containerClassName: PropTypes.string,
+  fixedClassName: PropTypes.string,
+  contentNode: PropTypes.object
+});
 
 export { Sidebar as S, modules_b8a9dd4f as m };

package/components/_helpers/tab-link.js

@@ -1,17 +1,17 @@
+import { c as _objectWithoutProperties } from './_rollupPluginBabelHelpers.js';
 import React, { memo } from 'react';
 import PropTypes from 'prop-types';
 import Link from '../link/link.js';
 
 var modules_02138f4a = {"dark":"dark_rui_f090","line-shadow":"inset 0 -1px 0 0","selected-line-shadow":"inset 0 -2px 0 0","light":"light_rui_2ac4","link":"link_rui_fa1d","withLinks":"withLinks_rui_fa1d","hover":"hover_rui_fa1d","pseudo":"pseudo_rui_fa1d","active":"active_rui_fa1d","inherit":"inherit_rui_fa1d","tabs":"tabs_rui_fa1d font_rui_f295","titles":"titles_rui_fa1d","title":"title_rui_fa1d font_rui_f295","selected":"selected_rui_fa1d","collapsed":"collapsed_rui_fa1d","titleLegacy":"titleLegacy_rui_fa1d","visible":"visible_rui_fa1d","container":"container_rui_fa1d","hidden":"hidden_rui_fa1d","hiddenBold":"hiddenBold_rui_fa1d","hiddenRegular":"hiddenRegular_rui_fa1d","tabCounter":"tabCounter_rui_fa1d","autoCollapseContainer":"autoCollapseContainer_rui_fa1d","autoCollapse":"autoCollapse_rui_fa1d","rendered":"rendered_rui_fa1d","adjusted":"adjusted_rui_fa1d","measure":"measure_rui_fa1d","morePopup":"morePopup_rui_fa1d","chevron":"chevron_rui_fa1d","morePopupBeforeEnd":"morePopupBeforeEnd_rui_fa1d"};
 
+var _excluded = ["isSelected", "title", "collapsed"];
 function TabLink(_ref) {
-  let {
-    isSelected,
-    title,
-    collapsed,
-    ...restProps
-  } = _ref;
-  const renderedTitle = typeof title === 'function' ? title(isSelected, collapsed) : title;
+  var isSelected = _ref.isSelected,
+    title = _ref.title,
+    collapsed = _ref.collapsed,
+    restProps = _objectWithoutProperties(_ref, _excluded);
+  var renderedTitle = typeof title === 'function' ? title(isSelected, collapsed) : title;
   return /*#__PURE__*/React.createElement(Link, restProps, /*#__PURE__*/React.createElement("div", {
     className: modules_02138f4a.container
   }, /*#__PURE__*/React.createElement("span", {

package/components/_helpers/theme.js

@@ -1,4 +1,4 @@
-import { _ as _extends } from './_rollupPluginBabelHelpers.js';
+import { j as _slicedToArray, c as _objectWithoutProperties, e as _extends } from './_rollupPluginBabelHelpers.js';
 import React, { useState, useEffect, forwardRef, useMemo, useContext } from 'react';
 import classNames from 'classnames';
 import { createPortal } from 'react-dom';
@@ -10,36 +10,42 @@ var modules_6381a4b3 = {"light":"light_rui_2ac4"};
 
 var modules_59717246 = {"dark":"dark_rui_f090"};
 
+var _excluded = ["theme", "className", "passToPopups", "children", "target"];
 var Theme;
 (function (Theme) {
   Theme["AUTO"] = "auto";
   Theme["LIGHT"] = "light";
   Theme["DARK"] = "dark";
 })(Theme || (Theme = {}));
-const darkMatcher = window.matchMedia('(prefers-color-scheme: dark)');
+var darkMatcher = window.matchMedia('(prefers-color-scheme: dark)');
 function useTheme() {
-  const [dark, setDark] = useState(darkMatcher.matches);
-  useEffect(() => {
-    const onChange = e => setDark(e.matches);
+  var _useState = useState(darkMatcher.matches),
+    _useState2 = _slicedToArray(_useState, 2),
+    dark = _useState2[0],
+    setDark = _useState2[1];
+  useEffect(function () {
+    var onChange = function onChange(e) {
+      return setDark(e.matches);
+    };
     darkMatcher.addEventListener('change', onChange);
-    return () => darkMatcher.removeEventListener('change', onChange);
+    return function () {
+      return darkMatcher.removeEventListener('change', onChange);
+    };
   }, []);
   return dark ? Theme.DARK : Theme.LIGHT;
 }
 function useThemeClasses(theme) {
-  const systemTheme = useTheme();
-  const resolvedTheme = theme === Theme.AUTO ? systemTheme : theme;
+  var systemTheme = useTheme();
+  var resolvedTheme = theme === Theme.AUTO ? systemTheme : theme;
   return classNames({
     [modules_59717246.dark]: resolvedTheme === Theme.DARK,
     [modules_6381a4b3.light]: resolvedTheme === Theme.LIGHT
   });
 }
 function WithThemeClasses(_ref) {
-  let {
-    theme,
-    children
-  } = _ref;
-  const themeClasses = useThemeClasses(theme);
+  var theme = _ref.theme,
+    children = _ref.children;
+  var themeClasses = useThemeClasses(theme);
   return children(themeClasses);
 }
 function applyTheme(theme, container) {
@@ -53,33 +59,36 @@ function applyTheme(theme, container) {
     container.classList.add(modules_6381a4b3.light);
   }
 }
-const ThemeProvider = /*#__PURE__*/forwardRef(function ThemeProvider(_ref2, ref) {
-  let {
-    theme = Theme.AUTO,
-    className,
-    passToPopups,
-    children,
-    target,
-    ...restProps
-  } = _ref2;
-  const systemTheme = useTheme();
-  const resolvedTheme = theme === Theme.AUTO ? systemTheme : theme;
-  const id = useMemo(() => getUID('popups-with-theme-'), []);
-  useEffect(() => {
+var ThemeProvider = /*#__PURE__*/forwardRef(function ThemeProvider(_ref2, ref) {
+  var _ref2$theme = _ref2.theme,
+    theme = _ref2$theme === void 0 ? Theme.AUTO : _ref2$theme,
+    className = _ref2.className,
+    passToPopups = _ref2.passToPopups,
+    children = _ref2.children,
+    target = _ref2.target,
+    restProps = _objectWithoutProperties(_ref2, _excluded);
+  var systemTheme = useTheme();
+  var resolvedTheme = theme === Theme.AUTO ? systemTheme : theme;
+  var id = useMemo(function () {
+    return getUID('popups-with-theme-');
+  }, []);
+  useEffect(function () {
     if (target != null) {
       applyTheme(resolvedTheme, target);
     }
   }, [resolvedTheme, target]);
-  const themeClasses = useThemeClasses(theme);
-  const parentTarget = useContext(PopupTargetContext);
+  var themeClasses = useThemeClasses(theme);
+  var parentTarget = useContext(PopupTargetContext);
   return /*#__PURE__*/React.createElement("div", _extends({
     ref: ref,
     className: target != null ? undefined : classNames(className, themeClasses)
   }, restProps), passToPopups ? /*#__PURE__*/React.createElement(PopupTarget, {
     id: id
-  }, popupTarget => /*#__PURE__*/React.createElement(React.Fragment, null, children, /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement("div", {
-    className: themeClasses
-  }, popupTarget), parentTarget && getPopupContainer(parentTarget) || document.body))) : children);
+  }, function (popupTarget) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, children, /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement("div", {
+      className: themeClasses
+    }, popupTarget), parentTarget && getPopupContainer(parentTarget) || document.body));
+  }) : children);
 });
 var Theme$1 = Theme;