fix(Modal|Popup|Portal): fix usage of eventStack sub/unsub

src/addons/Portal/Portal.d.ts

@@ -95,6 +95,9 @@ export interface PortalProps {
   /** Controls whether or not the portal should open when mousing over the trigger. */
   openOnTriggerMouseEnter?: boolean;
 
+  /** Event pool namespace that is used to handle component events. */
+  eventPool?: string;
+
   /** Controls whether the portal should be prepended to the mountNode instead of appended. */
   prepend?: boolean;
 

src/addons/Portal/Portal.js

@@ -115,6 +115,9 @@ class Portal extends Component {
     /** Controls whether or not the portal should open when mousing over the trigger. */
     openOnTriggerMouseEnter: PropTypes.bool,
 
+    /** Event pool namespace that is used to handle component events */
+    eventPool: PropTypes.string,
+
     /** Controls whether the portal should be prepended to the mountNode instead of appended. */
     prepend: PropTypes.bool,
 
@@ -126,6 +129,7 @@ class Portal extends Component {
     closeOnDocumentClick: true,
     closeOnEscape: true,
     openOnTriggerClick: true,
+    eventPool: 'default',
   }
 
   static autoControlledProps = [
@@ -374,6 +378,7 @@ class Portal extends Component {
     const {
       mountNode = isBrowser ? document.body : null,
       prepend,
+      eventPool,
     } = this.props
 
     this.rootNode = document.createElement('div')
@@ -384,8 +389,8 @@ class Portal extends Component {
       mountNode.appendChild(this.rootNode)
     }
 
-    eventStack.sub('click', this.handleDocumentClick, 'Portal')
-    eventStack.sub('keydown', this.handleEscape, 'Portal')
+    eventStack.sub('click', this.handleDocumentClick, eventPool)
+    eventStack.sub('keydown', this.handleEscape, eventPool)
     _.invoke(this.props, 'onMount', null, this.props)
   }
 
@@ -394,6 +399,8 @@ class Portal extends Component {
 
     debug('unmountPortal()')
 
+    const { eventPool } = this.props
+
     ReactDOM.unmountComponentAtNode(this.rootNode)
     this.rootNode.parentNode.removeChild(this.rootNode)
 
@@ -403,8 +410,8 @@ class Portal extends Component {
     this.rootNode = null
     this.portalNode = null
 
-    eventStack.unsub('click', this.handleDocumentClick, 'Portal')
-    eventStack.unsub('keydown', this.handleEscape, 'Portal')
+    eventStack.unsub('click', this.handleDocumentClick, eventPool)
+    eventStack.unsub('keydown', this.handleEscape, eventPool)
     _.invoke(this.props, 'onUnmount', null, this.props)
   }
 

src/modules/Modal/Modal.d.ts

@@ -34,6 +34,9 @@ export interface ModalProps extends PortalProps {
   /** Whether or not the Modal should close when the document is clicked. */
   closeOnDocumentClick?: boolean;
 
+  /** Event pool namespace that is used to handle component events */
+  eventPool?: string;
+
   /** A Modal can be passed content via shorthand. */
   content?: SemanticShorthandItem<ModalContentProps>;
 

src/modules/Modal/Modal.js

@@ -58,6 +58,9 @@ class Modal extends Component {
     /** Whether or not the Modal should close when the document is clicked. */
     closeOnDocumentClick: PropTypes.bool,
 
+    /** Event pool namespace that is used to handle component events */
+    eventPool: PropTypes.string,
+
     /** Simple text content for the Modal. */
     content: customPropTypes.itemShorthand,
 
@@ -135,6 +138,7 @@ class Modal extends Component {
     dimmer: true,
     closeOnDimmerClick: true,
     closeOnDocumentClick: false,
+    eventPool: 'Modal',
   }
 
   static autoControlledProps = [
@@ -315,7 +319,7 @@ class Modal extends Component {
 
   render() {
     const { open } = this.state
-    const { closeOnDimmerClick, closeOnDocumentClick, dimmer } = this.props
+    const { closeOnDimmerClick, closeOnDocumentClick, dimmer, eventPool } = this.props
     const mountNode = this.getMountNode()
 
     // Short circuit when server side rendering
@@ -359,6 +363,7 @@ class Modal extends Component {
         onMount={this.handlePortalMount}
         onOpen={this.handleOpen}
         onUnmount={this.handlePortalUnmount}
+        eventPool={eventPool}
       >
         {this.renderContent(rest)}
       </Portal>