modal

Author: Sasha Kondrashov

src/modules/Modal/Modal.d.ts

@@ -62,41 +62,43 @@ export interface StrictModalProps extends StrictPortalProps {
    * Action onClick handler when using shorthand `actions`.
    *
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
-   * @param {object} data - All props.
+   * @param {object} props - All props.
    */
-  onActionClick?: (event: React.MouseEvent<HTMLElement>, data: ModalProps) => void
+  onActionClick?: (event: React.MouseEvent<HTMLElement>, props: ModalProps) => void
 
   /**
    * Called when a close event happens.
    *
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
-   * @param {object} data - All props.
+   * @param {object} props - All props.
+   * @param {boolean} open - Whether the modal is displayed.
    */
-  onClose?: (event: React.MouseEvent<HTMLElement>, data: ModalProps) => void
+  onClose?: (event: React.MouseEvent<HTMLElement>, props: ModalProps, open: boolean) => void
 
   /**
    * Called when the portal is mounted on the DOM.
    *
    * @param {null}
-   * @param {object} data - All props.
+   * @param {object} props - All props.
    */
-  onMount?: (nothing: null, data: ModalProps) => void
+  onMount?: (nothing: null, props: ModalProps) => void
 
   /**
    * Called when an open event happens.
    *
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
-   * @param {object} data - All props.
+   * @param {object} props - All props.
+   * @param {boolean} open - Whether the modal is displayed.
    */
-  onOpen?: (event: React.MouseEvent<HTMLElement>, data: ModalProps) => void
+  onOpen?: (event: React.MouseEvent<HTMLElement>, props: ModalProps, open: boolean) => void
 
   /**
    * Called when the portal is unmounted from the DOM.
    *
    * @param {null}
-   * @param {object} data - All props.
+   * @param {object} props - All props.
    */
-  onUnmount?: (nothing: null, data: ModalProps) => void
+  onUnmount?: (nothing: null, props: ModalProps) => void
 
   /** Controls whether or not the Modal is displayed. */
   open?: boolean

src/modules/Modal/Modal.js

@@ -108,7 +108,7 @@ const Modal = React.forwardRef(function (props, ref) {
     debug('close()')
 
     setOpen(false)
-    _.invoke(props, 'onClose', e, { ...props, open: false })
+    _.invoke(props, 'onClose', e, props, false)
   }
 
   const handleDocumentMouseDown = (e) => {
@@ -129,14 +129,14 @@ const Modal = React.forwardRef(function (props, ref) {
       return
 
     setOpen(false)
-    _.invoke(props, 'onClose', e, { ...props, open: false })
+    _.invoke(props, 'onClose', e, props, false)
   }
 
   const handleOpen = (e) => {
     debug('open()')
 
     setOpen(true)
-    _.invoke(props, 'onOpen', e, { ...props, open: true })
+    _.invoke(props, 'onOpen', e, props, true)
   }
 
   const handlePortalMount = (e) => {

test/specs/modules/Modal/Modal-test.js

@@ -277,7 +277,7 @@ describe('Modal', () => {
 
       wrapper.find('#trigger').simulate('click')
       onOpen.should.have.been.calledOnce()
-      onOpen.should.have.been.calledWithMatch({ type: 'click' }, { open: true })
+      onOpen.should.have.been.calledWithMatch({ type: 'click' }, {}, true)
     })
 
     it('is not called on body click', () => {
@@ -296,7 +296,7 @@ describe('Modal', () => {
 
       domEvent.click('.ui.dimmer')
       onClose.should.have.been.calledOnce()
-      onClose.should.have.been.calledWithMatch({}, { open: false })
+      onClose.should.have.been.calledWithMatch({}, {}, false)
     })
 
     it('is called on click outside of the modal', () => {
@@ -305,6 +305,7 @@ describe('Modal', () => {
 
       domEvent.click(document.querySelector('.ui.modal').parentNode)
       onClose.should.have.been.calledOnce()
+      onClose.should.have.been.calledWithMatch({}, {}, false)
     })
 
     it('is not called on mousedown inside and mouseup outside of the modal', () => {
@@ -338,6 +339,7 @@ describe('Modal', () => {
 
       domEvent.keyDown(document, { key: 'Escape' })
       onClose.should.have.been.calledOnce()
+      onClose.should.have.been.calledWithMatch({}, {}, false)
     })
 
     it('is not called when the open prop changes to false', () => {