Dashboard sipadu mbip
Du kannst nicht mehr als 25 Themen auswählen Themen müssen mit entweder einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

RootCloseWrapper.js 5.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. "use strict";
  2. exports.__esModule = true;
  3. exports.default = void 0;
  4. var _contains = _interopRequireDefault(require("dom-helpers/query/contains"));
  5. var _listen = _interopRequireDefault(require("dom-helpers/events/listen"));
  6. var _propTypes = _interopRequireDefault(require("prop-types"));
  7. var _react = _interopRequireDefault(require("react"));
  8. var _reactDom = _interopRequireDefault(require("react-dom"));
  9. var _ownerDocument = _interopRequireDefault(require("./utils/ownerDocument"));
  10. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  11. function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }
  12. function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
  13. var escapeKeyCode = 27;
  14. var noop = function noop() {};
  15. function isLeftClickEvent(event) {
  16. return event.button === 0;
  17. }
  18. function isModifiedEvent(event) {
  19. return !!(event.metaKey || event.altKey || event.ctrlKey || event.shiftKey);
  20. }
  21. /**
  22. * The `<RootCloseWrapper/>` component registers your callback on the document
  23. * when rendered. Powers the `<Overlay/>` component. This is used achieve modal
  24. * style behavior where your callback is triggered when the user tries to
  25. * interact with the rest of the document or hits the `esc` key.
  26. */
  27. var RootCloseWrapper =
  28. /*#__PURE__*/
  29. function (_React$Component) {
  30. _inheritsLoose(RootCloseWrapper, _React$Component);
  31. function RootCloseWrapper(props, context) {
  32. var _this;
  33. _this = _React$Component.call(this, props, context) || this;
  34. _this.addEventListeners = function () {
  35. var event = _this.props.event;
  36. var doc = (0, _ownerDocument.default)(_assertThisInitialized(_assertThisInitialized(_this))); // Use capture for this listener so it fires before React's listener, to
  37. // avoid false positives in the contains() check below if the target DOM
  38. // element is removed in the React mouse callback.
  39. _this.removeMouseCaptureListener = (0, _listen.default)(doc, event, _this.handleMouseCapture, true);
  40. _this.removeMouseListener = (0, _listen.default)(doc, event, _this.handleMouse);
  41. _this.removeKeyupListener = (0, _listen.default)(doc, 'keyup', _this.handleKeyUp);
  42. if ('ontouchstart' in doc.documentElement) {
  43. _this.mobileSafariHackListeners = [].slice.call(document.body.children).map(function (el) {
  44. return (0, _listen.default)(el, 'mousemove', noop);
  45. });
  46. }
  47. };
  48. _this.removeEventListeners = function () {
  49. if (_this.removeMouseCaptureListener) _this.removeMouseCaptureListener();
  50. if (_this.removeMouseListener) _this.removeMouseListener();
  51. if (_this.removeKeyupListener) _this.removeKeyupListener();
  52. if (_this.mobileSafariHackListeners) _this.mobileSafariHackListeners.forEach(function (remove) {
  53. return remove();
  54. });
  55. };
  56. _this.handleMouseCapture = function (e) {
  57. _this.preventMouseRootClose = isModifiedEvent(e) || !isLeftClickEvent(e) || (0, _contains.default)(_reactDom.default.findDOMNode(_assertThisInitialized(_assertThisInitialized(_this))), e.target);
  58. };
  59. _this.handleMouse = function (e) {
  60. if (!_this.preventMouseRootClose && _this.props.onRootClose) {
  61. _this.props.onRootClose(e);
  62. }
  63. };
  64. _this.handleKeyUp = function (e) {
  65. if (e.keyCode === escapeKeyCode && _this.props.onRootClose) {
  66. _this.props.onRootClose(e);
  67. }
  68. };
  69. _this.preventMouseRootClose = false;
  70. return _this;
  71. }
  72. var _proto = RootCloseWrapper.prototype;
  73. _proto.componentDidMount = function componentDidMount() {
  74. if (!this.props.disabled) {
  75. this.addEventListeners();
  76. }
  77. };
  78. _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
  79. if (!this.props.disabled && prevProps.disabled) {
  80. this.addEventListeners();
  81. } else if (this.props.disabled && !prevProps.disabled) {
  82. this.removeEventListeners();
  83. }
  84. };
  85. _proto.componentWillUnmount = function componentWillUnmount() {
  86. if (!this.props.disabled) {
  87. this.removeEventListeners();
  88. }
  89. };
  90. _proto.render = function render() {
  91. return this.props.children;
  92. };
  93. return RootCloseWrapper;
  94. }(_react.default.Component);
  95. RootCloseWrapper.displayName = 'RootCloseWrapper';
  96. RootCloseWrapper.propTypes = {
  97. /**
  98. * Callback fired after click or mousedown. Also triggers when user hits `esc`.
  99. */
  100. onRootClose: _propTypes.default.func,
  101. /**
  102. * Children to render.
  103. */
  104. children: _propTypes.default.element,
  105. /**
  106. * Disable the the RootCloseWrapper, preventing it from triggering `onRootClose`.
  107. */
  108. disabled: _propTypes.default.bool,
  109. /**
  110. * Choose which document mouse event to bind to.
  111. */
  112. event: _propTypes.default.oneOf(['click', 'mousedown'])
  113. };
  114. RootCloseWrapper.defaultProps = {
  115. event: 'click'
  116. };
  117. var _default = RootCloseWrapper;
  118. exports.default = _default;
  119. module.exports = exports.default;