-
Notifications
You must be signed in to change notification settings - Fork 116
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(controls): Add forwardRef to Dropdown and Checkbox #1381
Conversation
@@ -0,0 +1,7 @@ | |||
import React from 'react'; | |||
|
|||
declare module 'react' { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is needed because React.forwardRef
doesn't support Generics typing
return ( | ||
<div ref={dropdownElRef} className={classNames('bp-SettingsDropdown', className)}> | ||
<div className={classNames('bp-SettingsDropdown', className)}> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Moved the ref to a separate container on L92 so that clicking on the label is a valid way to close the dropdown
@@ -74,52 +71,69 @@ export default function SettingsDropdown<V extends Value = string>({ | |||
|
|||
useClickOutside(dropdownElRef, () => setIsOpen(false)); | |||
|
|||
// Customize the forwarded ref to combine usage with the ref internal to this component | |||
React.useImperativeHandle( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It seems unorthodox to expose the button as the component's ref, since it's a compound component. If we want to expose the dropdown itself later, that could get confusing.
Fixes an issue where a console error occurs when opening the
Model3DSettings
menu becauseSettingsList
attempts to set focus to the menu item that correlates to theactiveIndex
. SinceSettingsDropdown
andSettingsCheckboxItem
are functional components, an error is logged.TODO: