@jetbrains/ring-ui 5.1.1 → 6.0.1-beta.0

package/dist/dialog-ng/dialog-ng__template.js

@@ -1,72 +1,3 @@
-var dialogTemplate = `<div
-  ng-show="dialog.active"
-  ng-class="[!dialog.inSidebar && dialog.dialogStyles.container]"
-  ng-click="dialog.handleClick($event)"
-  ng-attr-data-portaltarget="{{!dialog.inSidebar  ? 'dialog-ng-popup-container' : null}}"
-  ng-attr-data-test="ring-dialog-container"
->
-  <div ng-class="[dialog.dialogStyles.innerContainer]">
-    <div data-anchor="dialog-container"
-      ng-attr-data-in-sidebar="{{dialog.inSidebar  ? 'true' : 'false'}}"
-      ng-attr-data-test="{{dialog.active ? 'ring-dialog' : null}}"
-      ng-class="[
-        dialog.styles.dialogContainer,
-        dialog.cssClass,
-        dialog.wideDialog && dialog.styles.wide,
-        dialog.autoWidth && dialog.styles.autoWidth,
-        dialog.inSidebar && dialog.styles.inSidebar,
-        !dialog.inSidebar && dialog.dialogStyles.content,
-        !dialog.inSidebar && dialog.islandStyles.island
-      ]"
-    >
-      <div ng-class="[dialog.islandStyles.header, dialog.styles.header]"
-        data-anchor="dialog-header"
-        ng-show="dialog.title">
-        <span ng-class="dialog.islandStyles.title">{{ dialog.title }}</span>
-      </div>
-
-      <div ng-class="[dialog.styles.scrollableWrapper, dialog.islandStyles.scrollableWrapper, dialog.scrollableWrapperClassName]">
-        <div ng-class="[dialog.styles.content, dialog.islandStyles.content]">
-          <form name="dialog.dialogForm" class="ring-form ring-js-shortcuts"
-            novalidate>
-            <rg-dialog-content></rg-dialog-content>
-
-            <div class="ring-form__group" ng-show="dialog.error">
-              <div ng-class="dialog.styles.error" ng-bind-html="dialog.error"></div>
-            </div>
-          </form>
-        </div>
-      </div>
-
-      <div ng-class="dialog.styles.footer"
-        ng-if="dialog.description.length || dialog.buttons.length">
-        <div ng-class="dialog.styles.footerDescription"
-          ng-if="dialog.description && dialog.description.length">
-          <div ng-repeat="line in dialog.description">{{ line }}</div>
-        </div>
-
-        <div ng-class="dialog.styles.footerItems">
-          <rg-button
-            ng-repeat="button in dialog.buttons"
-            ng-class="[dialog.styles.footerItem , button.cssClasses]"
-            mode="{{button.default ? 'primary' : ''}}"
-            text="button.text"
-            ng-disabled="(button.default && dialog.dialogForm.$invalid) || button.disabled"
-            ng-if="!button.hidden"
-            data-test="dialog-footer-button"
-
-            rg-promised-click="dialog.action(button)"
-            promised-mode="loader"
-          >{{ button.label }}
-          </rg-button>
-        </div>
-      </div>
-
-      <div data-anchor="dialog-custom-footer-container"></div>
-
-      <div tabindex="-1" ng-show="false" data-anchor="focus-trap-fallback"></div>
-    </div>
-  </div>
-</div>`;
+var dialogTemplate = "<div\n  ng-show=\"dialog.active\"\n  ng-class=\"[!dialog.inSidebar && dialog.dialogStyles.container]\"\n  ng-click=\"dialog.handleClick($event)\"\n  ng-attr-data-portaltarget=\"{{!dialog.inSidebar  ? 'dialog-ng-popup-container' : null}}\"\n  ng-attr-data-test=\"ring-dialog-container\"\n>\n  <div ng-class=\"[dialog.dialogStyles.innerContainer]\">\n    <div data-anchor=\"dialog-container\"\n      ng-attr-data-in-sidebar=\"{{dialog.inSidebar  ? 'true' : 'false'}}\"\n      ng-attr-data-test=\"{{dialog.active ? 'ring-dialog' : null}}\"\n      ng-class=\"[\n        dialog.styles.dialogContainer,\n        dialog.cssClass,\n        dialog.wideDialog && dialog.styles.wide,\n        dialog.autoWidth && dialog.styles.autoWidth,\n        dialog.inSidebar && dialog.styles.inSidebar,\n        !dialog.inSidebar && dialog.dialogStyles.content,\n        !dialog.inSidebar && dialog.islandStyles.island\n      ]\"\n    >\n      <div ng-class=\"[dialog.islandStyles.header, dialog.styles.header]\"\n        data-anchor=\"dialog-header\"\n        ng-show=\"dialog.title\">\n        <span ng-class=\"dialog.islandStyles.title\">{{ dialog.title }}</span>\n      </div>\n\n      <div ng-class=\"[dialog.styles.scrollableWrapper, dialog.islandStyles.scrollableWrapper, dialog.scrollableWrapperClassName]\">\n        <div ng-class=\"[dialog.styles.content, dialog.islandStyles.content]\">\n          <form name=\"dialog.dialogForm\" class=\"ring-form ring-js-shortcuts\"\n            novalidate>\n            <rg-dialog-content></rg-dialog-content>\n\n            <div class=\"ring-form__group\" ng-show=\"dialog.error\">\n              <div ng-class=\"dialog.styles.error\" ng-bind-html=\"dialog.error\"></div>\n            </div>\n          </form>\n        </div>\n      </div>\n\n      <div ng-class=\"dialog.styles.footer\"\n        ng-if=\"dialog.description.length || dialog.buttons.length\">\n        <div ng-class=\"dialog.styles.footerDescription\"\n          ng-if=\"dialog.description && dialog.description.length\">\n          <div ng-repeat=\"line in dialog.description\">{{ line }}</div>\n        </div>\n\n        <div ng-class=\"dialog.styles.footerItems\">\n          <rg-button\n            ng-repeat=\"button in dialog.buttons\"\n            ng-class=\"[dialog.styles.footerItem , button.cssClasses]\"\n            mode=\"{{button.default ? 'primary' : ''}}\"\n            text=\"button.text\"\n            ng-disabled=\"(button.default && dialog.dialogForm.$invalid) || button.disabled\"\n            ng-if=\"!button.hidden\"\n            data-test=\"dialog-footer-button\"\n\n            rg-promised-click=\"dialog.action(button)\"\n            promised-mode=\"loader\"\n          >{{ button.label }}\n          </rg-button>\n        </div>\n      </div>\n\n      <div data-anchor=\"dialog-custom-footer-container\"></div>\n\n      <div tabindex=\"-1\" ng-show=\"false\" data-anchor=\"focus-trap-fallback\"></div>\n    </div>\n  </div>\n</div>";
 
 export { dialogTemplate as default };

package/dist/docked-panel-ng/docked-panel-ng.js

@@ -2,35 +2,47 @@ import angular from 'angular';
 import scheduleRAF from '../global/schedule-raf.js';
 import { getDocumentScrollTop, getWindowHeight } from '../global/dom.js';
 import '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.object.assign.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/web.dom-collections.for-each.js';
+import 'core-js/modules/es.array.filter.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.split.js';
+import 'core-js/modules/es.object.entries.js';
+import 'core-js/modules/es.object.keys.js';
+import 'core-js/modules/es.array.iterator.js';
+import 'core-js/modules/es.set.js';
+import 'core-js/modules/es.string.iterator.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
 
-var modules_655b40c7 = {"unit":"8px","light":"light_rui_f45d","dockedPanel":"dockedPanel_rui_f45d","fixed":"fixed_rui_f45d"};
+var modules_655b40c7 = {"unit":"i__const_unit_0","light":"light_rui_2ac4","dockedPanel":"dockedPanel_rui_f45d","fixed":"fixed_rui_f45d"};
 
-const scheduleAction = scheduleRAF();
+var scheduleAction = scheduleRAF();
 
 /**
  * @name Docked Panel Ng
  */
 
-const angularModule = angular.module('Ring.docked-panel', []);
+var angularModule = angular.module('Ring.docked-panel', []);
 angularModule.directive('rgDockedPanel', ["$parse", function rgDockedPanelDirective($parse) {
   return {
     link: function link(scope, element, attrs) {
-      const TOGGLE_GAP = 8;
-      const CSS_CLASS_NAME = modules_655b40c7.dockedPanel;
-      const DOCKED_CSS_CLASS_NAME = modules_655b40c7.fixed;
-      const dockedPanelClass = attrs.rgDockedPanelClass || '';
-      const config = attrs.rgDockedPanelConfig ? $parse(attrs.rgDockedPanelConfig)(scope) : null;
-      let initialPanelPos;
-      let isDocked;
+      var TOGGLE_GAP = 8;
+      var CSS_CLASS_NAME = modules_655b40c7.dockedPanel;
+      var DOCKED_CSS_CLASS_NAME = modules_655b40c7.fixed;
+      var dockedPanelClass = attrs.rgDockedPanelClass || '';
+      var config = attrs.rgDockedPanelConfig ? $parse(attrs.rgDockedPanelConfig)(scope) : null;
+      var initialPanelPos;
+      var isDocked;
 
       /**
        * Container
        * @type {Element} panel
        */
-      const panel = element[0];
+      var panel = element[0];
       panel.classList.add(CSS_CLASS_NAME);
       function getYPosition(node) {
-        const clientRect = node.getBoundingClientRect();
+        var clientRect = node.getBoundingClientRect();
         return clientRect.top + clientRect.height + getScrollContainerScrollTop();
       }
 
@@ -107,7 +119,7 @@ angularModule.directive('rgDockedPanel', ["$parse", function rgDockedPanelDirect
        * Check panel position
        */
       function checkPanelPosition() {
-        const currentPanelRect = panel.getBoundingClientRect();
+        var currentPanelRect = panel.getBoundingClientRect();
         if (currentPanelRect.top + currentPanelRect.height > getScrollContainerHeight() && !isDocked) {
           dock();
         } else if (isDocked && currentPanelRect.top + currentPanelRect.height + getScrollContainerScrollTop() >= getInitialUndockedPosition() + TOGGLE_GAP) {
@@ -115,24 +127,26 @@ angularModule.directive('rgDockedPanel', ["$parse", function rgDockedPanelDirect
         }
       }
       function init() {
-        const _onResize = () => {
+        var _onResize = function _onResize() {
           checkPanelPosition();
           onResize();
         };
-        const scrollListener = () => scheduleAction(checkPanelPosition);
+        var scrollListener = function scrollListener() {
+          return scheduleAction(checkPanelPosition);
+        };
 
         /**
          * Wait until all content on the page is loaded
          */
-        scope.$applyAsync(() => {
-          const scrollContainer = (config || {}).scrollContainer || window;
+        scope.$applyAsync(function () {
+          var scrollContainer = (config || {}).scrollContainer || window;
           scrollContainer.addEventListener('scroll', scrollListener);
           window.addEventListener('resize', _onResize);
-          scope.$on('$destroy', () => {
+          scope.$on('$destroy', function () {
             scrollContainer.removeEventListener('scroll', scrollListener);
             window.removeEventListener('resize', _onResize);
           });
-          scheduleAction(() => {
+          scheduleAction(function () {
             saveInitialPos();
             checkPanelPosition();
           });

package/dist/dropdown/anchor.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { ButtonAttrs } from '../button/button';
 declare const _default: React.MemoExoticComponent<{
-    ({ children, className, ...restProps }: ButtonAttrs): JSX.Element;
+    ({ children, className, ...restProps }: ButtonAttrs): React.JSX.Element;
     propTypes: {
         children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         className: PropTypes.Requireable<string>;

package/dist/dropdown/anchor.js

@@ -10,8 +10,17 @@ import 'util-deprecate';
 import '../icon/icon__constants.js';
 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 'focus-visible';
+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 'core-js/modules/es.array.concat.js';
 import '../link/clickableLink.js';
 import '../global/controls-height.js';
 import '../_helpers/button__classes.js';

package/dist/dropdown/dropdown.d.ts

@@ -6,6 +6,13 @@ export interface AnchorProps {
     active: boolean;
     pinned: boolean;
 }
+export interface DropdownChildProps {
+    hidden: boolean;
+    onCloseAttempt: () => void;
+    onMouseDown?: () => void | undefined;
+    onContextMenu?: () => void | undefined;
+    dontCloseOnAnchorClick: boolean;
+}
 export interface DropdownProps extends Omit<HTMLAttributes<HTMLElement>, 'children'> {
     anchor: ReactElement | readonly ReactElement[] | string | ((props: AnchorProps) => ReactNode);
     children: ReactElement<PopupAttrs> | ((props: Omit<PopupAttrs, 'children'>) => ReactNode);
@@ -74,7 +81,7 @@ export default class Dropdown extends Component<DropdownProps, DropdownState> {
     toggle(show?: boolean): void;
     _toggle(show: boolean, pinned?: boolean): void;
     _clearTimer(): void;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 export type DropdownAttrs = JSX.LibraryManagedAttributes<typeof Dropdown, DropdownProps>;
 export { Anchor };

package/dist/dropdown/dropdown.js

@@ -1,47 +1,65 @@
-import { _ as _defineProperty, a as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
-import React, { Component, cloneElement } from 'react';
+import { _ as _defineProperty, a as _inherits, b as _createSuper, c as _classCallCheck, k as _assertThisInitialized, d as _createClass, e as _objectWithoutProperties, l as _typeof, f as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.array.concat.js';
+import React, { cloneElement, Component } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import joinDataTestAttributes from '../global/data-tests.js';
 import { isArray } from '../global/typescript-utils.js';
 import { m as modules_d9414203, A as Anchor } from '../_helpers/anchor.js';
+import 'core-js/modules/es.array.reduce.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/es.object.entries.js';
 import '@jetbrains/icons/chevron-10px';
 import '../icon/icon.js';
 import 'util-deprecate';
 import '../icon/icon__constants.js';
 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.string.iterator.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/es.weak-map.js';
 import '../button/button.js';
-import 'focus-visible';
 import '../link/clickableLink.js';
 import '../global/controls-height.js';
 import '../_helpers/button__classes.js';
 
+var _excluded = ["initShown", "onShow", "onHide", "hoverShowTimeOut", "hoverHideTimeOut", "children", "anchor", "className", "activeClassName", "hoverMode", "clickMode", "data-test", "disabled"];
 /**
  * @name Dropdown
  */
-class Dropdown extends Component {
-  constructor() {
-    super(...arguments);
-    _defineProperty(this, "state", {
-      show: this.props.initShown,
+var Dropdown = /*#__PURE__*/function (_Component) {
+  _inherits(Dropdown, _Component);
+  var _super = _createSuper(Dropdown);
+  function Dropdown() {
+    var _this;
+    _classCallCheck(this, Dropdown);
+    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", {
+      show: _this.props.initShown,
       pinned: false
     });
-    _defineProperty(this, "onClick", () => {
-      if (this.props.disabled) {
+    _defineProperty(_assertThisInitialized(_this), "onClick", function () {
+      if (_this.props.disabled) {
         return;
       }
-      const {
-        show,
-        pinned
-      } = this.state;
-      let nextPinned = pinned;
-      if (this.props.hoverMode) {
+      var _this$state = _this.state,
+        show = _this$state.show,
+        pinned = _this$state.pinned;
+      var nextPinned = pinned;
+      if (_this.props.hoverMode) {
         if (!pinned) {
           nextPinned = true;
           if (show) {
-            this.setState({
+            _this.setState({
               pinned: true
             });
             return;
@@ -50,138 +68,148 @@ class Dropdown extends Component {
           nextPinned = false;
         }
       }
-      this._toggle(!show, nextPinned);
+      _this._toggle(!show, nextPinned);
     });
-    _defineProperty(this, "onChildCloseAttempt", () => {
-      let nextPinned = this.state.pinned;
-      if (this.props.hoverMode) {
+    _defineProperty(_assertThisInitialized(_this), "onChildCloseAttempt", function () {
+      var nextPinned = _this.state.pinned;
+      if (_this.props.hoverMode) {
         nextPinned = false;
       }
-      this._toggle(false, nextPinned);
+      _this._toggle(false, nextPinned);
     });
-    _defineProperty(this, "hoverTimer", void 0);
-    _defineProperty(this, "onMouseEnter", event => {
-      if (this.props.disabled) {
+    _defineProperty(_assertThisInitialized(_this), "hoverTimer", void 0);
+    _defineProperty(_assertThisInitialized(_this), "onMouseEnter", function (event) {
+      var _this$props$onMouseEn, _this$props;
+      if (_this.props.disabled) {
         return;
       }
-      this._clearTimer();
-      this.props.onMouseEnter?.(event);
-      this.hoverTimer = window.setTimeout(() => {
-        if (!this.state.show) {
-          this._toggle(true);
+      _this._clearTimer();
+      (_this$props$onMouseEn = (_this$props = _this.props).onMouseEnter) === null || _this$props$onMouseEn === void 0 ? void 0 : _this$props$onMouseEn.call(_this$props, event);
+      _this.hoverTimer = window.setTimeout(function () {
+        if (!_this.state.show) {
+          _this._toggle(true);
         }
-      }, this.props.hoverShowTimeOut);
+      }, _this.props.hoverShowTimeOut);
     });
-    _defineProperty(this, "onMouseLeave", event => {
-      if (this.props.disabled) {
+    _defineProperty(_assertThisInitialized(_this), "onMouseLeave", function (event) {
+      var _this$props$onMouseLe, _this$props2;
+      if (_this.props.disabled) {
         return;
       }
-      this.props.onMouseLeave?.(event);
-      if (this.state.pinned) {
+      (_this$props$onMouseLe = (_this$props2 = _this.props).onMouseLeave) === null || _this$props$onMouseLe === void 0 ? void 0 : _this$props$onMouseLe.call(_this$props2, event);
+      if (_this.state.pinned) {
         return;
       }
-      this._clearTimer();
-      this.hoverTimer = window.setTimeout(() => {
-        if (this.state.show) {
-          this._toggle(false);
+      _this._clearTimer();
+      _this.hoverTimer = window.setTimeout(function () {
+        if (_this.state.show) {
+          _this._toggle(false);
         }
-      }, this.props.hoverHideTimeOut);
+      }, _this.props.hoverHideTimeOut);
     });
-    _defineProperty(this, "handlePopupInteraction", () => {
-      this.setState(_ref => {
-        let {
-          pinned
-        } = _ref;
+    _defineProperty(_assertThisInitialized(_this), "handlePopupInteraction", function () {
+      _this.setState(function (_ref) {
+        var pinned = _ref.pinned;
         return pinned ? null : {
           pinned: true
         };
       });
     });
+    return _this;
   }
-  toggle() {
-    let show = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : !this.state.show;
-    this._toggle(show);
-  }
-  _toggle(show) {
-    let pinned = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state.pinned;
-    this.setState({
-      show,
-      pinned
-    }, () => show ? this.props.onShow() : this.props.onHide());
-  }
-  _clearTimer() {
-    if (this.hoverTimer) {
-      clearTimeout(this.hoverTimer);
-      this.hoverTimer = null;
+  _createClass(Dropdown, [{
+    key: "toggle",
+    value: function toggle() {
+      var show = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : !this.state.show;
+      this._toggle(show);
     }
-  }
-  render() {
-    const {
-      show,
-      pinned
-    } = this.state;
-    const {
-      initShown,
-      onShow,
-      onHide,
-      hoverShowTimeOut,
-      hoverHideTimeOut,
-      children,
-      anchor,
-      className,
-      activeClassName,
-      hoverMode,
-      clickMode,
-      'data-test': dataTest,
-      disabled,
-      ...restProps
-    } = this.props;
-    const classes = classNames(modules_d9414203.dropdown, className, {
-      [activeClassName !== null && activeClassName !== void 0 ? activeClassName : '']: activeClassName != null && show
-    });
-    let anchorElement;
-    const active = hoverMode ? pinned : show;
-    switch (typeof anchor) {
-      case 'string':
-        anchorElement = /*#__PURE__*/React.createElement(Anchor, {
-          active: active
-        }, anchor);
-        break;
-      case 'function':
-        anchorElement = anchor({
-          active: show,
-          pinned
-        });
-        break;
-      default:
-        if (isArray(anchor) || typeof anchor.type === 'string') {
-          anchorElement = anchor;
-        } else {
-          anchorElement = /*#__PURE__*/cloneElement(anchor, {
-            active
+  }, {
+    key: "_toggle",
+    value: function _toggle(show) {
+      var _this2 = this;
+      var pinned = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state.pinned;
+      this.setState({
+        show: show,
+        pinned: pinned
+      }, function () {
+        return show ? _this2.props.onShow() : _this2.props.onHide();
+      });
+    }
+  }, {
+    key: "_clearTimer",
+    value: function _clearTimer() {
+      if (this.hoverTimer) {
+        clearTimeout(this.hoverTimer);
+        this.hoverTimer = null;
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$state2 = this.state,
+        show = _this$state2.show,
+        pinned = _this$state2.pinned;
+      var _this$props3 = this.props;
+        _this$props3.initShown;
+        _this$props3.onShow;
+        _this$props3.onHide;
+        _this$props3.hoverShowTimeOut;
+        _this$props3.hoverHideTimeOut;
+        var children = _this$props3.children,
+        anchor = _this$props3.anchor,
+        className = _this$props3.className,
+        activeClassName = _this$props3.activeClassName,
+        hoverMode = _this$props3.hoverMode,
+        clickMode = _this$props3.clickMode,
+        dataTest = _this$props3['data-test'];
+        _this$props3.disabled;
+        var restProps = _objectWithoutProperties(_this$props3, _excluded);
+      var classes = classNames(modules_d9414203.dropdown, className, _defineProperty({}, activeClassName !== null && activeClassName !== void 0 ? activeClassName : '', activeClassName != null && show));
+      var anchorElement;
+      var active = hoverMode ? pinned : show;
+      switch (_typeof(anchor)) {
+        case 'string':
+          anchorElement = /*#__PURE__*/React.createElement(Anchor, {
+            active: active
+          }, anchor);
+          break;
+        case 'function':
+          anchorElement = anchor({
+            active: show,
+            pinned: pinned
           });
-        }
+          break;
+        default:
+          if (isArray(anchor) || typeof anchor.type === 'string') {
+            anchorElement = anchor;
+          } else {
+            anchorElement = /*#__PURE__*/cloneElement(anchor, {
+              active: active
+            });
+          }
+      }
+      var childProps = {
+        hidden: !show,
+        onCloseAttempt: this.onChildCloseAttempt,
+        onMouseDown: hoverMode ? this.handlePopupInteraction : undefined,
+        onContextMenu: hoverMode ? this.handlePopupInteraction : undefined,
+        dontCloseOnAnchorClick: true
+      };
+      return /*#__PURE__*/React.createElement("div", _extends({
+        "data-test": joinDataTestAttributes('ring-dropdown', dataTest)
+      }, restProps, {
+        onClick: clickMode ? this.onClick : undefined
+        // anchorElement should be a `button` or an `a`
+        ,
+        role: "presentation",
+        onMouseEnter: hoverMode ? this.onMouseEnter : undefined,
+        onMouseLeave: hoverMode ? this.onMouseLeave : undefined,
+        className: classes
+      }), anchorElement, typeof children === 'function' ? children(childProps) : /*#__PURE__*/cloneElement(children, childProps));
     }
-    const childProps = {
-      hidden: !show,
-      onCloseAttempt: this.onChildCloseAttempt,
-      onMouseDown: hoverMode ? this.handlePopupInteraction : undefined,
-      onContextMenu: hoverMode ? this.handlePopupInteraction : undefined,
-      dontCloseOnAnchorClick: true
-    };
-    return /*#__PURE__*/React.createElement("div", _extends({
-      "data-test": joinDataTestAttributes('ring-dropdown', dataTest)
-    }, restProps, {
-      onClick: clickMode ? this.onClick : undefined
-      // anchorElement should be a `button` or an `a`
-      ,
-      role: "presentation",
-      onMouseEnter: hoverMode ? this.onMouseEnter : undefined,
-      onMouseLeave: hoverMode ? this.onMouseLeave : undefined,
-      className: classes
-    }), anchorElement, typeof children === 'function' ? children(childProps) : /*#__PURE__*/cloneElement(children, childProps));
-  }
-}
+  }]);
+  return Dropdown;
+}(Component);
 _defineProperty(Dropdown, "propTypes", {
   /**
    * Can be string, React element, or a function accepting an object with {active, pinned} properties and returning a React element
@@ -210,10 +238,10 @@ _defineProperty(Dropdown, "defaultProps", {
   hoverShowTimeOut: 300,
   hoverHideTimeOut: 600,
   disabled: false,
-  onShow: () => {},
-  onHide: () => {},
-  onMouseEnter: () => {},
-  onMouseLeave: () => {}
+  onShow: function onShow() {},
+  onHide: function onHide() {},
+  onMouseEnter: function onMouseEnter() {},
+  onMouseLeave: function onMouseLeave() {}
 });
 
 export { Anchor, Dropdown as default };