diff --git a/packages/web-react/docs/stories/examples/ModalWithDropdown.stories.tsx b/packages/web-react/docs/stories/examples/ModalWithDropdown.stories.tsx
index e73999fe19..98b1c27fa0 100644
--- a/packages/web-react/docs/stories/examples/ModalWithDropdown.stories.tsx
+++ b/packages/web-react/docs/stories/examples/ModalWithDropdown.stories.tsx
@@ -34,7 +34,7 @@ export const ModalWithDropdown = () => {
           <ModalHeader />
           <ModalBody>
             <Dropdown id="modal-with-dropdown" isOpen={isDropdownOpen} onToggle={toggleDropdown}>
-              <DropdownTrigger elementType="button">Dropdown is {isDropdownOpen ? 'open' : 'closed'}</DropdownTrigger>
+              <DropdownTrigger elementType={Button}>Dropdown is {isDropdownOpen ? 'open' : 'closed'}</DropdownTrigger>
               <DropdownPopover>
                 <a href="#info" className="d-flex mb-400">
                   <Text UNSAFE_className="ml-300">Information</Text>
diff --git a/packages/web-react/src/components/Dropdown/DropdownTrigger.tsx b/packages/web-react/src/components/Dropdown/DropdownTrigger.tsx
index b7b9b1aa5b..deffc66995 100644
--- a/packages/web-react/src/components/Dropdown/DropdownTrigger.tsx
+++ b/packages/web-react/src/components/Dropdown/DropdownTrigger.tsx
@@ -21,13 +21,13 @@ export const DropdownTrigger = <T extends ElementType = 'button'>(props: Dropdow
 
   return (
     <Component
+      {...rest} // ⚠️ This is maybe a bug, when component is pass via `elementType` prop, the rest props are passed to the component
+      {...otherProps}
+      {...triggerProps}
       id={id}
-      {...rest}
       ref={triggerRef}
       className={classNames(classProps.trigger, styleProps.className)}
       style={styleProps.style}
-      {...triggerProps}
-      {...otherProps}
     >
       {typeof children === 'function' ? children({ isOpen }) : children}
     </Component>