-
Notifications
You must be signed in to change notification settings - Fork 355
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
chore(composable menu demos): updated appendTo #8623
chore(composable menu demos): updated appendTo #8623
Conversation
Preview: https://patternfly-react-pr-8623.surge.sh A11y report: https://patternfly-react-pr-8623-a11y.surge.sh |
@thatblindgeye is there a reason we cannot append it to the toggle itself? It appears that if I append it to the toggleRef.current, it appears stylistically to work. But I haven't played with it extensively. |
Doing that ends up placing the menu inside the |
riiiiight |
5dfa77b
to
f8c6f25
Compare
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.
Your alternate solution does sound pretty appealing. If all the demos already have a parent wrapping div, we can remove one level of div nesting - am I understanding that right?
Yep! Appending to the toggle's parent results in the following markup: (quick note that my latest comment in my Popover PR could also apply to these demos as well) |
Just a point of caution for the alternate solution as the wrapping |
f8c6f25
to
1b8b98c
Compare
Latest update based on 8669 linked above getting merged in first. |
1b8b98c
to
0fb481c
Compare
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 beautiful 🥹
What: Closes #8600
Composable menu demos
Moved the
<div ref={containerRef}>
wrapper to the toggle, which is similar to the proposed solution for the "Editable labels with add dropdown" demo in the epic.Alternatively since all of these demos are setup the same way, we could append to
toggleRef.current.parent
, which should always be the wrapper div provided by Popper withstyle="display: contents"
:Additional issues: