@jetbrains/ring-ui 4.2.9 → 4.2.10

package/dist/dialog/dialog.js

@@ -0,0 +1,205 @@
+import { _ as _defineProperty, a as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import React, { PureComponent } from 'react';
+import { createPortal } from 'react-dom';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+import closeIcon from '@jetbrains/icons/close';
+import { AdaptiveIsland } from '../island/island.js';
+import getUID from '../global/get-uid.js';
+import joinDataTestAttributes from '../global/data-tests.js';
+import Shortcuts from '../shortcuts/shortcuts.js';
+import TabTrap from '../tab-trap/tab-trap.js';
+import Button from '../button/button.js';
+import { PopupTarget } from '../popup/popup.target.js';
+import { p as preventerFactory, m as modules_5e9b8c03 } from '../_helpers/dialog__body-scroll-preventer.js';
+import '../island/adaptive-island-hoc.js';
+import '../global/linear-function.js';
+import '../_helpers/island.js';
+import '../island/header.js';
+import '../island/content.js';
+import 'element-resize-detector';
+import '../global/schedule-raf.js';
+import '../shortcuts/core.js';
+import 'combokeys';
+import '../global/sniffer.js';
+import 'sniffr';
+import '../global/dom.js';
+import 'focus-visible';
+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.string.replace.js';
+import '../global/memoize.js';
+import '../global/theme.js';
+import '../link/clickableLink.js';
+import '../_helpers/button__classes.js';
+import 'scrollbar-width';
+
+/**
+ * @name Dialog
+ */
+
+function noop() {}
+
+class Dialog extends PureComponent {
+  constructor() {
+    super(...arguments);
+
+    _defineProperty(this, "state", {
+      shortcutsScope: getUID('ring-dialog-')
+    });
+
+    _defineProperty(this, "scrollPreventer", preventerFactory(getUID('preventer-')));
+
+    _defineProperty(this, "uid", getUID('dialog-'));
+
+    _defineProperty(this, "handleClick", event => {
+      this.props.onOverlayClick(event);
+      this.props.onCloseAttempt(event);
+    });
+
+    _defineProperty(this, "onCloseClick", event => {
+      this.props.onCloseClick(event);
+      this.props.onCloseAttempt(event);
+    });
+
+    _defineProperty(this, "getShortcutsMap", () => {
+      const onEscape = event => {
+        if (this.props.show) {
+          this.props.onEscPress(event);
+          this.props.onCloseAttempt(event);
+        }
+      };
+
+      return {
+        esc: onEscape
+      };
+    });
+
+    _defineProperty(this, "dialogRef", tabTrap => {
+      this.dialog = tabTrap && tabTrap.node;
+    });
+  }
+
+  componentDidMount() {
+    this.toggleScrollPreventer();
+  }
+
+  componentDidUpdate(prevProps) {
+    if (prevProps.show !== this.props.show) {
+      this.toggleScrollPreventer();
+    }
+  }
+
+  componentWillUnmount() {
+    this.scrollPreventer.reset();
+  }
+
+  toggleScrollPreventer() {
+    if (this.props.show) {
+      this.scrollPreventer.prevent();
+    } else {
+      this.scrollPreventer.reset();
+    }
+  }
+
+  render() {
+    const {
+      show,
+      showCloseButton,
+      onOverlayClick,
+      onCloseAttempt,
+      onEscPress,
+      onCloseClick,
+      children,
+      className,
+      contentClassName,
+      trapFocus,
+      'data-test': dataTest,
+      closeButtonInside,
+      portalTarget,
+      label,
+      closeButtonTitle,
+      ...restProps
+    } = this.props;
+    const classes = classNames(modules_5e9b8c03.container, className);
+    const shortcutsMap = this.getShortcutsMap();
+    return show && /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement(PopupTarget, {
+      id: this.uid,
+      className: modules_5e9b8c03.popupTarget
+    }, target => /*#__PURE__*/React.createElement(TabTrap, _extends({
+      trapDisabled: !trapFocus,
+      "data-test": joinDataTestAttributes('ring-dialog-container', dataTest),
+      ref: this.dialogRef,
+      className: classes,
+      role: "presentation"
+    }, restProps), /*#__PURE__*/React.createElement(Shortcuts, {
+      map: shortcutsMap,
+      scope: this.state.shortcutsScope
+    }), (onOverlayClick !== noop || onCloseAttempt !== noop) && /*#__PURE__*/React.createElement("div", {
+      // click handler is duplicated in close button
+      role: "presentation",
+      className: modules_5e9b8c03.clickableOverlay,
+      onClick: this.handleClick
+    }), /*#__PURE__*/React.createElement("div", {
+      className: modules_5e9b8c03.innerContainer
+    }, /*#__PURE__*/React.createElement(AdaptiveIsland, {
+      className: classNames(modules_5e9b8c03.content, contentClassName),
+      "data-test": "ring-dialog",
+      role: "dialog",
+      "aria-label": label
+    }, children, showCloseButton && /*#__PURE__*/React.createElement(Button, {
+      icon: closeIcon,
+      "data-test": "ring-dialog-close-button",
+      className: classNames(modules_5e9b8c03.closeButton, {
+        [modules_5e9b8c03.closeButtonOutside]: !closeButtonInside,
+        [modules_5e9b8c03.closeButtonInside]: closeButtonInside
+      }),
+      iconClassName: modules_5e9b8c03.closeIcon,
+      onClick: this.onCloseClick,
+      title: closeButtonTitle,
+      "aria-label": closeButtonTitle || 'close dialog'
+    }))), target)), portalTarget instanceof HTMLElement ? portalTarget : document.body);
+  }
+
+}
+
+_defineProperty(Dialog, "propTypes", {
+  label: PropTypes.string,
+  className: PropTypes.string,
+  contentClassName: PropTypes.string,
+  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),
+  show: PropTypes.bool.isRequired,
+  showCloseButton: PropTypes.bool,
+  closeButtonInside: PropTypes.bool,
+  closeButtonTitle: PropTypes.string,
+  onOverlayClick: PropTypes.func,
+  onEscPress: PropTypes.func,
+  onCloseClick: PropTypes.func,
+  // onCloseAttempt is a common callback for ESC pressing and overlay clicking.
+  // Use it if you don't need different behaviors for this cases.
+  onCloseAttempt: PropTypes.func,
+  // focusTrap may break popups inside dialog, so use it carefully
+  trapFocus: PropTypes.bool,
+  portalTarget: PropTypes.instanceOf(HTMLElement),
+  autoFocusFirst: PropTypes.bool,
+  'data-test': PropTypes.string
+});
+
+_defineProperty(Dialog, "defaultProps", {
+  label: 'Dialog',
+  onOverlayClick: noop,
+  onEscPress: noop,
+  onCloseClick: noop,
+  onCloseAttempt: noop,
+  showCloseButton: false,
+  closeButtonInside: false,
+  trapFocus: false,
+  autoFocusFirst: true
+});
+
+export { Dialog as default };

package/dist/dialog/dialog__body-scroll-preventer.js

@@ -0,0 +1,3 @@
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'scrollbar-width';
+export { d as default, p as preventerFactory } from '../_helpers/dialog__body-scroll-preventer.js';