-
Notifications
You must be signed in to change notification settings - Fork 2.2k
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
[core] feat(MenuItem): forward MenuProps to submenu #5336
[core] feat(MenuItem): forward MenuProps to submenu #5336
Conversation
/** | ||
* Props to spread to the `Menu` within the `Popover`. | ||
*/ | ||
menuProps?: Partial<MenuProps> & object; |
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.
we don't need & object
... that's a weird quirk from an older version of TypeScript that's no longer necessary.
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.
also I think we should call this prop submenuProps
menuProps?: Partial<MenuProps> & object; | |
submenuProps?: Partial<MenuProps>; |
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.
I agree with the name change.
So the issue with just Partial<MenuProps>
is that MenuProps
doesn't have the commonly used prop data-testid
. Any Ideas on how we can get that in there?
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.
hmm, there's no good way to do that in the object type. data-*
attributes work in JSX because they're built into React. I guess you can leave the & object
in this type and leave a note in the JSDoc about why it's there.
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.
How would you describe that? Like this?
/**
* Props to spread to the child Menu
component if this item has a submenu.
* & object
allows for data-*
attributes to be passed.
*/
Co-authored-by: Adi Dahiya <adi.dahiya14@gmail.com>
Co-authored-by: Adi Dahiya <adi.dahiya14@gmail.com>
*/ | ||
menuProps?: Partial<MenuProps> & object; |
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.
actually, it's an implementation detail, so it should be a code comment for devs rather than JSDoc:
*/ | |
menuProps?: Partial<MenuProps> & object; | |
*/ | |
// note that `& object` is required to allow attributes built-in to JSX like "data-testid" | |
submenuProps?: Partial<MenuProps> & object; |
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.
I'm just going to remove the & object
, that actually didn't solve it. Just Partial<MenuProps>
is fine.
Fixes #5335
Checklist
Changes proposed in this pull request:
Allow
menuProps
to be passed toMenuItem
that get forwarded to theMenu
created within thePopover
button.