diff --git a/src/addons/Pagination/Pagination.d.ts b/src/addons/Pagination/Pagination.d.ts
index 1e956d6640..26f1d0dc1c 100644
--- a/src/addons/Pagination/Pagination.d.ts
+++ b/src/addons/Pagination/Pagination.d.ts
@@ -3,11 +3,7 @@ import * as React from 'react'
 import { ForwardRefComponent, SemanticShorthandItem } from '../../generic'
 import PaginationItem, { PaginationItemProps } from './PaginationItem'
 
-export interface PaginationProps extends StrictPaginationProps {
-  [key: string]: any
-}
-
-export interface StrictPaginationProps {
+export interface PaginationProps {
   /** A pagination item can have an aria label. */
   'aria-label'?: string
 
@@ -47,7 +43,11 @@ export interface StrictPaginationProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  onPageChange?: (event: React.MouseEvent<HTMLAnchorElement>, data: PaginationProps) => void
+  onPageChange?: (
+    event: React.MouseEvent<HTMLAnchorElement>,
+    props: PaginationProps,
+    activePage: number,
+  ) => void
 
   /** Number of always visible pages before and after the current one. */
   siblingRange?: number | string
diff --git a/src/addons/Pagination/Pagination.js b/src/addons/Pagination/Pagination.js
index dc5d2a1269..b4b51ffd01 100644
--- a/src/addons/Pagination/Pagination.js
+++ b/src/addons/Pagination/Pagination.js
@@ -55,7 +55,7 @@ const Pagination = React.forwardRef(function (props, ref) {
     }
 
     setActivePage(nextActivePage)
-    _.invoke(props, 'onPageChange', e, { ...props, activePage: nextActivePage })
+    _.invoke(props, 'onPageChange', e, props, nextActivePage)
   }
 
   const handleItemOverrides = (active, type, value) => (predefinedProps) => ({
diff --git a/src/addons/Portal/Portal.d.ts b/src/addons/Portal/Portal.d.ts
index 09d5b75bc4..0aa9ad2580 100644
--- a/src/addons/Portal/Portal.d.ts
+++ b/src/addons/Portal/Portal.d.ts
@@ -1,11 +1,7 @@
 import * as React from 'react'
 import PortalInner from './PortalInner'
 
-export interface PortalProps extends StrictPortalProps {
-  [key: string]: any
-}
-
-export interface StrictPortalProps {
+export interface PortalProps {
   /** Primary content. */
   children?: React.ReactNode
 
@@ -52,7 +48,7 @@ export interface StrictPortalProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  onClose?: (event: React.MouseEvent<HTMLElement>, data: PortalProps) => void
+  onClose?: (event: React.MouseEvent<HTMLElement>, props: PortalProps, open: boolean) => void
 
   /**
    * Called when the portal is mounted on the DOM
@@ -60,7 +56,7 @@ export interface StrictPortalProps {
    * @param {null}
    * @param {object} data - All props.
    */
-  onMount?: (nothing: null, data: PortalProps) => void
+  onMount?: (nothing: null, props: PortalProps) => void
 
   /**
    * Called when an open event happens
@@ -68,7 +64,7 @@ export interface StrictPortalProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  onOpen?: (event: React.MouseEvent<HTMLElement>, data: PortalProps) => void
+  onOpen?: (event: React.MouseEvent<HTMLElement>, props: PortalProps, open: boolean) => void
 
   /**
    * Called when the portal is unmounted from the DOM
@@ -76,7 +72,7 @@ export interface StrictPortalProps {
    * @param {null}
    * @param {object} data - All props.
    */
-  onUnmount?: (nothing: null, data: PortalProps) => void
+  onUnmount?: (nothing: null, props: PortalProps) => void
 
   /** Controls whether or not the portal is displayed. */
   open?: boolean
diff --git a/src/addons/Portal/Portal.js b/src/addons/Portal/Portal.js
index 4ad57da0cd..0b4738dcde 100644
--- a/src/addons/Portal/Portal.js
+++ b/src/addons/Portal/Portal.js
@@ -61,7 +61,7 @@ function Portal(props) {
     debug('open()')
 
     setOpen(true)
-    _.invoke(props, 'onOpen', e, { ...props, open: true })
+    _.invoke(props, 'onOpen', e, props, true)
   }
 
   const openPortalWithTimeout = (e, delay) => {
@@ -77,7 +77,7 @@ function Portal(props) {
     debug('close()')
 
     setOpen(false)
-    _.invoke(props, 'onClose', e, { ...props, open: false })
+    _.invoke(props, 'onClose', e, props, false)
   }
 
   const closePortalWithTimeout = (e, delay) => {
diff --git a/src/addons/Portal/index.d.ts b/src/addons/Portal/index.d.ts
index 2bf40e5ed5..1c61bf10e7 100644
--- a/src/addons/Portal/index.d.ts
+++ b/src/addons/Portal/index.d.ts
@@ -1 +1 @@
-export { default, PortalProps, StrictPortalProps } from './Portal'
+export { default, PortalProps } from './Portal'
diff --git a/src/addons/TextArea/TextArea.d.ts b/src/addons/TextArea/TextArea.d.ts
index 09e05d352a..1da4da4a5c 100644
--- a/src/addons/TextArea/TextArea.d.ts
+++ b/src/addons/TextArea/TextArea.d.ts
@@ -1,11 +1,7 @@
 import * as React from 'react'
 import { ForwardRefComponent } from '../../generic'
 
-export interface TextAreaProps extends StrictTextAreaProps {
-  [key: string]: any
-}
-
-export interface StrictTextAreaProps {
+export interface TextAreaProps {
   /** An element type to render as (string or function). */
   as?: any
 
@@ -15,7 +11,11 @@ export interface StrictTextAreaProps {
    * @param {SyntheticEvent} event - The React SyntheticEvent object
    * @param {object} data - All props and the event value.
    */
-  onChange?: (event: React.ChangeEvent<HTMLTextAreaElement>, data: TextAreaProps) => void
+  onChange?: (
+    event: React.ChangeEvent<HTMLTextAreaElement>,
+    props: TextAreaProps,
+    value: string,
+  ) => void
 
   /**
    * Called on input.
@@ -23,7 +23,11 @@ export interface StrictTextAreaProps {
    * @param {SyntheticEvent} event - The React SyntheticEvent object
    * @param {object} data - All props and the event value.
    */
-  onInput?: (event: React.FormEvent<HTMLTextAreaElement>, data: TextAreaProps) => void
+  onInput?: (
+    event: React.FormEvent<HTMLTextAreaElement>,
+    props: TextAreaProps,
+    value: string,
+  ) => void
 
   /** Indicates row count for a TextArea. */
   rows?: number | string
diff --git a/src/addons/TextArea/TextArea.js b/src/addons/TextArea/TextArea.js
index eacaab263a..e0fae17706 100644
--- a/src/addons/TextArea/TextArea.js
+++ b/src/addons/TextArea/TextArea.js
@@ -15,13 +15,13 @@ const TextArea = React.forwardRef(function (props, ref) {
   const handleChange = (e) => {
     const newValue = _.get(e, 'target.value')
 
-    _.invoke(props, 'onChange', e, { ...props, value: newValue })
+    _.invoke(props, 'onChange', e, props, newValue)
   }
 
   const handleInput = (e) => {
     const newValue = _.get(e, 'target.value')
 
-    _.invoke(props, 'onInput', e, { ...props, value: newValue })
+    _.invoke(props, 'onInput', e, props, newValue)
   }
 
   const rest = getUnhandledProps(TextArea, props)
diff --git a/src/elements/Input/Input.d.ts b/src/elements/Input/Input.d.ts
index 840930dcc7..a4e00b3273 100644
--- a/src/elements/Input/Input.d.ts
+++ b/src/elements/Input/Input.d.ts
@@ -3,11 +3,7 @@ import * as React from 'react'
 import { ForwardRefComponent, HtmlInputrops, SemanticShorthandItem } from '../../generic'
 import { LabelProps } from '../Label'
 
-export interface InputProps extends StrictInputProps {
-  [key: string]: any
-}
-
-export interface StrictInputProps {
+export interface InputProps {
   /** An element type to render as (string or function). */
   as?: any
 
@@ -62,7 +58,7 @@ export interface StrictInputProps {
    * @param {ChangeEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props and a proposed value.
    */
-  onChange?: (event: React.ChangeEvent<HTMLInputElement>, data: InputOnChangeData) => void
+  onChange?: (event: React.ChangeEvent<HTMLInputElement>, props: InputProps, value: string) => void
 
   /** An Input can vary in size. */
   size?: 'mini' | 'small' | 'large' | 'big' | 'huge' | 'massive'
@@ -77,10 +73,6 @@ export interface StrictInputProps {
   type?: string
 }
 
-export interface InputOnChangeData extends InputProps {
-  value: string
-}
-
 declare const Input: ForwardRefComponent<InputProps, HTMLInputElement>
 
 export default Input
diff --git a/src/elements/Input/Input.js b/src/elements/Input/Input.js
index 11fa3cc6fe..32407d38fa 100644
--- a/src/elements/Input/Input.js
+++ b/src/elements/Input/Input.js
@@ -72,7 +72,7 @@ const Input = React.forwardRef(function (props, ref) {
   const handleChange = (e) => {
     const newValue = _.get(e, 'target.value')
 
-    _.invoke(props, 'onChange', e, { ...props, value: newValue })
+    _.invoke(props, 'onChange', e, props, newValue)
   }
 
   const partitionProps = () => {
diff --git a/src/modules/Checkbox/Checkbox.d.ts b/src/modules/Checkbox/Checkbox.d.ts
index 8abc03b7f8..88a68bb6e7 100644
--- a/src/modules/Checkbox/Checkbox.d.ts
+++ b/src/modules/Checkbox/Checkbox.d.ts
@@ -1,11 +1,7 @@
 import * as React from 'react'
 import { ForwardRefComponent, HtmlLabelProps, SemanticShorthandItem } from '../../generic'
 
-export interface CheckboxProps extends StrictCheckboxProps {
-  [key: string]: any
-}
-
-export interface StrictCheckboxProps {
+export interface CheckboxProps {
   /** An element type to render as (string or function). */
   as?: any
 
@@ -45,7 +41,12 @@ export interface StrictCheckboxProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props and proposed checked/indeterminate state.
    */
-  onChange?: (event: React.FormEvent<HTMLInputElement>, data: CheckboxProps) => void
+  onChange?: (
+    event: React.FormEvent<HTMLInputElement>,
+    props: CheckboxProps,
+    checked: boolean,
+    indeterminate: boolean,
+  ) => void
 
   /**
    * Called when the checkbox or label is clicked.
@@ -53,7 +54,12 @@ export interface StrictCheckboxProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props and current checked/indeterminate state.
    */
-  onClick?: (event: React.MouseEvent<HTMLInputElement>, data: CheckboxProps) => void
+  onClick?: (
+    event: React.MouseEvent<HTMLInputElement>,
+    props: CheckboxProps,
+    checked: boolean,
+    indeterminate: boolean,
+  ) => void
 
   /**
    * Called when the user presses down on the mouse.
@@ -61,7 +67,12 @@ export interface StrictCheckboxProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props and current checked/indeterminate state.
    */
-  onMouseDown?: (event: React.MouseEvent<HTMLInputElement>, data: CheckboxProps) => void
+  onMouseDown?: (
+    event: React.MouseEvent<HTMLInputElement>,
+    props: CheckboxProps,
+    checked: boolean,
+    indeterminate: boolean,
+  ) => void
 
   /**
    * Called when the user releases the mouse.
@@ -69,7 +80,12 @@ export interface StrictCheckboxProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props and current checked/indeterminate state.
    */
-  onMouseUp?: (event: React.MouseEvent<HTMLInputElement>, data: CheckboxProps) => void
+  onMouseUp?: (
+    event: React.MouseEvent<HTMLInputElement>,
+    props: CheckboxProps,
+    checked: boolean,
+    indeterminate: boolean,
+  ) => void
 
   /** Format as a radio element. This means it is an exclusive option. */
   radio?: boolean
diff --git a/src/modules/Checkbox/Checkbox.js b/src/modules/Checkbox/Checkbox.js
index d183f01feb..b8598f1cfb 100644
--- a/src/modules/Checkbox/Checkbox.js
+++ b/src/modules/Checkbox/Checkbox.js
@@ -96,8 +96,7 @@ const Checkbox = React.forwardRef(function (props, ref) {
 
     debug('handleChange()', _.get(e, 'target.tagName'))
 
-    _.invoke(props, 'onChange', e, {
-      ...props,
+    _.invoke(props, 'onChange', e, props, {
       checked: !checked,
       indeterminate: false,
     })
@@ -117,8 +116,7 @@ const Checkbox = React.forwardRef(function (props, ref) {
 
     // https://github.com/Semantic-Org/Semantic-UI-React/pull/3351
     if (!isLabelClickAndForwardedToInput) {
-      _.invoke(props, 'onClick', e, {
-        ...props,
+      _.invoke(props, 'onClick', e, props, {
         checked: !checked,
         indeterminate: !!indeterminate,
       })
@@ -147,8 +145,7 @@ const Checkbox = React.forwardRef(function (props, ref) {
   const handleMouseDown = (e) => {
     debug('handleMouseDown()')
 
-    _.invoke(props, 'onMouseDown', e, {
-      ...props,
+    _.invoke(props, 'onMouseDown', e, props, {
       checked: !!checked,
       indeterminate: !!indeterminate,
     })
@@ -166,8 +163,7 @@ const Checkbox = React.forwardRef(function (props, ref) {
     debug('handleMouseUp()')
 
     isClickFromMouse.current = true
-    _.invoke(props, 'onMouseUp', e, {
-      ...props,
+    _.invoke(props, 'onMouseUp', e, props, {
       checked: !!checked,
       indeterminate: !!indeterminate,
     })
diff --git a/src/modules/Embed/Embed.d.ts b/src/modules/Embed/Embed.d.ts
index 7420ff9d4b..755becd3be 100644
--- a/src/modules/Embed/Embed.d.ts
+++ b/src/modules/Embed/Embed.d.ts
@@ -8,11 +8,7 @@ import {
 } from '../../generic'
 import { IconProps } from '../../elements/Icon'
 
-export interface EmbedProps extends StrictEmbedProps {
-  [key: string]: any
-}
-
-export interface StrictEmbedProps {
+export interface EmbedProps {
   /** An element type to render as (string or function). */
   as?: any
 
@@ -61,7 +57,7 @@ export interface StrictEmbedProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props and proposed value.
    */
-  onClick?: (event: React.MouseEvent<HTMLDivElement>, data: EmbedProps) => void
+  onClick?: (event: React.MouseEvent<HTMLDivElement>, props: EmbedProps, active: boolean) => void
 
   /** A placeholder image for embed. */
   placeholder?: string
diff --git a/src/modules/Embed/Embed.js b/src/modules/Embed/Embed.js
index 2854feebc9..c3b23397a8 100644
--- a/src/modules/Embed/Embed.js
+++ b/src/modules/Embed/Embed.js
@@ -70,7 +70,7 @@ const Embed = React.forwardRef(function (props, ref) {
   }
 
   const handleClick = (e) => {
-    _.invoke(props, 'onClick', e, { ...props, active: true })
+    _.invoke(props, 'onClick', e, props, true)
     if (!active) {
       setActive(true)
     }
diff --git a/src/modules/Modal/Modal.d.ts b/src/modules/Modal/Modal.d.ts
index 103a4dd94f..f70d2ca9a0 100644
--- a/src/modules/Modal/Modal.d.ts
+++ b/src/modules/Modal/Modal.d.ts
@@ -1,18 +1,14 @@
 import * as React from 'react'
 
 import { ForwardRefComponent, SemanticShorthandItem } from '../../generic'
-import { StrictPortalProps } from '../../addons/Portal'
+import { PortalProps } from '../../addons/Portal'
 import ModalActions, { ModalActionsProps } from './ModalActions'
 import ModalContent, { ModalContentProps } from './ModalContent'
 import ModalDescription from './ModalDescription'
 import ModalDimmer, { ModalDimmerProps } from './ModalDimmer'
 import ModalHeader, { ModalHeaderProps } from './ModalHeader'
 
-export interface ModalProps extends StrictModalProps {
-  [key: string]: any
-}
-
-export interface StrictModalProps extends StrictPortalProps {
+export interface ModalProps extends PortalProps {
   /** An element type to render as (string or function). */
   as?: any
 
@@ -64,7 +60,7 @@ export interface StrictModalProps extends StrictPortalProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  onActionClick?: (event: React.MouseEvent<HTMLElement>, data: ModalProps) => void
+  onActionClick?: (event: React.MouseEvent<HTMLElement>, props: ModalProps) => void
 
   /**
    * Called when a close event happens.
@@ -72,7 +68,7 @@ export interface StrictModalProps extends StrictPortalProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  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.
@@ -80,7 +76,7 @@ export interface StrictModalProps extends StrictPortalProps {
    * @param {null}
    * @param {object} data - All props.
    */
-  onMount?: (nothing: null, data: ModalProps) => void
+  onMount?: (nothing: null, props: ModalProps) => void
 
   /**
    * Called when an open event happens.
@@ -88,7 +84,7 @@ export interface StrictModalProps extends StrictPortalProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  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.
@@ -96,7 +92,7 @@ export interface StrictModalProps extends StrictPortalProps {
    * @param {null}
    * @param {object} data - All props.
    */
-  onUnmount?: (nothing: null, data: ModalProps) => void
+  onUnmount?: (nothing: null, props: ModalProps) => void
 
   /** Controls whether or not the Modal is displayed. */
   open?: boolean
diff --git a/src/modules/Modal/Modal.js b/src/modules/Modal/Modal.js
index eb89025712..75533e1aeb 100644
--- a/src/modules/Modal/Modal.js
+++ b/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) => {
diff --git a/src/modules/Popup/Popup.d.ts b/src/modules/Popup/Popup.d.ts
index 3322c1d0e9..a1905312b6 100644
--- a/src/modules/Popup/Popup.d.ts
+++ b/src/modules/Popup/Popup.d.ts
@@ -2,7 +2,7 @@ import * as React from 'react'
 import * as Popper from '@popperjs/core'
 
 import { SemanticShorthandItem } from '../../generic'
-import { StrictPortalProps } from '../../addons/Portal'
+import { PortalProps } from '../../addons/Portal'
 import PopupContent, { PopupContentProps } from './PopupContent'
 import PopupHeader, { PopupHeaderProps } from './PopupHeader'
 
@@ -13,11 +13,7 @@ type PopperOffsetsFunctionParams = {
 }
 type PopperOffsetsFunction = (params: PopperOffsetsFunctionParams) => [number?, number?]
 
-export interface PopupProps extends StrictPopupProps {
-  [key: string]: any
-}
-
-export interface StrictPopupProps extends StrictPortalProps {
+export interface PopupProps extends PortalProps {
   /** An element type to render as (string or function). */
   as?: any
 
@@ -76,7 +72,7 @@ export interface StrictPopupProps extends StrictPortalProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  onClose?: (event: React.MouseEvent<HTMLElement>, data: PopupProps) => void
+  onClose?: (event: React.MouseEvent<HTMLElement>, props: PopupProps, open: boolean) => void
 
   /**
    * Called when the portal is mounted on the DOM.
@@ -84,7 +80,7 @@ export interface StrictPopupProps extends StrictPortalProps {
    * @param {null}
    * @param {object} data - All props.
    */
-  onMount?: (nothing: null, data: PopupProps) => void
+  onMount?: (nothing: null, props: PopupProps) => void
 
   /**
    * Called when an open event happens.
@@ -92,7 +88,7 @@ export interface StrictPopupProps extends StrictPortalProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  onOpen?: (event: React.MouseEvent<HTMLElement>, data: PopupProps) => void
+  onOpen?: (event: React.MouseEvent<HTMLElement>, props: PopupProps, open: boolean) => void
 
   /**
    * Called when the portal is unmounted from the DOM.
@@ -100,7 +96,7 @@ export interface StrictPopupProps extends StrictPortalProps {
    * @param {null}
    * @param {object} data - All props.
    */
-  onUnmount?: (nothing: null, data: PopupProps) => void
+  onUnmount?: (nothing: null, props: PopupProps) => void
 
   /** Disables automatic repositioning of the component, it will always be placed according to the position value. */
   pinned?: boolean
diff --git a/src/modules/Popup/Popup.js b/src/modules/Popup/Popup.js
index 2c3c9ba4f2..20e0e5502e 100644
--- a/src/modules/Popup/Popup.js
+++ b/src/modules/Popup/Popup.js
@@ -171,12 +171,12 @@ const Popup = React.forwardRef(function (props, ref) {
 
   const handleClose = (e) => {
     debug('handleClose()')
-    _.invoke(props, 'onClose', e, { ...props, open: false })
+    _.invoke(props, 'onClose', e, props, false)
   }
 
   const handleOpen = (e) => {
     debug('handleOpen()')
-    _.invoke(props, 'onOpen', e, { ...props, open: true })
+    _.invoke(props, 'onOpen', e, props, true)
   }
 
   const hideOnScroll = (e) => {
diff --git a/src/modules/Rating/Rating.d.ts b/src/modules/Rating/Rating.d.ts
index 5fccb4c1c3..becaf7070a 100644
--- a/src/modules/Rating/Rating.d.ts
+++ b/src/modules/Rating/Rating.d.ts
@@ -2,11 +2,7 @@ import * as React from 'react'
 import RatingIcon from './RatingIcon'
 import { ForwardRefComponent } from '../../generic'
 
-export interface RatingProps extends StrictRatingProps {
-  [key: string]: any
-}
-
-export interface StrictRatingProps {
+export interface RatingProps {
   /** An element type to render as (string or function). */
   as?: any
 
@@ -38,7 +34,7 @@ export interface StrictRatingProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props and proposed rating.
    */
-  onRate?: (event: React.MouseEvent<HTMLDivElement>, data: RatingProps) => void
+  onRate?: (event: React.MouseEvent<HTMLDivElement>, props: RatingProps, rating: number) => void
 
   /** The current number of active icons. */
   rating?: number | string
diff --git a/src/modules/Rating/Rating.js b/src/modules/Rating/Rating.js
index 0f1274dbea..a5f6ad3510 100644
--- a/src/modules/Rating/Rating.js
+++ b/src/modules/Rating/Rating.js
@@ -58,7 +58,7 @@ const Rating = React.forwardRef(function (props, ref) {
     setRating(newRating)
     setIsSelecting(false)
 
-    _.invoke(props, 'onRate', e, { ...props, rating: newRating })
+    _.invoke(props, 'onRate', e, props, newRating)
   }
 
   const handleIconMouseEnter = (e, { index }) => {
diff --git a/src/modules/Search/Search.d.ts b/src/modules/Search/Search.d.ts
index f35ca846b5..c0115c5d40 100644
--- a/src/modules/Search/Search.d.ts
+++ b/src/modules/Search/Search.d.ts
@@ -7,11 +7,7 @@ import SearchResult, { SearchResultProps } from './SearchResult'
 import SearchResults from './SearchResults'
 import { SearchCategoryLayoutProps } from './SearchCategoryLayout'
 
-export interface SearchProps extends StrictSearchProps {
-  [key: string]: any
-}
-
-export interface StrictSearchProps {
+export interface SearchProps {
   /** An element type to render as (string or function). */
   as?: any
 
@@ -95,7 +91,7 @@ export interface StrictSearchProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  onBlur?: (event: React.MouseEvent<HTMLElement>, data: SearchProps) => void
+  onBlur?: (event: React.MouseEvent<HTMLElement>, props: SearchProps) => void
 
   /**
    * Called on focus.
@@ -103,7 +99,7 @@ export interface StrictSearchProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  onFocus?: (event: React.MouseEvent<HTMLElement>, data: SearchProps) => void
+  onFocus?: (event: React.MouseEvent<HTMLElement>, props: SearchProps) => void
 
   /**
    * Called on mousedown.
@@ -111,7 +107,7 @@ export interface StrictSearchProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  onMouseDown?: (event: React.MouseEvent<HTMLElement>, data: SearchProps) => void
+  onMouseDown?: (event: React.MouseEvent<HTMLElement>, props: SearchProps) => void
 
   /**
    * Called when a result is selected.
@@ -119,7 +115,11 @@ export interface StrictSearchProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  onResultSelect?: (event: React.MouseEvent<HTMLDivElement>, data: SearchResultData) => void
+  onResultSelect?: (
+    event: React.MouseEvent<HTMLDivElement>,
+    props: SearchProps,
+    result: any,
+  ) => void
 
   /**
    * Called on search input change.
@@ -127,7 +127,7 @@ export interface StrictSearchProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props, includes current value of search input.
    */
-  onSearchChange?: (event: React.MouseEvent<HTMLElement>, data: SearchProps) => void
+  onSearchChange?: (event: React.MouseEvent<HTMLElement>, props: SearchProps, query: string) => void
 
   /**
    * Called when the active selection index is changed.
@@ -135,7 +135,11 @@ export interface StrictSearchProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  onSelectionChange?: (event: React.MouseEvent<HTMLElement>, data: SearchResultData) => void
+  onSelectionChange?: (
+    event: React.MouseEvent<HTMLElement>,
+    props: SearchProps,
+    result: any,
+  ) => void
 
   // ------------------------------------
   // Style
@@ -166,10 +170,6 @@ export interface StrictSearchProps {
   placeholder?: string
 }
 
-export interface SearchResultData extends SearchProps {
-  result: any
-}
-
 declare const Search: ForwardRefComponent<SearchProps, HTMLDivElement> & {
   Category: typeof SearchCategory
   Result: typeof SearchResult
diff --git a/src/modules/Search/Search.js b/src/modules/Search/Search.js
index 5e5e0ed5b8..c2bf5f6c74 100644
--- a/src/modules/Search/Search.js
+++ b/src/modules/Search/Search.js
@@ -152,14 +152,14 @@ class SearchInner extends Component {
     debug('handleResultSelect()')
     debug(result)
 
-    _.invoke(this.props, 'onResultSelect', e, { ...this.props, result })
+    _.invoke(this.props, 'onResultSelect', e, this.props, { result })
   }
 
   handleSelectionChange = (e) => {
     debug('handleSelectionChange()')
 
     const result = this.getSelectedResult()
-    _.invoke(this.props, 'onSelectionChange', e, { ...this.props, result })
+    _.invoke(this.props, 'onSelectionChange', e, this.props, { result })
   }
 
   closeOnEscape = (e) => {
@@ -282,7 +282,7 @@ class SearchInner extends Component {
     const { open } = this.state
     const newQuery = e.target.value
 
-    _.invoke(this.props, 'onSearchChange', e, { ...this.props, value: newQuery })
+    _.invoke(this.props, 'onSearchChange', e, this.props, newQuery)
 
     // open search dropdown on search query
     if (newQuery.length < minCharacters) {
diff --git a/src/modules/Sidebar/Sidebar.d.ts b/src/modules/Sidebar/Sidebar.d.ts
index 353c807b18..ec2415bf79 100644
--- a/src/modules/Sidebar/Sidebar.d.ts
+++ b/src/modules/Sidebar/Sidebar.d.ts
@@ -4,11 +4,7 @@ import { ForwardRefComponent, SemanticShorthandContent } from '../../generic'
 import SidebarPushable from './SidebarPushable'
 import SidebarPusher from './SidebarPusher'
 
-export interface SidebarProps extends StrictSidebarProps {
-  [key: string]: any
-}
-
-export interface StrictSidebarProps {
+export interface SidebarProps {
   /** An element type to render as (string or function). */
   as?: any
 
@@ -33,7 +29,7 @@ export interface StrictSidebarProps {
    * @param {SyntheticEvent} event - React's original SyntheticEvent.
    * @param {object} data - All props.
    */
-  onHide?: (event: React.MouseEvent<HTMLElement>, data: SidebarProps) => void
+  onHide?: (event: React.MouseEvent<HTMLElement>, props: SidebarProps, visible: boolean) => void
 
   /**
    * Called after a sidebar has finished animating out.
@@ -41,7 +37,7 @@ export interface StrictSidebarProps {
    * @param {null}
    * @param {object} data - All props.
    */
-  onHidden?: (event: React.MouseEvent<HTMLElement>, data: SidebarProps) => void
+  onHidden?: (event: React.MouseEvent<HTMLElement>, props: SidebarProps) => void
 
   /**
    * Called when a sidebar has finished animating in.
@@ -49,7 +45,7 @@ export interface StrictSidebarProps {
    * @param {null}
    * @param {object} data - All props.
    */
-  onShow?: (event: React.MouseEvent<HTMLElement>, data: SidebarProps) => void
+  onShow?: (event: React.MouseEvent<HTMLElement>, props: SidebarProps) => void
 
   /**
    * Called when a sidebar begins animating in.
@@ -57,7 +53,7 @@ export interface StrictSidebarProps {
    * @param {null}
    * @param {object} data - All props.
    */
-  onVisible?: (event: React.MouseEvent<HTMLElement>, data: SidebarProps) => void
+  onVisible?: (event: React.MouseEvent<HTMLElement>, props: SidebarProps) => void
 
   /** A sidebar can handle clicks on the passed element. */
   target?: Document | Window | HTMLElement | React.RefObject<HTMLElement>
diff --git a/src/modules/Sidebar/Sidebar.js b/src/modules/Sidebar/Sidebar.js
index 0489850b56..7ebe8c5b51 100644
--- a/src/modules/Sidebar/Sidebar.js
+++ b/src/modules/Sidebar/Sidebar.js
@@ -91,7 +91,7 @@ const Sidebar = React.forwardRef((props, ref) => {
   const handleDocumentClick = (e) => {
     if (!doesNodeContainClick(elementRef.current, e)) {
       skipNextCallback.current = true
-      _.invoke(props, 'onHide', e, { ...props, visible: false })
+      _.invoke(props, 'onHide', e, props, false)
     }
   }
 
diff --git a/src/modules/Tab/Tab.d.ts b/src/modules/Tab/Tab.d.ts
index 7d71cb55fa..bb6b61f7ae 100644
--- a/src/modules/Tab/Tab.d.ts
+++ b/src/modules/Tab/Tab.d.ts
@@ -3,11 +3,7 @@ import * as React from 'react'
 import { ForwardRefComponent, SemanticShorthandItem } from '../../generic'
 import { TabPaneProps } from './TabPane'
 
-export interface TabProps extends StrictTabProps {
-  [key: string]: any
-}
-
-export interface StrictTabProps {
+export interface TabProps {
   /** An element type to render as (string or function). */
   as?: any
 
@@ -34,7 +30,11 @@ export interface StrictTabProps {
    * @param {object} data.activeIndex - The new proposed activeIndex.
    * @param {object} data.panes - Props of the new proposed active pane.
    */
-  onTabChange?: (event: React.MouseEvent<HTMLDivElement>, data: TabProps) => void
+  onTabChange?: (
+    event: React.MouseEvent<HTMLDivElement>,
+    props: TabProps,
+    activeIndex: number | string,
+  ) => void
 
   /**
    * Array of objects describing each Menu.Item and Tab.Pane:
diff --git a/src/modules/Tab/Tab.js b/src/modules/Tab/Tab.js
index cbbac2bf46..6d045a68cd 100644
--- a/src/modules/Tab/Tab.js
+++ b/src/modules/Tab/Tab.js
@@ -34,7 +34,7 @@ const Tab = React.forwardRef(function (props, ref) {
   })
 
   const handleItemClick = (e, { index }) => {
-    _.invoke(props, 'onTabChange', e, { ...props, activeIndex: index })
+    _.invoke(props, 'onTabChange', e, props, { activeIndex: index })
     setActiveIndex(index)
   }
 
diff --git a/src/modules/Transition/Transition.d.ts b/src/modules/Transition/Transition.d.ts
index b7463df915..3f34782372 100644
--- a/src/modules/Transition/Transition.d.ts
+++ b/src/modules/Transition/Transition.d.ts
@@ -5,11 +5,7 @@ import TransitionGroup from './TransitionGroup'
 
 export type TRANSITION_STATUSES = 'ENTERED' | 'ENTERING' | 'EXITED' | 'EXITING' | 'UNMOUNTED'
 
-export interface TransitionProps extends StrictTransitionProps {
-  [key: string]: any
-}
-
-export interface StrictTransitionProps {
+export interface TransitionProps {
   /** Named animation event to used. Must be defined in CSS. */
   animation?: SemanticTRANSITIONS | string
 
@@ -34,7 +30,7 @@ export interface StrictTransitionProps {
    * @param {null}
    * @param {object} data - All props with status.
    */
-  onComplete?: (nothing: null, data: TransitionEventData) => void
+  onComplete?: (nothing: null, props: TransitionProps, status: TRANSITION_STATUSES) => void
 
   /**
    * Callback on each transition that changes visibility to hidden.
@@ -42,7 +38,7 @@ export interface StrictTransitionProps {
    * @param {null}
    * @param {object} data - All props with status.
    */
-  onHide?: (nothing: null, data: TransitionEventData) => void
+  onHide?: (nothing: null, props: TransitionProps, status: TRANSITION_STATUSES) => void
 
   /**
    * Callback on each transition that changes visibility to shown.
@@ -50,7 +46,7 @@ export interface StrictTransitionProps {
    * @param {null}
    * @param {object} data - All props with status.
    */
-  onShow?: (nothing: null, data: TransitionEventData) => void
+  onShow?: (nothing: null, props: TransitionProps, status: TRANSITION_STATUSES) => void
 
   /**
    * Callback on animation start.
@@ -58,7 +54,7 @@ export interface StrictTransitionProps {
    * @param {null}
    * @param {object} data - All props with status.
    */
-  onStart?: (nothing: null, data: TransitionEventData) => void
+  onStart?: (nothing: null, props: TransitionProps, status: TRANSITION_STATUSES) => void
 
   /** React's key of the element. */
   reactKey?: string
@@ -70,10 +66,6 @@ export interface StrictTransitionProps {
   unmountOnHide?: boolean
 }
 
-export interface TransitionEventData extends TransitionProps {
-  status: TRANSITION_STATUSES
-}
-
 export interface TransitionPropDuration {
   hide: number
   show: number
diff --git a/src/modules/Transition/Transition.js b/src/modules/Transition/Transition.js
index 3ad3c88018..2bc7aa33cd 100644
--- a/src/modules/Transition/Transition.js
+++ b/src/modules/Transition/Transition.js
@@ -97,14 +97,14 @@ export default class Transition extends React.Component {
     }
 
     if (!prevState.animating && this.state.animating) {
-      _.invoke(this.props, 'onStart', null, { ...this.props, status: this.state.status })
+      _.invoke(this.props, 'onStart', null, this.props, this.state.status)
     }
 
     if (prevState.animating && !this.state.animating) {
       const callback = this.state.status === TRANSITION_STATUS_ENTERED ? 'onShow' : 'onHide'
 
-      _.invoke(this.props, 'onComplete', null, { ...this.props, status: this.state.status })
-      _.invoke(this.props, callback, null, { ...this.props, status: this.state.status })
+      _.invoke(this.props, 'onComplete', null, this.props, this.state.status)
+      _.invoke(this.props, callback, null, this.props, this.state.status)
     }
   }