fix(Dropdown): use ref forwarding (#4338)

Semantic-Org · Apr 22, 2022 · d527a67 · d527a67
1 parent f7dd938
commit d527a67
Show file tree

Hide file tree

Showing 3 changed files with 288 additions and 256 deletions.
diff --git a/src/modules/Dropdown/Dropdown.js b/src/modules/Dropdown/Dropdown.js
@@ -64,7 +64,11 @@ function renderItemContent(item) {
  * @see Select
  * @see Menu
  */
-export default class Dropdown extends Component {
+const Dropdown = React.forwardRef((props, ref) => {
+  return <DropdownInner {...props} innerRef={ref} />
+})
+
+class DropdownInner extends Component {
   searchRef = createRef()
   sizerRef = createRef()
   ref = createRef()
@@ -1431,6 +1435,7 @@ Dropdown.propTypes = {
   wrapSelection: PropTypes.bool,
 }
 
+Dropdown.displayName = 'Dropdown'
 Dropdown.defaultProps = {
   additionLabel: 'Add ',
   additionPosition: 'top',
@@ -1448,11 +1453,18 @@ Dropdown.defaultProps = {
   wrapSelection: true,
 }
 
-Dropdown.autoControlledProps = ['open', 'searchQuery', 'selectedLabel', 'value', 'upward']
+DropdownInner.autoControlledProps = ['open', 'searchQuery', 'selectedLabel', 'value', 'upward']
+
+if (process.env.NODE_ENV !== 'production') {
+  DropdownInner.defaultProps = Dropdown.defaultProps
+  DropdownInner.propTypes = Dropdown.propTypes
+}
 
 Dropdown.Divider = DropdownDivider
 Dropdown.Header = DropdownHeader
 Dropdown.Item = DropdownItem
 Dropdown.Menu = DropdownMenu
 Dropdown.SearchInput = DropdownSearchInput
 Dropdown.Text = DropdownText
+
+export default Dropdown