Add new experimental version of DropdownMenu#49473
Conversation
|
Size Change: +22.7 kB (+2%) Total Size: 1.4 MB
ℹ️ View Unchanged
|
|
Flaky tests detected in 3348933. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/4930719519
|
147b772 to
6ff0d65
Compare
6ff0d65 to
a76f622
Compare
| children: { control: { type: null } }, | ||
| trigger: { control: { type: null } }, |
There was a problem hiding this comment.
There is currently a console warning generated by Storybook, which seems caused by the React components passed in the children and trigger props being Emotion styled components:
We've detected a cycle in arg 'components-radix-dropdownmenu--default.trigger'. Args should be JSON-serializable.
Consider using the mapping feature or fully custom args:
- Mapping: https://storybook.js.org/docs/react/writing-stories/args#mapping-to-complex-arg-values
- Custom args: https://storybook.js.org/docs/react/essentials/controls#fully-custom-args
| } | ||
| ); | ||
|
|
||
| export const DropdownMenuCheckboxItem = ( { |
There was a problem hiding this comment.
Noting that checkbox and radio items don't have a prefix, since the prefix slot is taken by the check/radio icons
|
At this point, I believe that most API-related discussions have been solved. The last one, IMO, is related to whether we should allow for standard HTML attributes to be passed to the dropdown components — for example, |
I think we can start off with not passing through props until we have a use case.
If this level of customization ever becomes a requirement, it might be good to start considering a full export of all the underlying subcomponents. I don't really foresee that for DropdownMenu though. |
|
@mirka , this PR should now be ready for review 🤞 |
…nu-v2 folder, fix docs
299ba14 to
ddc1aa8
Compare
…ports across the package
|
Thank you @mirka for the review! I addressed the feedback and rebased on top of latest |
…dd/static-closures * 'trunk' of https://github.com/WordPress/gutenberg: (26 commits) Add transparent outline to input control BackdropUI focus style. (#50772) Added wrapper element for RichText in File block (#50607) Remove the experimental flag of the command center (#50781) Update the document title in the site editor to open the command center (#50369) Remove `unwrap` from transforms and add `ungroup` to more blocks (#50385) Add new experimental version of DropdownMenu (#49473) Force display of in custom css input boxes to LTR (#50768) Polish experimental navigation block (#50670) Support negation operator in selectors in the Interactivity API (#50732) Minor updates to theme.json schema pages (#50742) $revisions_controller is not used. Let's delete it. (#50763) Remove OffCanvasEditor (#50705) Mobile - E2E test - Update code to use the new navigateUp helper (#50736) Try: Smaller external link icon (#50728) Block Editor: Remove unused 'useIsDimensionsSupportValid' method (#50735) Fix flaky media inserter drag-and-dropping e2e test (#50740) docs: Fix change log typo (#50737) Edit Site: Fix `useEditedEntityRecord()` loading state (#50730) Fix labelling, description, and focus style of the block transform to pattern previews (#50577) Fix Global Styles sidebar block selection on zoom out mode (#50708) ...
What?
Related to:
Useful links:
This PR introduces a new version of the
DropdownMenucomponent, which adds extra capabilities to the component (notable, submenus) and introduces a refreshed design.Why?
With the need to support nested submenus, we're experimenting with using third-party libraries for UI patterns that are standardized and would be otherwise complex to implement and maintain.
How?
v1folder, and added the new implementation into av2folderlock/unlockprivate APIsTesting Instructions
Test the component in the Storybook example
Screenshots or screencast